Add 'packages/svelte-standard-site/' from commit '86f3057e84ec12fe01728947f3508d49d0a6d85e'

git-subtree-dir: packages/svelte-standard-site
git-subtree-mainline: d68efed13c3482d40190912f9e30f674c79c0575
git-subtree-split: 86f3057e84ec12fe01728947f3508d49d0a6d85e

packages/svelte-standard-site/.env.example

···
+# Required: Your AT Protocol DID
+PUBLIC_ATPROTO_DID=did:plc:revjuqmkvrw6fnkxppqtszpv
+
+# Optional: Custom PDS endpoint (will be auto-resolved if not provided)
+# PUBLIC_ATPROTO_PDS=https://cortinarius.us-west.host.bsky.network
+
+# Optional: Cache TTL in milliseconds (default: 300000 = 5 minutes)
+# PUBLIC_CACHE_TTL=300000

packages/svelte-standard-site/.gitignore

···
+node_modules
+
+# Output
+.output
+.vercel
+.netlify
+.wrangler
+/.svelte-kit
+/build
+/dist
+
+# OS
+.DS_Store
+Thumbs.db
+
+# Env
+.env
+.env.*
+!.env.example
+!.env.test
+
+# Vite
+vite.config.js.timestamp-*
+vite.config.ts.timestamp-*

packages/svelte-standard-site/.npmrc

···
+engine-strict=true

packages/svelte-standard-site/.prettierignore

···
+# Package Managers
+package-lock.json
+pnpm-lock.yaml
+yarn.lock
+bun.lock
+bun.lockb
+
+# Miscellaneous
+/static/

packages/svelte-standard-site/.prettierrc

···
+{
+	"useTabs": true,
+	"singleQuote": true,
+	"trailingComma": "none",
+	"printWidth": 100,
+	"plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
+	"overrides": [
+		{
+			"files": "*.svelte",
+			"options": {
+				"parser": "svelte"
+			}
+		}
+	],
+	"tailwindStylesheet": "./src/routes/layout.css"
+}

packages/svelte-standard-site/.vscode/settings.json

···
+{
+	"files.associations": {
+		"*.css": "tailwindcss"
+	}
+}

packages/svelte-standard-site/API.md

···
+# API Reference
+
+Complete API documentation for svelte-standard-site.
+
+## Table of Contents
+
+- [Components](#components)
+- [Stores](#stores)
+- [Client](#client)
+- [Types](#types)
+- [Utilities](#utilities)
+
+## Components
+
+### StandardSiteLayout
+
+A complete page layout with header, footer, and built-in theme management.
+
+```typescript
+interface StandardSiteLayoutProps {
+	/** Site title displayed in header */
+	title?: string;
+	/** Custom header content (replaces default header) */
+	header?: Snippet;
+	/** Custom footer content (replaces default footer) */
+	footer?: Snippet;
+	/** Main content */
+	children: Snippet;
+	/** Additional CSS classes for main container */
+	class?: string;
+	/** Show theme toggle button in default header */
+	showThemeToggle?: boolean;
+}
+```
+
+**Default Values:**
+
+- `title`: `"My Site"`
+- `showThemeToggle`: `true`
+
+**Usage:**
+
+```svelte
+<StandardSiteLayout title="My Site">
+	<h1>Content here</h1>
+</StandardSiteLayout>
+```
+
+**With Custom Header:**
+
+```svelte
+<StandardSiteLayout title="My Site">
+	{#snippet header()}
+		<nav>Custom header</nav>
+	{/snippet}
+
+	<h1>Content</h1>
+</StandardSiteLayout>
+```
+
+---
+
+### ThemeToggle
+
+A button component for toggling between light and dark modes with smooth animations.
+
+```typescript
+interface ThemeToggleProps {
+	/** Additional CSS classes */
+	class?: string;
+}
+```
+
+**Usage:**
+
+```svelte
+<ThemeToggle class="ml-auto" />
+```
+
+**Features:**
+
+- Smooth icon transitions
+- System preference detection
+- Persistent theme storage
+- Loading state indicator
+- Accessible ARIA labels
+
+---
+
+### DocumentCard
+
+Displays a `site.standard.document` record as a styled card with cover image, metadata, and tags.
+
+```typescript
+interface DocumentCardProps {
+	/** The document record to display */
+	document: AtProtoRecord<Document>;
+	/** Additional CSS classes */
+	class?: string;
+	/** Whether to show the cover image */
+	showCover?: boolean;
+	/** Custom href override (defaults to /[pub_rkey]/[doc_rkey]) */
+	href?: string;
+}
+```
+
+**Default Values:**
+
+- `showCover`: `true`
+- `href`: Auto-generated from document URI
+
+**Usage:**
+
+```svelte
+<DocumentCard {document} showCover={true} class="shadow-lg" />
+```
+
+**Features:**
+
+- Responsive design
+- Cover image display
+- Date formatting
+- Tag pills
+- Hover states
+- Dark mode support
+
+---
+
+### PublicationCard
+
+Displays a `site.standard.publication` record with icon, description, and external link.
+
+```typescript
+interface PublicationCardProps {
+	/** The publication record to display */
+	publication: AtProtoRecord<Publication>;
+	/** Additional CSS classes */
+	class?: string;
+	/** Whether to show external link icon */
+	showExternalIcon?: boolean;
+}
+```
+
+**Default Values:**
+
+- `showExternalIcon`: `true`
+
+**Usage:**
+
+```svelte
+<PublicationCard {publication} showExternalIcon={true} />
+```
+
+**Features:**
+
+- Icon display
+- Theme color support
+- External link indicator
+- Hover states
+- Dark mode support
+
+---
+
+## Stores
+
+### themeStore
+
+A Svelte store for managing light/dark theme state.
+
+```typescript
+interface ThemeState {
+	isDark: boolean;
+	mounted: boolean;
+}
+
+interface ThemeStore {
+	subscribe: (callback: (state: ThemeState) => void) => () => void;
+	init: () => void | (() => void);
+	toggle: () => void;
+	setTheme: (isDark: boolean) => void;
+}
+```
+
+**Methods:**
+
+#### `init()`
+
+Initialize the theme store. Automatically detects saved preference and system preference.
+
+```typescript
+import { themeStore } from 'svelte-standard-site';
+import { onMount } from 'svelte';
+
+onMount(() => {
+	themeStore.init();
+});
+```
+
+**Returns:** Optional cleanup function
+
+#### `toggle()`
+
+Toggle between light and dark modes.
+
+```typescript
+themeStore.toggle();
+```
+
+#### `setTheme(isDark: boolean)`
+
+Set a specific theme mode.
+
+```typescript
+themeStore.setTheme(true); // Dark mode
+themeStore.setTheme(false); // Light mode
+```
+
+#### `subscribe(callback)`
+
+Subscribe to theme changes.
+
+```typescript
+const unsubscribe = themeStore.subscribe((state) => {
+	console.log('Dark mode:', state.isDark);
+	console.log('Mounted:', state.mounted);
+});
+
+// Don't forget to unsubscribe
+unsubscribe();
+```
+
+**State Properties:**
+
+- `isDark: boolean` - Current theme state (true = dark, false = light)
+- `mounted: boolean` - Whether the store has been initialized
+
+---
+
+## Client
+
+### SiteStandardClient
+
+Main client for fetching AT Protocol records.
+
+```typescript
+class SiteStandardClient {
+	constructor(config: SiteStandardConfig);
+
+	// Fetch methods
+	fetchPublication(
+		rkey: string,
+		fetchFn?: typeof fetch
+	): Promise<AtProtoRecord<Publication> | null>;
+	fetchAllPublications(fetchFn?: typeof fetch): Promise<AtProtoRecord<Publication>[]>;
+	fetchDocument(rkey: string, fetchFn?: typeof fetch): Promise<AtProtoRecord<Document> | null>;
+	fetchAllDocuments(fetchFn?: typeof fetch): Promise<AtProtoRecord<Document>[]>;
+	fetchDocumentsByPublication(
+		publicationUri: string,
+		fetchFn?: typeof fetch
+	): Promise<AtProtoRecord<Document>[]>;
+	fetchByAtUri<T>(atUri: string, fetchFn?: typeof fetch): Promise<AtProtoRecord<T> | null>;
+
+	// Utility methods
+	clearCache(): void;
+	getPDS(fetchFn?: typeof fetch): Promise<string>;
+}
+```
+
+### createClient()
+
+Factory function for creating a client instance.
+
+```typescript
+function createClient(config: SiteStandardConfig): SiteStandardClient;
+```
+
+**Usage:**
+
+```typescript
+import { createClient } from 'svelte-standard-site';
+
+const client = createClient({
+	did: 'did:plc:your-did-here',
+	pds: 'https://your-pds.example.com', // optional
+	cacheTTL: 300000 // optional, 5 minutes
+});
+```
+
+---
+
+### Methods
+
+#### `fetchPublication(rkey, fetchFn?)`
+
+Fetch a single publication by record key.
+
+**Parameters:**
+
+- `rkey: string` - The record key
+- `fetchFn?: typeof fetch` - Optional custom fetch function (for SSR)
+
+**Returns:** `Promise<AtProtoRecord<Publication> | null>`
+
+**Example:**
+
+```typescript
+const pub = await client.fetchPublication('3lwafzkjqm25s');
+if (pub) {
+	console.log(pub.value.name);
+}
+```
+
+---
+
+#### `fetchAllPublications(fetchFn?)`
+
+Fetch all publications for the configured DID.
+
+**Parameters:**
+
+- `fetchFn?: typeof fetch` - Optional custom fetch function
+
+**Returns:** `Promise<AtProtoRecord<Publication>[]>`
+
+**Example:**
+
+```typescript
+const pubs = await client.fetchAllPublications();
+console.log(`Found ${pubs.length} publications`);
+```
+
+---
+
+#### `fetchDocument(rkey, fetchFn?)`
+
+Fetch a single document by record key.
+
+**Parameters:**
+
+- `rkey: string` - The record key
+- `fetchFn?: typeof fetch` - Optional custom fetch function
+
+**Returns:** `Promise<AtProtoRecord<Document> | null>`
+
+---
+
+#### `fetchAllDocuments(fetchFn?)`
+
+Fetch all documents, sorted by `publishedAt` (newest first).
+
+**Parameters:**
+
+- `fetchFn?: typeof fetch` - Optional custom fetch function
+
+**Returns:** `Promise<AtProtoRecord<Document>[]>`
+
+**Example:**
+
+```typescript
+const docs = await client.fetchAllDocuments();
+const latest = docs[0]; // Most recent document
+```
+
+---
+
+#### `fetchDocumentsByPublication(publicationUri, fetchFn?)`
+
+Fetch all documents belonging to a specific publication.
+
+**Parameters:**
+
+- `publicationUri: string` - AT URI of the publication
+- `fetchFn?: typeof fetch` - Optional custom fetch function
+
+**Returns:** `Promise<AtProtoRecord<Document>[]>`
+
+**Example:**
+
+```typescript
+const docs = await client.fetchDocumentsByPublication(
+	'at://did:plc:xxx/site.standard.publication/rkey'
+);
+```
+
+---
+
+#### `fetchByAtUri<T>(atUri, fetchFn?)`
+
+Fetch any record by its AT URI.
+
+**Parameters:**
+
+- `atUri: string` - The AT URI
+- `fetchFn?: typeof fetch` - Optional custom fetch function
+
+**Returns:** `Promise<AtProtoRecord<T> | null>`
+
+**Example:**
+
+```typescript
+const record = await client.fetchByAtUri<Document>('at://did:plc:xxx/site.standard.document/rkey');
+```
+
+---
+
+#### `clearCache()`
+
+Clear all cached data.
+
+**Example:**
+
+```typescript
+client.clearCache();
+```
+
+---
+
+#### `getPDS(fetchFn?)`
+
+Get the resolved PDS endpoint for the configured DID.
+
+**Parameters:**
+
+- `fetchFn?: typeof fetch` - Optional custom fetch function
+
+**Returns:** `Promise<string>`
+
+**Example:**
+
+```typescript
+const pds = await client.getPDS();
+console.log(`Using PDS: ${pds}`);
+```
+
+---
+
+## Types
+
+### Core Types
+
+```typescript
+interface AtProtoRecord<T> {
+	uri: string;
+	cid: string;
+	value: T;
+}
+
+interface AtProtoBlob {
+	$type: 'blob';
+	ref: { $link: string };
+	mimeType: string;
+	size: number;
+}
+
+interface StrongRef {
+	uri: string;
+	cid: string;
+}
+```
+
+### Publication Types
+
+```typescript
+interface Publication {
+	$type: 'site.standard.publication';
+	url: string;
+	name: string;
+	icon?: AtProtoBlob;
+	description?: string;
+	basicTheme?: BasicTheme;
+	preferences?: PublicationPreferences;
+}
+
+interface BasicTheme {
+	primary: RGBColor;
+	secondary: RGBColor;
+	accent: RGBColor;
+}
+
+interface RGBColor {
+	r: number; // 0-255
+	g: number; // 0-255
+	b: number; // 0-255
+}
+
+interface PublicationPreferences {
+	defaultShowCoverImage?: boolean;
+	allowComments?: boolean;
+	allowReactions?: boolean;
+}
+```
+
+### Document Types
+
+```typescript
+interface Document {
+	$type: 'site.standard.document';
+	site: string; // AT URI or HTTPS URL to publication
+	title: string;
+	path?: string;
+	description?: string;
+	coverImage?: AtProtoBlob;
+	content?: any; // Rich content object
+	textContent?: string; // Plain text fallback
+	bskyPostRef?: StrongRef; // Reference to Bluesky post
+	tags?: string[];
+	publishedAt: string; // ISO 8601 datetime
+	updatedAt?: string; // ISO 8601 datetime
+}
+```
+
+### Configuration Types
+
+```typescript
+interface SiteStandardConfig {
+	did: string;
+	pds?: string; // Optional, auto-resolved if not provided
+	cacheTTL?: number; // Cache time-to-live in milliseconds
+}
+
+interface ResolvedIdentity {
+	did: string;
+	pds: string;
+	handle?: string;
+}
+```
+
+---
+
+## Utilities
+
+### AT URI Utilities
+
+#### `parseAtUri(uri: string)`
+
+Parse an AT URI into its components.
+
+```typescript
+const parsed = parseAtUri('at://did:plc:xxx/site.standard.publication/rkey');
+// Returns: { did: 'did:plc:xxx', collection: 'site.standard.publication', rkey: 'rkey' }
+```
+
+#### `buildAtUri(did: string, collection: string, rkey: string)`
+
+Build an AT URI from components.
+
+```typescript
+const uri = buildAtUri('did:plc:xxx', 'site.standard.publication', 'rkey');
+// Returns: 'at://did:plc:xxx/site.standard.publication/rkey'
+```
+
+#### `extractRkey(uri: string)`
+
+Extract the record key from an AT URI.
+
+```typescript
+const rkey = extractRkey('at://did:plc:xxx/site.standard.publication/rkey');
+// Returns: 'rkey'
+```
+
+#### `isAtUri(value: string)`
+
+Check if a string is a valid AT URI.
+
+```typescript
+const valid = isAtUri('at://did:plc:xxx/site.standard.publication/rkey');
+// Returns: true
+```
+
+#### `atUriToHttps(atUri: string, pds: string)`
+
+Convert an AT URI to an HTTPS URL for API calls.
+
+```typescript
+const url = atUriToHttps(
+	'at://did:plc:xxx/site.standard.publication/rkey',
+	'https://pds.example.com'
+);
+// Returns: 'https://pds.example.com/xrpc/com.atproto.repo.getRecord?repo=...'
+```
+
+---
+
+### Identity Resolution
+
+#### `resolveIdentity(did: string, fetchFn?: typeof fetch)`
+
+Resolve a DID to its PDS endpoint and handle.
+
+```typescript
+const identity = await resolveIdentity('did:plc:xxx');
+// Returns: { did: 'did:plc:xxx', pds: 'https://...', handle: 'user.bsky.social' }
+```
+
+---
+
+### Blob Utilities
+
+#### `buildPdsBlobUrl(pds: string, did: string, cid: string)`
+
+Build a URL for fetching blob content.
+
+```typescript
+const url = buildPdsBlobUrl('https://pds.example.com', 'did:plc:xxx', 'bafyrei...');
+```
+
+---
+
+### Theme Utilities
+
+#### `rgbToCSS(color: RGBColor)`
+
+Convert an RGB color object to CSS rgb() string.
+
+```typescript
+const css = rgbToCSS({ r: 100, g: 150, b: 200 });
+// Returns: 'rgb(100, 150, 200)'
+```
+
+#### `rgbToHex(color: RGBColor)`
+
+Convert an RGB color object to hex string.
+
+```typescript
+const hex = rgbToHex({ r: 100, g: 150, b: 200 });
+// Returns: '#6496c8'
+```
+
+#### `getThemeVars(theme: BasicTheme)`
+
+Convert a BasicTheme to CSS custom properties object.
+
+```typescript
+const vars = getThemeVars({
+	primary: { r: 100, g: 150, b: 200 },
+	secondary: { r: 150, g: 100, b: 200 },
+	accent: { r: 200, g: 100, b: 150 }
+});
+// Returns: { '--theme-primary': 'rgb(100, 150, 200)', ... }
+```
+
+---
+
+### Document Utilities
+
+#### `getDocumentSlug(document: AtProtoRecord<Document>)`
+
+Generate a URL slug from a document's path or URI.
+
+```typescript
+const slug = getDocumentSlug(document);
+```
+
+#### `getDocumentUrl(document: AtProtoRecord<Document>, publicationRkey?: string)`
+
+Generate a full URL path for a document.
+
+```typescript
+const url = getDocumentUrl(document, 'pub123');
+// Returns: '/pub123/doc456' or custom path
+```
+
+---
+
+### Cache Utilities
+
+The library includes built-in caching with automatic expiration.
+
+```typescript
+import { cache } from 'svelte-standard-site';
+
+// Get cached value
+const value = cache.get<MyType>('my-key');
+
+// Set cached value
+cache.set('my-key', myValue, 300000); // 5 minutes TTL
+
+// Delete cached value
+cache.delete('my-key');
+
+// Clear all cache
+cache.clear();
+```
+
+---
+
+## Environment Configuration
+
+### getConfigFromEnv()
+
+Read configuration from environment variables.
+
+```typescript
+import { getConfigFromEnv } from 'svelte-standard-site/config/env';
+
+const config = getConfigFromEnv();
+// Returns: { did: '...', pds: '...', cacheTTL: ... } or null
+```
+
+**Environment Variables:**
+
+- `PUBLIC_ATPROTO_DID` - Required DID
+- `PUBLIC_ATPROTO_PDS` - Optional PDS endpoint
+- `PUBLIC_CACHE_TTL` - Optional cache TTL in milliseconds
+
+### validateEnv()
+
+Validate that required environment variables are set. Throws if missing.
+
+```typescript
+import { validateEnv } from 'svelte-standard-site/config/env';
+
+validateEnv(); // Throws if PUBLIC_ATPROTO_DID is not set
+```
+
+---
+
+## Error Handling
+
+All async methods can throw errors. Always use try-catch:
+
+```typescript
+try {
+	const docs = await client.fetchAllDocuments();
+	// Handle success
+} catch (error) {
+	console.error('Failed to fetch documents:', error);
+	// Handle error
+}
+```
+
+## Performance Tips
+
+1. **Pass fetch function in SSR** for proper request tracking
+2. **Use caching** - it's built-in and automatic
+3. **Batch requests** with `Promise.all()` when possible
+4. **Clear cache** strategically if data changes frequently
+5. **Pre-render static pages** for better performance
+
+For more examples, see [EXAMPLES.md](./EXAMPLES.md).

packages/svelte-standard-site/CLAUDE.md

···
+# CLAUDE.md
+
+## What
+
+SvelteKit library for ATProto longform publishing via the `standard.site` lexicon. Provides both read and write capabilities: display content from ATProto (Leaflet/WhiteWind), publish content TO ATProto, and aggregate federated comments.
+
+**Package:** `svelte-standard-site`
+
+## Project Structure
+
+```
+src/lib/
+  client.ts          # Read from ATProto (fetch documents/publications)
+  publisher.ts       # Write to ATProto (publish documents/publications)
+  schemas.ts         # Zod schemas for validation
+  types.ts           # TypeScript type definitions
+  components/
+    Comments.svelte  # Federated comments from Bluesky
+    DocumentCard.svelte
+    PublicationCard.svelte
+    StandardSiteLayout.svelte
+    ThemeToggle.svelte
+    common/          # Reusable utility components
+    document/        # Document rendering components
+  utils/
+    content.ts       # Markdown transformation (sidenotes, links, etc.)
+    comments.ts      # Fetch Bluesky replies
+    verification.ts  # Ownership verification helpers
+    at-uri.ts        # AT-URI parsing and conversion
+    theme.ts         # Theme utilities
+    cache.ts         # Caching layer
+  stores/
+    theme.ts         # Dark/light mode store
+  styles/
+    base.css         # Core design system
+    themes.css       # Theme definitions
+```
+
+## Commands
+
+```bash
+pnpm dev         # Start dev server
+pnpm build       # Build package
+pnpm test        # Run tests
+pnpm check       # Type check
+```
+
+## Critical: TID Format
+
+Record keys for `site.standard.document` and `site.standard.publication` MUST be TIDs. Schema validation will reject anything else.
+
+**TID requirements:**
+- 13 characters, base32-sortable charset: `234567abcdefghijklmnopqrstuvwxyz`
+- First char must be `234567abcdefghij` (top bit = 0)
+- Regex: `/^[234567abcdefghij][234567abcdefghijklmnopqrstuvwxyz]{12}$/`
+
+See `generateTid()` in `src/lib/publisher.ts` — do not modify without reading https://atproto.com/specs/tid
+
+## Critical: ES Modules
+
+`package.json` must have `"type": "module"`. Without this, imports break.
+
+## Key Concepts
+
+### Read vs Write
+
+- **SiteStandardClient** (`client.ts`): Read-only. Fetches content from ATProto.
+- **StandardSitePublisher** (`publisher.ts`): Write operations. Publishes content to ATProto.
+
+### Content Transformation
+
+The `content.ts` utilities transform markdown for ATProto compatibility:
+- Convert HTML sidenotes → markdown blockquotes
+- Resolve relative links → absolute URLs
+- Extract plain text for search indexing
+- Calculate word count and reading time
+
+### Comments System
+
+The Comments component fetches Bluesky replies and displays them as comments on blog posts. It uses the ATProto API to recursively fetch threaded conversations.
+
+### Verification
+
+Verification helpers generate `.well-known` endpoints and `<link>` tags to prove content ownership. This allows platforms to verify that you control the content you've published.
+
+## Testing Against Real PDS
+
+```bash
+# Set your app password
+export ATPROTO_APP_PASSWORD="xxxx-xxxx-xxxx-xxxx"
+
+# Run publisher test
+node scripts/test-publisher.js
+```
+
+For integration testing, use `pds.rip` (throwaway test accounts).
+
+## Design System
+
+The library uses semantic color tokens that automatically adapt to light/dark mode:
+
+- **Ink**: Text colors (ink-50 to ink-950)
+- **Canvas**: Background colors (canvas-50 to canvas-950)
+- **Primary**: Brand colors (primary-50 to primary-950)
+- **Secondary**: Secondary brand (secondary-50 to secondary-950)
+- **Accent**: Accent colors (accent-50 to accent-950)
+
+All styled using Tailwind v4 with `light-dark()` function.
+
+## Publishing to ATProto
+
+```typescript
+import { StandardSitePublisher } from 'svelte-standard-site/publisher';
+
+const publisher = new StandardSitePublisher({
+  identifier: 'you.bsky.social',
+  password: process.env.ATPROTO_APP_PASSWORD!,
+});
+
+await publisher.login();
+
+await publisher.publishDocument({
+  site: 'https://yourblog.com',
+  title: 'My Post',
+  publishedAt: new Date().toISOString(),
+  content: {
+    $type: 'site.standard.content.markdown',
+    text: markdownContent,
+    version: '1.0',
+  },
+  textContent: plainTextContent,
+});
+```
+
+## Reading from ATProto
+
+```typescript
+import { createClient } from 'svelte-standard-site';
+import { getConfigFromEnv } from 'svelte-standard-site/config/env';
+
+const config = getConfigFromEnv();
+const client = createClient(config);
+
+const documents = await client.fetchAllDocuments(fetch);
+const publications = await client.fetchAllPublications(fetch);
+```
+
+## Comments
+
+```svelte
+<script>
+  import { Comments } from 'svelte-standard-site';
+</script>
+
+<Comments
+  bskyPostUri="at://did:plc:xxx/app.bsky.feed.post/abc123"
+  canonicalUrl="https://yourblog.com/posts/my-post"
+  maxDepth={3}
+/>
+```
+
+## Content Transformation
+
+```typescript
+import { transformContent } from 'svelte-standard-site/content';
+
+const result = transformContent(rawMarkdown, {
+  baseUrl: 'https://yourblog.com',
+});
+
+// result.markdown - cleaned for ATProto
+// result.textContent - plain text for search
+// result.wordCount
+// result.readingTime
+```
+
+## Verification
+
+```typescript
+// src/routes/.well-known/site.standard.publication/+server.ts
+import { generatePublicationWellKnown } from 'svelte-standard-site/verification';
+import { text } from '@sveltejs/kit';
+
+export function GET() {
+  return text(
+    generatePublicationWellKnown({
+      did: 'did:plc:xxx',
+      publicationRkey: '3abc123xyz',
+    })
+  );
+}
+```
+
+## Important Notes
+
+1. **App Passwords**: Always use app passwords, never main account passwords
+2. **PDS Resolution**: The publisher auto-resolves PDS from DID documents
+3. **Caching**: The client has built-in caching (5-minute TTL by default)
+4. **SSR**: All fetch operations support SvelteKit's `fetch` for SSR
+5. **Theme Store**: Call `themeStore.init()` in `onMount()` to enable theme toggle
+6. **Blob URLs**: Cover images and icons are converted from blob refs to HTTPS URLs
+
+## External References
+
+- ATProto specs: https://atproto.com/
+- standard.site: https://standard.site/
+- Lexicon explorer: https://pdsls.dev/
+- Bluesky: https://bsky.app/
+
+## License
+
+AGPL-3.0 (stricter than Astro version's MIT)

packages/svelte-standard-site/CONTRIBUTING.md

···
+# Contributing to svelte-standard-site
+
+Thank you for your interest in contributing! This document provides guidelines and information for contributors.
+
+## Getting Started
+
+### Prerequisites
+
+- Node.js 18 or higher
+- pnpm 8 or higher
+
+### Setup
+
+1. Fork and clone the repository:
+
+```bash
+git clone https://github.com/ewanc26/svelte-standard-site.git
+cd svelte-standard-site
+```
+
+2. Install dependencies:
+
+```bash
+pnpm install
+```
+
+3. Create a `.env` file:
+
+```bash
+cp .env.example .env
+# Edit .env and add your PUBLIC_ATPROTO_DID
+```
+
+4. Start the development server:
+
+```bash
+pnpm dev
+```
+
+## Development Workflow
+
+### Project Structure
+
+```
+src/
+├── lib/                      # Library source code
+│   ├── client.ts            # Main client implementation
+│   ├── types.ts             # TypeScript type definitions
+│   ├── index.ts             # Public API exports
+│   ├── components/          # Reusable Svelte components
+│   │   ├── PublicationCard.svelte
+│   │   └── DocumentCard.svelte
+│   ├── config/              # Configuration utilities
+│   │   └── env.ts           # Environment variable handling
+│   └── utils/               # Utility functions
+│       ├── agents.ts        # AT Protocol agent utilities
+│       ├── at-uri.ts        # AT URI parsing utilities
+│       └── cache.ts         # Caching implementation
+└── routes/                  # Demo/showcase pages
+    ├── +page.svelte
+    └── +page.server.ts
+```
+
+### Commands
+
+- `pnpm dev` - Start development server
+- `pnpm build` - Build the library
+- `pnpm check` - Run type checking
+- `pnpm format` - Format code with Prettier
+- `pnpm lint` - Check code formatting
+- `pnpm prepack` - Prepare package for publishing
+
+## Making Changes
+
+### Code Style
+
+- We use Prettier for code formatting
+- Run `pnpm format` before committing
+- TypeScript strict mode is enabled
+- Follow the existing code structure and patterns
+
+### Commit Messages
+
+We follow the [Conventional Commits](https://www.conventionalcommits.org/) specification:
+
+- `feat:` - New features
+- `fix:` - Bug fixes
+- `docs:` - Documentation changes
+- `style:` - Code style changes (formatting, etc.)
+- `refactor:` - Code refactoring
+- `test:` - Test additions or changes
+- `chore:` - Build process or tooling changes
+
+Example:
+
+```
+feat: add support for custom PDS endpoints
+fix: resolve caching issue with blob URLs
+docs: update README with new examples
+```
+
+### Pull Request Process
+
+1. Create a new branch:
+
+```bash
+git checkout -b feat/your-feature-name
+```
+
+2. Make your changes and commit them:
+
+```bash
+git add .
+git commit -m "feat: add your feature"
+```
+
+3. Push to your fork:
+
+```bash
+git push origin feat/your-feature-name
+```
+
+4. Open a Pull Request on GitHub
+
+5. Ensure:
+   - Code passes type checking (`pnpm check`)
+   - Code is properly formatted (`pnpm format`)
+   - Documentation is updated if needed
+   - Examples are added for new features
+
+## What to Contribute
+
+### Good First Issues
+
+Look for issues labeled `good first issue` for beginner-friendly tasks.
+
+### Areas for Contribution
+
+- **Bug Fixes**: Report and fix bugs
+- **Features**: Implement new features (discuss in an issue first)
+- **Documentation**: Improve or expand documentation
+- **Examples**: Add new usage examples
+- **Components**: Create new reusable components
+- **Tests**: Add or improve test coverage
+- **Performance**: Optimize existing code
+
+## Reporting Bugs
+
+When reporting bugs, please include:
+
+1. A clear description of the issue
+2. Steps to reproduce
+3. Expected behavior
+4. Actual behavior
+5. Environment details (Node version, OS, etc.)
+6. Code samples if applicable
+
+## Feature Requests
+
+For feature requests:
+
+1. Check if the feature already exists or is planned
+2. Open an issue describing:
+   - The problem you're trying to solve
+   - Your proposed solution
+   - Any alternatives you've considered
+   - Examples of the desired behavior
+
+## Code of Conduct
+
+### Our Pledge
+
+We are committed to providing a friendly, safe, and welcoming environment for all contributors.
+
+### Expected Behavior
+
+- Be respectful and inclusive
+- Welcome newcomers
+- Accept constructive criticism gracefully
+- Focus on what's best for the community
+- Show empathy towards others
+
+### Unacceptable Behavior
+
+- Harassment of any kind
+- Discriminatory language or actions
+- Personal attacks
+- Publishing others' private information
+- Other conduct which could reasonably be considered inappropriate
+
+## Questions?
+
+Feel free to:
+
+- Open an issue for questions
+- Start a discussion in GitHub Discussions
+- Reach out to maintainers
+
+## License
+
+By contributing, you agree that your contributions will be licensed under the [AGPL-3.0](./LICENSE).
+
+Thank you for contributing to svelte-standard-site! 🎉

packages/svelte-standard-site/EXAMPLES.md

···
+# svelte-standard-site Examples
+
+This file contains comprehensive examples of using svelte-standard-site in various scenarios.
+
+## Table of Contents
+
+- [Basic Setup](#basic-setup)
+- [Simple Blog](#simple-blog)
+- [Using Utility Components](#using-utility-components)
+- [Building Custom Cards](#building-custom-cards)
+- [Multi-Publication Site](#multi-publication-site)
+- [Custom Styling](#custom-styling)
+- [Custom Layout](#custom-layout)
+- [Programmatic Theme Control](#programmatic-theme-control)
+- [Internationalization](#internationalization)
+- [Server-Side Rendering](#server-side-rendering)
+
+## Basic Setup
+
+### 1. Install and Configure
+
+```bash
+pnpm add svelte-standard-site
+```
+
+Create `.env`:
+
+```env
+PUBLIC_ATPROTO_DID=did:plc:your-did-here
+```
+
+### 2. Root Layout
+
+```svelte
+<!-- src/routes/+layout.svelte -->
+<script lang="ts">
+	import 'svelte-standard-site/styles/base.css';
+	import type { Snippet } from 'svelte';
+
+	interface Props {
+		children: Snippet;
+	}
+
+	let { children }: Props = $props();
+</script>
+
+{@render children()}
+```
+
+### 3. Home Page
+
+```svelte
+<!-- src/routes/+page.svelte -->
+<script lang="ts">
+	import { StandardSiteLayout, PublicationCard } from 'svelte-standard-site';
+	import type { PageData } from './$types';
+
+	const { data }: { data: PageData } = $props();
+</script>
+
+<StandardSiteLayout title="My Site">
+	<h1>Welcome!</h1>
+
+	<div class="grid gap-6 md:grid-cols-3">
+		{#each data.publications as publication}
+			<PublicationCard {publication} />
+		{/each}
+	</div>
+</StandardSiteLayout>
+```
+
+## Simple Blog
+
+### Load Function
+
+```typescript
+// src/routes/blog/+page.server.ts
+import { createClient } from 'svelte-standard-site';
+import { getConfigFromEnv } from 'svelte-standard-site/config/env';
+import type { PageServerLoad } from './$types';
+
+export const load: PageServerLoad = async ({ fetch }) => {
+	const config = getConfigFromEnv();
+	if (!config) {
+		throw new Error('Missing AT Proto configuration');
+	}
+
+	const client = createClient(config);
+	const documents = await client.fetchAllDocuments(fetch);
+
+	return {
+		posts: documents
+	};
+};
+```
+
+### Blog Index Page
+
+```svelte
+<!-- src/routes/blog/+page.svelte -->
+<script lang="ts">
+	import { StandardSiteLayout, DocumentCard } from 'svelte-standard-site';
+	import type { PageData } from './$types';
+
+	const { data }: { data: PageData } = $props();
+</script>
+
+<StandardSiteLayout title="My Blog">
+	<div class="mb-8">
+		<h1 class="text-ink-900 dark:text-ink-50 text-4xl font-bold">Blog Posts</h1>
+		<p class="text-ink-700 dark:text-ink-200 mt-2">Thoughts, tutorials, and updates</p>
+	</div>
+
+	<div class="space-y-6">
+		{#each data.posts as post}
+			<DocumentCard document={post} showCover={true} />
+		{/each}
+	</div>
+</StandardSiteLayout>
+```
+
+### Individual Post Page
+
+```typescript
+// src/routes/blog/[pub_rkey]/[doc_rkey]/+page.server.ts
+import { createClient } from 'svelte-standard-site';
+import { getConfigFromEnv } from 'svelte-standard-site/config/env';
+import { error } from '@sveltejs/kit';
+import type { PageServerLoad } from './$types';
+
+export const load: PageServerLoad = async ({ params, fetch }) => {
+	const config = getConfigFromEnv();
+	if (!config) {
+		throw new Error('Missing configuration');
+	}
+
+	const client = createClient(config);
+	const document = await client.fetchDocument(params.doc_rkey, fetch);
+
+	if (!document) {
+		throw error(404, 'Post not found');
+	}
+
+	return {
+		post: document
+	};
+};
+```
+
+```svelte
+<!-- src/routes/blog/[pub_rkey]/[doc_rkey]/+page.svelte -->
+<script lang="ts">
+	import { StandardSiteLayout } from 'svelte-standard-site';
+	import type { PageData } from './$types';
+
+	const { data }: { data: PageData } = $props();
+
+	const post = $derived(data.post.value);
+
+	function formatDate(date: string) {
+		return new Date(date).toLocaleDateString('en-US', {
+			year: 'numeric',
+			month: 'long',
+			day: 'numeric'
+		});
+	}
+</script>
+
+<svelte:head>
+	<title>{post.title} - My Blog</title>
+	{#if post.description}
+		<meta name="description" content={post.description} />
+	{/if}
+</svelte:head>
+
+<StandardSiteLayout title="My Blog">
+	<article class="mx-auto prose prose-lg dark:prose-invert">
+		{#if post.coverImage}
+			<img src={post.coverImage} alt={post.title} class="w-full rounded-xl" />
+		{/if}
+
+		<header class="mb-8">
+			<h1>{post.title}</h1>
+			<div class="text-ink-600 dark:text-ink-400 flex gap-4 text-sm">
+				<time datetime={post.publishedAt}>
+					{formatDate(post.publishedAt)}
+				</time>
+				{#if post.updatedAt}
+					<span>Updated: {formatDate(post.updatedAt)}</span>
+				{/if}
+			</div>
+			{#if post.tags && post.tags.length > 0}
+				<div class="mt-4 flex flex-wrap gap-2">
+					{#each post.tags as tag}
+						<span
+							class="bg-primary-100 text-primary-800 dark:bg-primary-900 dark:text-primary-200 rounded-full px-3 py-1 text-xs font-medium"
+						>
+							{tag}
+						</span>
+					{/each}
+				</div>
+			{/if}
+		</header>
+
+		{@html post.content || post.textContent || ''}
+	</article>
+</StandardSiteLayout>
+```
+
+## Using Utility Components
+
+The modular utility components make it easy to build consistent, theme-aware UIs.
+
+### Using DateDisplay
+
+```svelte
+<script lang="ts">
+	import { DateDisplay } from 'svelte-standard-site';
+	import type { PageData } from './$types';
+
+	const { data }: { data: PageData } = $props();
+</script>
+
+<article>
+	<h1>{data.post.value.title}</h1>
+
+	<!-- Simple date display -->
+	<DateDisplay date={data.post.value.publishedAt} />
+
+	<!-- With label and icon -->
+	<DateDisplay
+		date={data.post.value.updatedAt}
+		label="Last updated: "
+		showIcon={true}
+		class="text-ink-600 dark:text-ink-400 text-sm"
+	/>
+
+	<!-- Custom locale -->
+	<DateDisplay date={data.post.value.publishedAt} locale="fr-FR" />
+</article>
+```
+
+### Using TagList
+
+```svelte
+<script lang="ts">
+	import { TagList } from 'svelte-standard-site';
+	import type { PageData } from './$types';
+
+	const { data }: { data: PageData } = $props();
+	const hasTheme = $derived(!!data.publication?.value.basicTheme);
+</script>
+
+<!-- Simple tag list -->
+<TagList tags={data.post.value.tags || []} />
+
+<!-- With theme support -->
+<TagList tags={data.post.value.tags || []} {hasTheme} class="mt-4" />
+```
+
+### Using ThemedText
+
+```svelte
+<script lang="ts">
+	import { ThemedText } from 'svelte-standard-site';
+	import type { PageData } from './$types';
+
+	const { data }: { data: PageData } = $props();
+	const hasTheme = $derived(!!data.publication?.value.basicTheme);
+</script>
+
+<!-- Title with theme -->
+<ThemedText {hasTheme} element="h1" class="mb-4 text-4xl font-bold">
+	{data.post.value.title}
+</ThemedText>
+
+<!-- Semi-transparent description -->
+<ThemedText {hasTheme} opacity={70} element="p" class="text-lg">
+	{data.post.value.description}
+</ThemedText>
+
+<!-- Accent color for links -->
+<ThemedText {hasTheme} variant="accent" element="span">Read more →</ThemedText>
+```
+
+### Combining Utility Components
+
+```svelte
+<script lang="ts">
+	import { ThemedContainer, ThemedText, DateDisplay, TagList } from 'svelte-standard-site';
+	import type { PageData } from './$types';
+
+	const { data }: { data: PageData } = $props();
+	const theme = $derived(data.publication?.value.basicTheme);
+	const hasTheme = $derived(!!theme);
+</script>
+
+<ThemedContainer {theme} element="article" class="p-8">
+	<!-- Title -->
+	<ThemedText {hasTheme} element="h1" class="mb-2 text-4xl font-bold">
+		{data.post.value.title}
+	</ThemedText>
+
+	<!-- Description -->
+	<ThemedText {hasTheme} opacity={70} element="p" class="mb-4 text-lg">
+		{data.post.value.description}
+	</ThemedText>
+
+	<!-- Metadata -->
+	<div class="mb-6 flex gap-4">
+		<DateDisplay date={data.post.value.publishedAt} />
+		{#if data.post.value.updatedAt}
+			<DateDisplay date={data.post.value.updatedAt} label="Updated " showIcon={true} />
+		{/if}
+	</div>
+
+	<!-- Tags -->
+	<TagList tags={data.post.value.tags || []} {hasTheme} />
+
+	<!-- Content -->
+	<div class="prose mt-8 max-w-none">
+		{@html data.post.value.content}
+	</div>
+</ThemedContainer>
+```
+
+## Building Custom Cards
+
+Use ThemedCard and utility components to build custom card layouts.
+
+### Blog Post Card
+
+```svelte
+<script lang="ts">
+	import { ThemedCard, ThemedText, DateDisplay, TagList } from 'svelte-standard-site';
+	import type { Document, Publication, AtProtoRecord } from 'svelte-standard-site';
+
+	interface Props {
+		document: AtProtoRecord<Document>;
+		publication?: AtProtoRecord<Publication>;
+	}
+
+	let { document, publication }: Props = $props();
+
+	const theme = $derived(publication?.value.basicTheme);
+	const hasTheme = $derived(!!theme);
+	const value = $derived(document.value);
+</script>
+
+<ThemedCard
+	{theme}
+	href="/blog/{document.uri.split('/').pop()}"
+	class="transition-shadow hover:shadow-lg"
+>
+	<div class="flex gap-6">
+		{#if value.coverImage}
+			<img src={value.coverImage} alt={value.title} class="h-32 w-32 rounded-lg object-cover" />
+		{/if}
+
+		<div class="flex-1">
+			<ThemedText {hasTheme} element="h3" class="mb-2 text-2xl font-bold">
+				{value.title}
+			</ThemedText>
+
+			{#if value.description}
+				<ThemedText {hasTheme} opacity={70} element="p" class="mb-4 line-clamp-2">
+					{value.description}
+				</ThemedText>
+			{/if}
+
+			<div class="mb-3 flex items-center gap-4">
+				<DateDisplay date={value.publishedAt} class="text-sm" />
+			</div>
+
+			{#if value.tags?.length}
+				<TagList tags={value.tags} {hasTheme} />
+			{/if}
+		</div>
+	</div>
+</ThemedCard>
+```
+
+### Author Card
+
+```svelte
+<script lang="ts">
+	import { ThemedCard, ThemedText } from 'svelte-standard-site';
+
+	interface Props {
+		name: string;
+		bio: string;
+		avatar?: string;
+		theme?: any;
+	}
+
+	let { name, bio, avatar, theme }: Props = $props();
+	const hasTheme = $derived(!!theme);
+</script>
+
+<ThemedCard {theme} class="p-6">
+	<div class="flex items-start gap-4">
+		{#if avatar}
+			<img src={avatar} alt={name} class="h-16 w-16 rounded-full" />
+		{/if}
+
+		<div>
+			<ThemedText {hasTheme} element="h3" class="mb-2 text-xl font-bold">
+				{name}
+			</ThemedText>
+
+			<ThemedText {hasTheme} opacity={70} element="p">
+				{bio}
+			</ThemedText>
+		</div>
+	</div>
+</ThemedCard>
+```
+
+### Feature Card with Icon
+
+```svelte
+<script lang="ts">
+	import { ThemedCard, ThemedText } from 'svelte-standard-site';
+	import type { Snippet } from 'svelte';
+
+	interface Props {
+		title: string;
+		description: string;
+		icon: Snippet;
+		theme?: any;
+	}
+
+	let { title, description, icon, theme }: Props = $props();
+	const hasTheme = $derived(!!theme);
+</script>
+
+<ThemedCard {theme} class="p-6 text-center">
+	<div
+		class="bg-primary-100 dark:bg-primary-900 mb-4 inline-flex h-16 w-16 items-center justify-center rounded-full"
+	>
+		{@render icon()}
+	</div>
+
+	<ThemedText {hasTheme} element="h3" class="mb-2 text-xl font-bold">
+		{title}
+	</ThemedText>
+
+	<ThemedText {hasTheme} opacity={70} element="p">
+		{description}
+	</ThemedText>
+</ThemedCard>
+```
+
+## Internationalization
+
+### Automatic Locale Detection
+
+The DateDisplay component automatically detects the user's browser locale.
+
+```svelte
+<script lang="ts">
+	import { DateDisplay } from 'svelte-standard-site';
+</script>
+
+<!-- Automatically formats based on user's locale -->
+<DateDisplay date="2026-01-19T12:00:00Z" />
+
+<!-- 
+Results:
+- en-US: "January 19, 2026"
+- fr-FR: "19 janvier 2026"
+- de-DE: "19. Januar 2026"
+- ja-JP: "2026年1月19日"
+- es-ES: "19 de enero de 2026"
+-->
+```
+
+### Explicit Locale Override
+
+```svelte
+<script lang="ts">
+	import { DateDisplay } from 'svelte-standard-site';
+
+	// User preference from settings or profile
+	let userLocale = $state('fr-FR');
+</script>
+
+<DateDisplay date="2026-01-19T12:00:00Z" locale={userLocale} />
+```
+
+### Multi-Language Blog
+
+```svelte
+<script lang="ts">
+	import {
+		StandardSiteLayout,
+		ThemedContainer,
+		ThemedText,
+		DateDisplay
+	} from 'svelte-standard-site';
+	import type { PageData } from './$types';
+
+	const { data }: { data: PageData } = $props();
+
+	// Detect user's language
+	let locale = $state('en-US');
+
+	$effect(() => {
+		if (typeof navigator !== 'undefined') {
+			locale = navigator.language || 'en-US';
+		}
+	});
+
+	const theme = $derived(data.publication?.value.basicTheme);
+	const hasTheme = $derived(!!theme);
+</script>
+
+<StandardSiteLayout title={data.publication?.value.name}>
+	<ThemedContainer {theme}>
+		<ThemedText {hasTheme} element="h1" class="mb-4 text-4xl font-bold">
+			{data.post.value.title}
+		</ThemedText>
+
+		<!-- Date automatically formats to user's locale -->
+		<DateDisplay
+			date={data.post.value.publishedAt}
+			{locale}
+			class="text-ink-600 dark:text-ink-400 text-sm"
+		/>
+
+		<div class="prose mt-8 max-w-none">
+			{@html data.post.value.content}
+		</div>
+	</ThemedContainer>
+</StandardSiteLayout>
+```
+
+## Multi-Publication Site
+
+```typescript
+// src/routes/+page.server.ts
+import { createClient } from 'svelte-standard-site';
+import { getConfigFromEnv } from 'svelte-standard-site/config/env';
+import type { PageServerLoad } from './$types';
+
+export const load: PageServerLoad = async ({ fetch }) => {
+	const config = getConfigFromEnv();
+	if (!config) {
+		return { error: 'Configuration missing', publications: [], documents: [] };
+	}
+
+	const client = createClient(config);
+
+	const [publications, documents] = await Promise.all([
+		client.fetchAllPublications(fetch),
+		client.fetchAllDocuments(fetch)
+	]);
+
+	// Group documents by publication
+	const documentsByPub = new Map();
+	for (const doc of documents) {
+		const pubUri = doc.value.site;
+		if (!documentsByPub.has(pubUri)) {
+			documentsByPub.set(pubUri, []);
+		}
+		documentsByPub.get(pubUri).push(doc);
+	}
+
+	return {
+		publications,
+		documents,
+		documentsByPub: Object.fromEntries(documentsByPub)
+	};
+};
+```
+
+```svelte
+<!-- src/routes/+page.svelte -->
+<script lang="ts">
+	import { StandardSiteLayout, PublicationCard, DocumentCard } from 'svelte-standard-site';
+	import type { PageData } from './$types';
+
+	const { data }: { data: PageData } = $props();
+</script>
+
+<StandardSiteLayout title="My Publications">
+	{#each data.publications as publication}
+		<section class="mb-16">
+			<div class="mb-8">
+				<PublicationCard {publication} />
+			</div>
+
+			<h2 class="text-ink-900 dark:text-ink-50 mb-6 text-2xl font-bold">
+				Recent from {publication.value.name}
+			</h2>
+
+			{#if data.documentsByPub[publication.uri]}
+				<div class="space-y-6">
+					{#each data.documentsByPub[publication.uri].slice(0, 5) as document}
+						<DocumentCard {document} />
+					{/each}
+				</div>
+			{:else}
+				<p class="text-ink-600 dark:text-ink-400">No documents yet</p>
+			{/if}
+		</section>
+	{/each}
+</StandardSiteLayout>
+```
+
+## Custom Styling
+
+### Override Theme Colors
+
+```css
+/* src/app.css or src/lib/styles/custom.css */
+@import 'svelte-standard-site/styles/base.css';
+
+/* Override primary color */
+:root {
+	--color-primary-50: oklch(18.2% 0.018 280);
+	--color-primary-100: oklch(26.5% 0.03 280);
+	--color-primary-200: oklch(40.5% 0.048 280);
+	--color-primary-300: oklch(54% 0.065 280);
+	--color-primary-400: oklch(66.5% 0.08 280);
+	--color-primary-500: oklch(78.5% 0.095 280);
+	--color-primary-600: oklch(82.2% 0.078 280);
+	--color-primary-700: oklch(86.5% 0.062 280);
+	--color-primary-800: oklch(91% 0.042 280);
+	--color-primary-900: oklch(95.8% 0.022 280);
+	--color-primary-950: oklch(98% 0.012 280);
+}
+```
+
+### Custom Component Styles
+
+```svelte
+<script lang="ts">
+	import { DocumentCard } from 'svelte-standard-site';
+</script>
+
+<DocumentCard
+	{document}
+	class="
+    border-primary-500 
+    border-2 
+    shadow-2xl 
+    transition-transform 
+    hover:scale-105
+  "
+/>
+```
+
+## Custom Layout
+
+### Full Custom Layout with Theme Support
+
+```svelte
+<!-- src/routes/+layout.svelte -->
+<script lang="ts">
+	import 'svelte-standard-site/styles/base.css';
+	import { ThemeToggle, themeStore } from 'svelte-standard-site';
+	import { onMount } from 'svelte';
+	import { page } from '$app/stores';
+	import type { Snippet } from 'svelte';
+
+	interface Props {
+		children: Snippet;
+	}
+
+	let { children }: Props = $props();
+
+	// Navigation items
+	const navItems = [
+		{ href: '/', label: 'Home' },
+		{ href: '/blog', label: 'Blog' },
+		{ href: '/about', label: 'About' }
+	];
+
+	onMount(() => {
+		themeStore.init();
+	});
+</script>
+
+<svelte:head>
+	<script>
+		// Prevent FOUC
+		(function () {
+			const stored = localStorage.getItem('theme');
+			const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+			const isDark = stored === 'dark' || (!stored && prefersDark);
+			const htmlElement = document.documentElement;
+
+			if (isDark) {
+				htmlElement.classList.add('dark');
+				htmlElement.style.colorScheme = 'dark';
+			} else {
+				htmlElement.classList.remove('dark');
+				htmlElement.style.colorScheme = 'light';
+			}
+		})();
+	</script>
+</svelte:head>
+
+<div class="bg-canvas-50 text-ink-900 dark:bg-canvas-950 dark:text-ink-50 min-h-screen">
+	<!-- Custom Header -->
+	<header
+		class="border-canvas-200 bg-canvas-50/90 dark:border-canvas-800 dark:bg-canvas-950/90 border-b backdrop-blur-md"
+	>
+		<nav class="container mx-auto flex items-center justify-between px-4 py-4">
+			<a href="/" class="text-primary-600 dark:text-primary-400 text-2xl font-bold"> MyBrand </a>
+
+			<ul class="flex items-center gap-6">
+				{#each navItems as item}
+					<li>
+						<a
+							href={item.href}
+							class="hover:text-primary-600 dark:hover:text-primary-400 font-medium transition-colors
+                {$page.url.pathname === item.href
+								? 'text-primary-600 dark:text-primary-400'
+								: 'text-ink-700 dark:text-ink-200'}"
+						>
+							{item.label}
+						</a>
+					</li>
+				{/each}
+				<li>
+					<ThemeToggle />
+				</li>
+			</ul>
+		</nav>
+	</header>
+
+	<!-- Main Content -->
+	<main class="container mx-auto px-4 py-12">
+		{@render children()}
+	</main>
+
+	<!-- Custom Footer -->
+	<footer
+		class="border-canvas-200 bg-canvas-50 dark:border-canvas-800 dark:bg-canvas-950 border-t py-8"
+	>
+		<div class="text-ink-700 dark:text-ink-200 container mx-auto px-4 text-center text-sm">
+			<p>&copy; {new Date().getFullYear()} MyBrand. All rights reserved.</p>
+			<p class="mt-2">
+				Powered by
+				<a
+					href="https://github.com/ewanc26/svelte-standard-site"
+					class="text-primary-600 dark:text-primary-400 hover:underline"
+				>
+					svelte-standard-site
+				</a>
+			</p>
+		</div>
+	</footer>
+</div>
+```
+
+## Programmatic Theme Control
+
+### Theme Toggle Button
+
+```svelte
+<script lang="ts">
+	import { themeStore } from 'svelte-standard-site';
+	import { onMount } from 'svelte';
+
+	let isDark = $state(false);
+
+	onMount(() => {
+		themeStore.init();
+
+		const unsubscribe = themeStore.subscribe((state) => {
+			isDark = state.isDark;
+		});
+
+		return unsubscribe;
+	});
+</script>
+
+<button onclick={() => themeStore.toggle()} class="bg-primary-600 rounded-lg px-4 py-2 text-white">
+	Switch to {isDark ? 'Light' : 'Dark'} Mode
+</button>
+```
+
+### System Preference Detection
+
+```svelte
+<script lang="ts">
+	import { themeStore } from 'svelte-standard-site';
+	import { onMount } from 'svelte';
+
+	let systemPreference = $state<'light' | 'dark'>('light');
+	let currentTheme = $state<'light' | 'dark' | 'system'>('system');
+
+	onMount(() => {
+		themeStore.init();
+
+		// Detect system preference
+		const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
+		systemPreference = mediaQuery.matches ? 'dark' : 'light';
+
+		// Check if user has overridden
+		const stored = localStorage.getItem('theme');
+		currentTheme = stored ? (stored as 'light' | 'dark') : 'system';
+
+		// Listen for changes
+		mediaQuery.addEventListener('change', (e) => {
+			systemPreference = e.matches ? 'dark' : 'light';
+		});
+	});
+
+	function setTheme(theme: 'light' | 'dark' | 'system') {
+		if (theme === 'system') {
+			localStorage.removeItem('theme');
+			themeStore.setTheme(systemPreference === 'dark');
+		} else {
+			themeStore.setTheme(theme === 'dark');
+		}
+		currentTheme = theme;
+	}
+</script>
+
+<div class="flex gap-2">
+	<button
+		onclick={() => setTheme('light')}
+		class="rounded px-4 py-2 {currentTheme === 'light'
+			? 'bg-primary-600 text-white'
+			: 'bg-canvas-200'}"
+	>
+		Light
+	</button>
+	<button
+		onclick={() => setTheme('dark')}
+		class="rounded px-4 py-2 {currentTheme === 'dark'
+			? 'bg-primary-600 text-white'
+			: 'bg-canvas-200'}"
+	>
+		Dark
+	</button>
+	<button
+		onclick={() => setTheme('system')}
+		class="rounded px-4 py-2 {currentTheme === 'system'
+			? 'bg-primary-600 text-white'
+			: 'bg-canvas-200'}"
+	>
+		System
+	</button>
+</div>
+```
+
+## Server-Side Rendering
+
+### Pre-render Static Pages
+
+```typescript
+// svelte.config.js
+import adapter from '@sveltejs/adapter-static';
+
+export default {
+	kit: {
+		adapter: adapter({
+			pages: 'build',
+			assets: 'build',
+			fallback: null,
+			precompress: false
+		}),
+		prerender: {
+			entries: ['*']
+		}
+	}
+};
+```
+
+### Generate Dynamic Routes
+
+```typescript
+// src/routes/blog/[pub_rkey]/[doc_rkey]/+page.server.ts
+import { createClient } from 'svelte-standard-site';
+import { getConfigFromEnv } from 'svelte-standard-site/config/env';
+import { error } from '@sveltejs/kit';
+import type { PageServerLoad, EntryGenerator } from './$types';
+
+export const load: PageServerLoad = async ({ params, fetch }) => {
+	const config = getConfigFromEnv();
+	if (!config) throw error(500, 'Configuration missing');
+
+	const client = createClient(config);
+	const document = await client.fetchDocument(params.doc_rkey, fetch);
+
+	if (!document) throw error(404, 'Post not found');
+
+	return { post: document };
+};
+
+export const entries: EntryGenerator = async () => {
+	const config = getConfigFromEnv();
+	if (!config) return [];
+
+	const client = createClient(config);
+	const documents = await client.fetchAllDocuments();
+
+	return documents.map((doc) => {
+		const pubRkey = doc.value.site.split('/').pop() || '';
+		const docRkey = doc.uri.split('/').pop() || '';
+		return { pub_rkey: pubRkey, doc_rkey: docRkey };
+	});
+};
+```
+
+## Tips and Best Practices
+
+1. **Always import base.css** in your root layout for consistent styling
+2. **Use the ThemeToggle component** or manage theme with themeStore
+3. **Leverage utility components** - Use DateDisplay, TagList, ThemedText, etc. for consistency
+4. **Follow DRY principles** - Don't manually format dates or apply theme colors repeatedly
+5. **Leverage the design tokens** (ink, canvas, primary, etc.) for consistency
+6. **Pass custom classes** to components for one-off customizations
+7. **Use server-side rendering** for better SEO and performance
+8. **Cache aggressively** - the library has built-in caching
+9. **Handle errors gracefully** - always check for null/undefined data
+10. **Test dark mode** - all components support it out of the box
+11. **Embrace locale-aware dates** - DateDisplay automatically formats for user's locale
+
+For more examples and detailed documentation, visit the [GitHub repository](https://github.com/ewanc26/svelte-standard-site).

packages/svelte-standard-site/LICENSE

···
+                    GNU AFFERO GENERAL PUBLIC LICENSE
+                       Version 3, 19 November 2007
+
+ Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
+ Everyone is permitted to copy and distribute verbatim copies
+ of this license document, but changing it is not allowed.
+
+                            Preamble
+
+  The GNU Affero General Public License is a free, copyleft license for
+software and other kinds of works, specifically designed to ensure
+cooperation with the community in the case of network server software.
+
+  The licenses for most software and other practical works are designed
+to take away your freedom to share and change the works.  By contrast,
+our General Public Licenses are intended to guarantee your freedom to
+share and change all versions of a program--to make sure it remains free
+software for all its users.
+
+  When we speak of free software, we are referring to freedom, not
+price.  Our General Public Licenses are designed to make sure that you
+have the freedom to distribute copies of free software (and charge for
+them if you wish), that you receive source code or can get it if you
+want it, that you can change the software or use pieces of it in new
+free programs, and that you know you can do these things.
+
+  Developers that use our General Public Licenses protect your rights
+with two steps: (1) assert copyright on the software, and (2) offer
+you this License which gives you legal permission to copy, distribute
+and/or modify the software.
+
+  A secondary benefit of defending all users' freedom is that
+improvements made in alternate versions of the program, if they
+receive widespread use, become available for other developers to
+incorporate.  Many developers of free software are heartened and
+encouraged by the resulting cooperation.  However, in the case of
+software used on network servers, this result may fail to come about.
+The GNU General Public License permits making a modified version and
+letting the public access it on a server without ever releasing its
+source code to the public.
+
+  The GNU Affero General Public License is designed specifically to
+ensure that, in such cases, the modified source code becomes available
+to the community.  It requires the operator of a network server to
+provide the source code of the modified version running there to the
+users of that server.  Therefore, public use of a modified version, on
+a publicly accessible server, gives the public access to the source
+code of the modified version.
+
+  An older license, called the Affero General Public License and
+published by Affero, was designed to accomplish similar goals.  This is
+a different license, not a version of the Affero GPL, but Affero has
+released a new version of the Affero GPL which permits relicensing under
+this license.
+
+  The precise terms and conditions for copying, distribution and
+modification follow.
+
+                       TERMS AND CONDITIONS
+
+  0. Definitions.
+
+  "This License" refers to version 3 of the GNU Affero General Public License.
+
+  "Copyright" also means copyright-like laws that apply to other kinds of
+works, such as semiconductor masks.
+
+  "The Program" refers to any copyrightable work licensed under this
+License.  Each licensee is addressed as "you".  "Licensees" and
+"recipients" may be individuals or organizations.
+
+  To "modify" a work means to copy from or adapt all or part of the work
+in a fashion requiring copyright permission, other than the making of an
+exact copy.  The resulting work is called a "modified version" of the
+earlier work or a work "based on" the earlier work.
+
+  A "covered work" means either the unmodified Program or a work based
+on the Program.
+
+  To "propagate" a work means to do anything with it that, without
+permission, would make you directly or secondarily liable for
+infringement under applicable copyright law, except executing it on a
+computer or modifying a private copy.  Propagation includes copying,
+distribution (with or without modification), making available to the
+public, and in some countries other activities as well.
+
+  To "convey" a work means any kind of propagation that enables other
+parties to make or receive copies.  Mere interaction with a user through
+a computer network, with no transfer of a copy, is not conveying.
+
+  An interactive user interface displays "Appropriate Legal Notices"
+to the extent that it includes a convenient and prominently visible
+feature that (1) displays an appropriate copyright notice, and (2)
+tells the user that there is no warranty for the work (except to the
+extent that warranties are provided), that licensees may convey the
+work under this License, and how to view a copy of this License.  If
+the interface presents a list of user commands or options, such as a
+menu, a prominent item in the list meets this criterion.
+
+  1. Source Code.
+
+  The "source code" for a work means the preferred form of the work
+for making modifications to it.  "Object code" means any non-source
+form of a work.
+
+  A "Standard Interface" means an interface that either is an official
+standard defined by a recognized standards body, or, in the case of
+interfaces specified for a particular programming language, one that
+is widely used among developers working in that language.
+
+  The "System Libraries" of an executable work include anything, other
+than the work as a whole, that (a) is included in the normal form of
+packaging a Major Component, but which is not part of that Major
+Component, and (b) serves only to enable use of the work with that
+Major Component, or to implement a Standard Interface for which an
+implementation is available to the public in source code form.  A
+"Major Component", in this context, means a major essential component
+(kernel, window system, and so on) of the specific operating system
+(if any) on which the executable work runs, or a compiler used to
+produce the work, or an object code interpreter used to run it.
+
+  The "Corresponding Source" for a work in object code form means all
+the source code needed to generate, install, and (for an executable
+work) run the object code and to modify the work, including scripts to
+control those activities.  However, it does not include the work's
+System Libraries, or general-purpose tools or generally available free
+programs which are used unmodified in performing those activities but
+which are not part of the work.  For example, Corresponding Source
+includes interface definition files associated with source files for
+the work, and the source code for shared libraries and dynamically
+linked subprograms that the work is specifically designed to require,
+such as by intimate data communication or control flow between those
+subprograms and other parts of the work.
+
+  The Corresponding Source need not include anything that users
+can regenerate automatically from other parts of the Corresponding
+Source.
+
+  The Corresponding Source for a work in source code form is that
+same work.
+
+  2. Basic Permissions.
+
+  All rights granted under this License are granted for the term of
+copyright on the Program, and are irrevocable provided the stated
+conditions are met.  This License explicitly affirms your unlimited
+permission to run the unmodified Program.  The output from running a
+covered work is covered by this License only if the output, given its
+content, constitutes a covered work.  This License acknowledges your
+rights of fair use or other equivalent, as provided by copyright law.
+
+  You may make, run and propagate covered works that you do not
+convey, without conditions so long as your license otherwise remains
+in force.  You may convey covered works to others for the sole purpose
+of having them make modifications exclusively for you, or provide you
+with facilities for running those works, provided that you comply with
+the terms of this License in conveying all material for which you do
+not control copyright.  Those thus making or running the covered works
+for you must do so exclusively on your behalf, under your direction
+and control, on terms that prohibit them from making any copies of
+your copyrighted material outside their relationship with you.
+
+  Conveying under any other circumstances is permitted solely under
+the conditions stated below.  Sublicensing is not allowed; section 10
+makes it unnecessary.
+
+  3. Protecting Users' Legal Rights From Anti-Circumvention Law.
+
+  No covered work shall be deemed part of an effective technological
+measure under any applicable law fulfilling obligations under article
+11 of the WIPO copyright treaty adopted on 20 December 1996, or
+similar laws prohibiting or restricting circumvention of such
+measures.
+
+  When you convey a covered work, you waive any legal power to forbid
+circumvention of technological measures to the extent such circumvention
+is effected by exercising rights under this License with respect to
+the covered work, and you disclaim any intention to limit operation or
+modification of the work as a means of enforcing, against the work's
+users, your or third parties' legal rights to forbid circumvention of
+technological measures.
+
+  4. Conveying Verbatim Copies.
+
+  You may convey verbatim copies of the Program's source code as you
+receive it, in any medium, provided that you conspicuously and
+appropriately publish on each copy an appropriate copyright notice;
+keep intact all notices stating that this License and any
+non-permissive terms added in accord with section 7 apply to the code;
+keep intact all notices of the absence of any warranty; and give all
+recipients a copy of this License along with the Program.
+
+  You may charge any price or no price for each copy that you convey,
+and you may offer support or warranty protection for a fee.
+
+  5. Conveying Modified Source Versions.
+
+  You may convey a work based on the Program, or the modifications to
+produce it from the Program, in the form of source code under the
+terms of section 4, provided that you also meet all of these conditions:
+
+    a) The work must carry prominent notices stating that you modified
+    it, and giving a relevant date.
+
+    b) The work must carry prominent notices stating that it is
+    released under this License and any conditions added under section
+    7.  This requirement modifies the requirement in section 4 to
+    "keep intact all notices".
+
+    c) You must license the entire work, as a whole, under this
+    License to anyone who comes into possession of a copy.  This
+    License will therefore apply, along with any applicable section 7
+    additional terms, to the whole of the work, and all its parts,
+    regardless of how they are packaged.  This License gives no
+    permission to license the work in any other way, but it does not
+    invalidate such permission if you have separately received it.
+
+    d) If the work has interactive user interfaces, each must display
+    Appropriate Legal Notices; however, if the Program has interactive
+    interfaces that do not display Appropriate Legal Notices, your
+    work need not make them do so.
+
+  A compilation of a covered work with other separate and independent
+works, which are not by their nature extensions of the covered work,
+and which are not combined with it such as to form a larger program,
+in or on a volume of a storage or distribution medium, is called an
+"aggregate" if the compilation and its resulting copyright are not
+used to limit the access or legal rights of the compilation's users
+beyond what the individual works permit.  Inclusion of a covered work
+in an aggregate does not cause this License to apply to the other
+parts of the aggregate.
+
+  6. Conveying Non-Source Forms.
+
+  You may convey a covered work in object code form under the terms
+of sections 4 and 5, provided that you also convey the
+machine-readable Corresponding Source under the terms of this License,
+in one of these ways:
+
+    a) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by the
+    Corresponding Source fixed on a durable physical medium
+    customarily used for software interchange.
+
+    b) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by a
+    written offer, valid for at least three years and valid for as
+    long as you offer spare parts or customer support for that product
+    model, to give anyone who possesses the object code either (1) a
+    copy of the Corresponding Source for all the software in the
+    product that is covered by this License, on a durable physical
+    medium customarily used for software interchange, for a price no
+    more than your reasonable cost of physically performing this
+    conveying of source, or (2) access to copy the
+    Corresponding Source from a network server at no charge.
+
+    c) Convey individual copies of the object code with a copy of the
+    written offer to provide the Corresponding Source.  This
+    alternative is allowed only occasionally and noncommercially, and
+    only if you received the object code with such an offer, in accord
+    with subsection 6b.
+
+    d) Convey the object code by offering access from a designated
+    place (gratis or for a charge), and offer equivalent access to the
+    Corresponding Source in the same way through the same place at no
+    further charge.  You need not require recipients to copy the
+    Corresponding Source along with the object code.  If the place to
+    copy the object code is a network server, the Corresponding Source
+    may be on a different server (operated by you or a third party)
+    that supports equivalent copying facilities, provided you maintain
+    clear directions next to the object code saying where to find the
+    Corresponding Source.  Regardless of what server hosts the
+    Corresponding Source, you remain obligated to ensure that it is
+    available for as long as needed to satisfy these requirements.
+
+    e) Convey the object code using peer-to-peer transmission, provided
+    you inform other peers where the object code and Corresponding
+    Source of the work are being offered to the general public at no
+    charge under subsection 6d.
+
+  A separable portion of the object code, whose source code is excluded
+from the Corresponding Source as a System Library, need not be
+included in conveying the object code work.
+
+  A "User Product" is either (1) a "consumer product", which means any
+tangible personal property which is normally used for personal, family,
+or household purposes, or (2) anything designed or sold for incorporation
+into a dwelling.  In determining whether a product is a consumer product,
+doubtful cases shall be resolved in favor of coverage.  For a particular
+product received by a particular user, "normally used" refers to a
+typical or common use of that class of product, regardless of the status
+of the particular user or of the way in which the particular user
+actually uses, or expects or is expected to use, the product.  A product
+is a consumer product regardless of whether the product has substantial
+commercial, industrial or non-consumer uses, unless such uses represent
+the only significant mode of use of the product.
+
+  "Installation Information" for a User Product means any methods,
+procedures, authorization keys, or other information required to install
+and execute modified versions of a covered work in that User Product from
+a modified version of its Corresponding Source.  The information must
+suffice to ensure that the continued functioning of the modified object
+code is in no case prevented or interfered with solely because
+modification has been made.
+
+  If you convey an object code work under this section in, or with, or
+specifically for use in, a User Product, and the conveying occurs as
+part of a transaction in which the right of possession and use of the
+User Product is transferred to the recipient in perpetuity or for a
+fixed term (regardless of how the transaction is characterized), the
+Corresponding Source conveyed under this section must be accompanied
+by the Installation Information.  But this requirement does not apply
+if neither you nor any third party retains the ability to install
+modified object code on the User Product (for example, the work has
+been installed in ROM).
+
+  The requirement to provide Installation Information does not include a
+requirement to continue to provide support service, warranty, or updates
+for a work that has been modified or installed by the recipient, or for
+the User Product in which it has been modified or installed.  Access to a
+network may be denied when the modification itself materially and
+adversely affects the operation of the network or violates the rules and
+protocols for communication across the network.
+
+  Corresponding Source conveyed, and Installation Information provided,
+in accord with this section must be in a format that is publicly
+documented (and with an implementation available to the public in
+source code form), and must require no special password or key for
+unpacking, reading or copying.
+
+  7. Additional Terms.
+
+  "Additional permissions" are terms that supplement the terms of this
+License by making exceptions from one or more of its conditions.
+Additional permissions that are applicable to the entire Program shall
+be treated as though they were included in this License, to the extent
+that they are valid under applicable law.  If additional permissions
+apply only to part of the Program, that part may be used separately
+under those permissions, but the entire Program remains governed by
+this License without regard to the additional permissions.
+
+  When you convey a copy of a covered work, you may at your option
+remove any additional permissions from that copy, or from any part of
+it.  (Additional permissions may be written to require their own
+removal in certain cases when you modify the work.)  You may place
+additional permissions on material, added by you to a covered work,
+for which you have or can give appropriate copyright permission.
+
+  Notwithstanding any other provision of this License, for material you
+add to a covered work, you may (if authorized by the copyright holders of
+that material) supplement the terms of this License with terms:
+
+    a) Disclaiming warranty or limiting liability differently from the
+    terms of sections 15 and 16 of this License; or
+
+    b) Requiring preservation of specified reasonable legal notices or
+    author attributions in that material or in the Appropriate Legal
+    Notices displayed by works containing it; or
+
+    c) Prohibiting misrepresentation of the origin of that material, or
+    requiring that modified versions of such material be marked in
+    reasonable ways as different from the original version; or
+
+    d) Limiting the use for publicity purposes of names of licensors or
+    authors of the material; or
+
+    e) Declining to grant rights under trademark law for use of some
+    trade names, trademarks, or service marks; or
+
+    f) Requiring indemnification of licensors and authors of that
+    material by anyone who conveys the material (or modified versions of
+    it) with contractual assumptions of liability to the recipient, for
+    any liability that these contractual assumptions directly impose on
+    those licensors and authors.
+
+  All other non-permissive additional terms are considered "further
+restrictions" within the meaning of section 10.  If the Program as you
+received it, or any part of it, contains a notice stating that it is
+governed by this License along with a term that is a further
+restriction, you may remove that term.  If a license document contains
+a further restriction but permits relicensing or conveying under this
+License, you may add to a covered work material governed by the terms
+of that license document, provided that the further restriction does
+not survive such relicensing or conveying.
+
+  If you add terms to a covered work in accord with this section, you
+must place, in the relevant source files, a statement of the
+additional terms that apply to those files, or a notice indicating
+where to find the applicable terms.
+
+  Additional terms, permissive or non-permissive, may be stated in the
+form of a separately written license, or stated as exceptions;
+the above requirements apply either way.
+
+  8. Termination.
+
+  You may not propagate or modify a covered work except as expressly
+provided under this License.  Any attempt otherwise to propagate or
+modify it is void, and will automatically terminate your rights under
+this License (including any patent licenses granted under the third
+paragraph of section 11).
+
+  However, if you cease all violation of this License, then your
+license from a particular copyright holder is reinstated (a)
+provisionally, unless and until the copyright holder explicitly and
+finally terminates your license, and (b) permanently, if the copyright
+holder fails to notify you of the violation by some reasonable means
+prior to 60 days after the cessation.
+
+  Moreover, your license from a particular copyright holder is
+reinstated permanently if the copyright holder notifies you of the
+violation by some reasonable means, this is the first time you have
+received notice of violation of this License (for any work) from that
+copyright holder, and you cure the violation prior to 30 days after
+your receipt of the notice.
+
+  Termination of your rights under this section does not terminate the
+licenses of parties who have received copies or rights from you under
+this License.  If your rights have been terminated and not permanently
+reinstated, you do not qualify to receive new licenses for the same
+material under section 10.
+
+  9. Acceptance Not Required for Having Copies.
+
+  You are not required to accept this License in order to receive or
+run a copy of the Program.  Ancillary propagation of a covered work
+occurring solely as a consequence of using peer-to-peer transmission
+to receive a copy likewise does not require acceptance.  However,
+nothing other than this License grants you permission to propagate or
+modify any covered work.  These actions infringe copyright if you do
+not accept this License.  Therefore, by modifying or propagating a
+covered work, you indicate your acceptance of this License to do so.
+
+  10. Automatic Licensing of Downstream Recipients.
+
+  Each time you convey a covered work, the recipient automatically
+receives a license from the original licensors, to run, modify and
+propagate that work, subject to this License.  You are not responsible
+for enforcing compliance by third parties with this License.
+
+  An "entity transaction" is a transaction transferring control of an
+organization, or substantially all assets of one, or subdividing an
+organization, or merging organizations.  If propagation of a covered
+work results from an entity transaction, each party to that
+transaction who receives a copy of the work also receives whatever
+licenses to the work the party's predecessor in interest had or could
+give under the previous paragraph, plus a right to possession of the
+Corresponding Source of the work from the predecessor in interest, if
+the predecessor has it or can get it with reasonable efforts.
+
+  You may not impose any further restrictions on the exercise of the
+rights granted or affirmed under this License.  For example, you may
+not impose a license fee, royalty, or other charge for exercise of
+rights granted under this License, and you may not initiate litigation
+(including a cross-claim or counterclaim in a lawsuit) alleging that
+any patent claim is infringed by making, using, selling, offering for
+sale, or importing the Program or any portion of it.
+
+  11. Patents.
+
+  A "contributor" is a copyright holder who authorizes use under this
+License of the Program or a work on which the Program is based.  The
+work thus licensed is called the contributor's "contributor version".
+
+  A contributor's "essential patent claims" are all patent claims
+owned or controlled by the contributor, whether already acquired or
+hereafter acquired, that would be infringed by some manner, permitted
+by this License, of making, using, or selling its contributor version,
+but do not include claims that would be infringed only as a
+consequence of further modification of the contributor version.  For
+purposes of this definition, "control" includes the right to grant
+patent sublicenses in a manner consistent with the requirements of
+this License.
+
+  Each contributor grants you a non-exclusive, worldwide, royalty-free
+patent license under the contributor's essential patent claims, to
+make, use, sell, offer for sale, import and otherwise run, modify and
+propagate the contents of its contributor version.
+
+  In the following three paragraphs, a "patent license" is any express
+agreement or commitment, however denominated, not to enforce a patent
+(such as an express permission to practice a patent or covenant not to
+sue for patent infringement).  To "grant" such a patent license to a
+party means to make such an agreement or commitment not to enforce a
+patent against the party.
+
+  If you convey a covered work, knowingly relying on a patent license,
+and the Corresponding Source of the work is not available for anyone
+to copy, free of charge and under the terms of this License, through a
+publicly available network server or other readily accessible means,
+then you must either (1) cause the Corresponding Source to be so
+available, or (2) arrange to deprive yourself of the benefit of the
+patent license for this particular work, or (3) arrange, in a manner
+consistent with the requirements of this License, to extend the patent
+license to downstream recipients.  "Knowingly relying" means you have
+actual knowledge that, but for the patent license, your conveying the
+covered work in a country, or your recipient's use of the covered work
+in a country, would infringe one or more identifiable patents in that
+country that you have reason to believe are valid.
+
+  If, pursuant to or in connection with a single transaction or
+arrangement, you convey, or propagate by procuring conveyance of, a
+covered work, and grant a patent license to some of the parties
+receiving the covered work authorizing them to use, propagate, modify
+or convey a specific copy of the covered work, then the patent license
+you grant is automatically extended to all recipients of the covered
+work and works based on it.
+
+  A patent license is "discriminatory" if it does not include within
+the scope of its coverage, prohibits the exercise of, or is
+conditioned on the non-exercise of one or more of the rights that are
+specifically granted under this License.  You may not convey a covered
+work if you are a party to an arrangement with a third party that is
+in the business of distributing software, under which you make payment
+to the third party based on the extent of your activity of conveying
+the work, and under which the third party grants, to any of the
+parties who would receive the covered work from you, a discriminatory
+patent license (a) in connection with copies of the covered work
+conveyed by you (or copies made from those copies), or (b) primarily
+for and in connection with specific products or compilations that
+contain the covered work, unless you entered into that arrangement,
+or that patent license was granted, prior to 28 March 2007.
+
+  Nothing in this License shall be construed as excluding or limiting
+any implied license or other defenses to infringement that may
+otherwise be available to you under applicable patent law.
+
+  12. No Surrender of Others' Freedom.
+
+  If conditions are imposed on you (whether by court order, agreement or
+otherwise) that contradict the conditions of this License, they do not
+excuse you from the conditions of this License.  If you cannot convey a
+covered work so as to satisfy simultaneously your obligations under this
+License and any other pertinent obligations, then as a consequence you may
+not convey it at all.  For example, if you agree to terms that obligate you
+to collect a royalty for further conveying from those to whom you convey
+the Program, the only way you could satisfy both those terms and this
+License would be to refrain entirely from conveying the Program.
+
+  13. Remote Network Interaction; Use with the GNU General Public License.
+
+  Notwithstanding any other provision of this License, if you modify the
+Program, your modified version must prominently offer all users
+interacting with it remotely through a computer network (if your version
+supports such interaction) an opportunity to receive the Corresponding
+Source of your version by providing access to the Corresponding Source
+from a network server at no charge, through some standard or customary
+means of facilitating copying of software.  This Corresponding Source
+shall include the Corresponding Source for any work covered by version 3
+of the GNU General Public License that is incorporated pursuant to the
+following paragraph.
+
+  Notwithstanding any other provision of this License, you have
+permission to link or combine any covered work with a work licensed
+under version 3 of the GNU General Public License into a single
+combined work, and to convey the resulting work.  The terms of this
+License will continue to apply to the part which is the covered work,
+but the work with which it is combined will remain governed by version
+3 of the GNU General Public License.
+
+  14. Revised Versions of this License.
+
+  The Free Software Foundation may publish revised and/or new versions of
+the GNU Affero General Public License from time to time.  Such new versions
+will be similar in spirit to the present version, but may differ in detail to
+address new problems or concerns.
+
+  Each version is given a distinguishing version number.  If the
+Program specifies that a certain numbered version of the GNU Affero General
+Public License "or any later version" applies to it, you have the
+option of following the terms and conditions either of that numbered
+version or of any later version published by the Free Software
+Foundation.  If the Program does not specify a version number of the
+GNU Affero General Public License, you may choose any version ever published
+by the Free Software Foundation.
+
+  If the Program specifies that a proxy can decide which future
+versions of the GNU Affero General Public License can be used, that proxy's
+public statement of acceptance of a version permanently authorizes you
+to choose that version for the Program.
+
+  Later license versions may give you additional or different
+permissions.  However, no additional obligations are imposed on any
+author or copyright holder as a result of your choosing to follow a
+later version.
+
+  15. Disclaimer of Warranty.
+
+  THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
+APPLICABLE LAW.  EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
+HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY
+OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO,
+THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+PURPOSE.  THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM
+IS WITH YOU.  SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF
+ALL NECESSARY SERVICING, REPAIR OR CORRECTION.
+
+  16. Limitation of Liability.
+
+  IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
+WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS
+THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY
+GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE
+USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF
+DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD
+PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS),
+EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF
+SUCH DAMAGES.
+
+  17. Interpretation of Sections 15 and 16.
+
+  If the disclaimer of warranty and limitation of liability provided
+above cannot be given local legal effect according to their terms,
+reviewing courts shall apply local law that most closely approximates
+an absolute waiver of all civil liability in connection with the
+Program, unless a warranty or assumption of liability accompanies a
+copy of the Program in return for a fee.
+
+                     END OF TERMS AND CONDITIONS
+
+            How to Apply These Terms to Your New Programs
+
+  If you develop a new program, and you want it to be of the greatest
+possible use to the public, the best way to achieve this is to make it
+free software which everyone can redistribute and change under these terms.
+
+  To do so, attach the following notices to the program.  It is safest
+to attach them to the start of each source file to most effectively
+state the exclusion of warranty; and each file should have at least
+the "copyright" line and a pointer to where the full notice is found.
+
+    <one line to give the program's name and a brief idea of what it does.>
+    Copyright (C) <year>  <name of author>
+
+    This program is free software: you can redistribute it and/or modify
+    it under the terms of the GNU Affero General Public License as published
+    by the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU Affero General Public License for more details.
+
+    You should have received a copy of the GNU Affero General Public License
+    along with this program.  If not, see <https://www.gnu.org/licenses/>.
+
+Also add information on how to contact you by electronic and paper mail.
+
+  If your software can interact with users remotely through a computer
+network, you should also make sure that it provides a way for users to
+get its source.  For example, if your program is a web application, its
+interface could display a "Source" link that leads users to an archive
+of the code.  There are many ways you could offer source, and different
+solutions will be better for different programs; see section 13 for the
+specific requirements.
+
+  You should also get your employer (if you work as a programmer) or school,
+if any, to sign a "copyright disclaimer" for the program, if necessary.
+For more information on this, and how to apply and follow the GNU AGPL, see
+<https://www.gnu.org/licenses/>.

packages/svelte-standard-site/README.md

···
+# @ewanc26/svelte-standard-site
+
+> **Canonical source:** This package is now maintained in the [`@ewanc26/pkgs`](https://github.com/ewanc26/pkgs) monorepo under [`packages/svelte-standard-site`](https://github.com/ewanc26/pkgs/tree/main/packages/svelte-standard-site). This copy exists for historical context — please open issues and PRs there.
+
+A SvelteKit library for reading and writing AT Protocol longform content via `site.standard.*` records. Includes a complete design system, publishing tools, federated Bluesky comments, content verification helpers, and pre-built components.
+
+Part of the [`@ewanc26/pkgs`](https://github.com/ewanc26/pkgs) monorepo.
+
+## Installation
+
+```bash
+pnpm add @ewanc26/svelte-standard-site zod
+```
+
+Requires `svelte >= 5` and `@sveltejs/kit >= 2` as peer dependencies.
+
+## Features
+
+- **Reading** — Fetch `site.standard.document` and `site.standard.publication` records from AT Protocol
+- **Writing** — Publish and manage documents via `StandardSitePublisher`
+- **Comments** — Federated Bluesky replies as comments via the `<Comments />` component
+- **Verification** — `.well-known` endpoint helpers to prove content ownership
+- **Design system** — Semantic colour tokens (ink, canvas, primary, secondary, accent) with automatic light/dark mode via Tailwind CSS 4
+- **Type-safe** — Full TypeScript with Zod validation
+- **SSR-ready** — Works with SvelteKit's `fetch` for prerendering
+- **Caching** — In-memory cache with configurable TTL
+
+## Quick Start
+
+### Reading
+
+```typescript
+// src/routes/+page.server.ts
+import { createClient } from '@ewanc26/svelte-standard-site';
+
+export const load = async ({ fetch }) => {
+  const client = createClient({ did: 'did:plc:your-did' });
+  const documents = await client.fetchAllDocuments(fetch);
+  return { documents };
+};
+```
+
+### Publishing
+
+```typescript
+import { StandardSitePublisher } from '@ewanc26/svelte-standard-site/publisher';
+
+const publisher = new StandardSitePublisher({
+  identifier: 'you.bsky.social',
+  password: process.env.ATPROTO_APP_PASSWORD
+});
+await publisher.login();
+await publisher.publishDocument({ site, title, content, publishedAt });
+```
+
+### Comments
+
+```svelte
+<script>
+  import { Comments } from '@ewanc26/svelte-standard-site';
+</script>
+
+<Comments
+  bskyPostUri="at://did:plc:xxx/app.bsky.feed.post/abc"
+  canonicalUrl="https://yourblog.com/posts/my-post"
+/>
+```
+
+## Entry Points
+
+| Import | Description |
+|--------|-------------|
+| `@ewanc26/svelte-standard-site` | Components, client, stores, types, utilities |
+| `@ewanc26/svelte-standard-site/publisher` | `StandardSitePublisher` for writing records |
+| `@ewanc26/svelte-standard-site/content` | Markdown transformation utilities |
+| `@ewanc26/svelte-standard-site/comments` | Comment fetching utilities |
+| `@ewanc26/svelte-standard-site/verification` | `.well-known` and ownership verification |
+| `@ewanc26/svelte-standard-site/schemas` | Zod schemas and `COLLECTIONS` constant |
+| `@ewanc26/svelte-standard-site/config/env` | `getConfigFromEnv()` SvelteKit helper |
+| `@ewanc26/svelte-standard-site/styles/base.css` | Base CSS |
+| `@ewanc26/svelte-standard-site/styles/themes.css` | Theme CSS |
+
+## Development
+
+Development happens in the [`@ewanc26/pkgs`](https://github.com/ewanc26/pkgs) monorepo. Local commands (from `packages/svelte-standard-site`):
+
+```bash
+pnpm build       # svelte-package → dist/
+pnpm dev         # svelte-package --watch
+pnpm dev:app     # vite dev (demo routes)
+pnpm check       # svelte-check
+pnpm test        # vitest run
+```
+
+## Environment Variables
+
+```env
+PUBLIC_ATPROTO_DID=did:plc:your-did-here
+PUBLIC_PUBLICATION_RKEY=3abc123xyz
+
+# For publishing (never commit)
+ATPROTO_APP_PASSWORD=xxxx-xxxx-xxxx-xxxx
+ATPROTO_HANDLE=you.bsky.social
+```
+
+## Licence
+
+AGPL-3.0-only — see the [pkgs monorepo licence](https://github.com/ewanc26/pkgs/blob/main/LICENSE).

packages/svelte-standard-site/docs/comments.md

···
+# Federated Comments
+
+Display Bluesky replies as comments on your blog posts using the Comments component.
+
+## How It Works
+
+1. You publish a blog post
+2. You share it on Bluesky (creating an "announcement post")
+3. People reply to that Bluesky post
+4. The Comments component fetches those replies and displays them as comments
+
+## Quick Start
+
+### 1. Install
+
+```bash
+pnpm add svelte-standard-site
+```
+
+### 2. Add to Your Blog Post
+
+```svelte
+<script lang="ts">
+	import { Comments } from 'svelte-standard-site';
+	import type { PageData } from './$types';
+
+	const { data }: { data: PageData } = $props();
+</script>
+
+<article>
+	<h1>{data.post.title}</h1>
+	{@html data.post.content}
+</article>
+
+{#if data.post.bskyPostUri}
+	<Comments
+		bskyPostUri={data.post.bskyPostUri}
+		canonicalUrl="https://yourblog.com/posts/{data.post.slug}"
+	/>
+{/if}
+```
+
+### 3. Get the AT-URI
+
+When you share your post on Bluesky:
+
+1. Click on your post
+2. Click the "..." menu
+3. Click "Copy post link"
+4. Convert to AT-URI format
+
+```
+URL:    https://bsky.app/profile/you.bsky.social/post/abc123xyz
+AT-URI: at://did:plc:YOUR_DID/app.bsky.feed.post/abc123xyz
+```
+
+### 4. Store the AT-URI
+
+Add it to your post's frontmatter or database:
+
+```yaml
+---
+title: My Blog Post
+date: 2026-01-25
+bskyPostUri: at://did:plc:xxx/app.bsky.feed.post/abc123xyz
+---
+```
+
+## Component Props
+
+```svelte
+<Comments
+  bskyPostUri="at://..."           // Required: AT-URI of announcement post
+  canonicalUrl="https://..."       // Required: URL of your blog post
+  maxDepth={3}                     // Optional: Max reply nesting (default: 3)
+  title="Comments"                 // Optional: Section heading
+  showReplyLink={true}             // Optional: Show "Reply on Bluesky" link
+  class="my-custom-class"          // Optional: Additional CSS classes
+/>
+```
+
+## Workflow
+
+### Complete Example
+
+1. **Write and publish your blog post**
+
+```typescript
+// scripts/publish-post.ts
+import { StandardSitePublisher } from 'svelte-standard-site/publisher';
+
+const publisher = new StandardSitePublisher({
+	identifier: 'you.bsky.social',
+	password: process.env.ATPROTO_APP_PASSWORD!
+});
+
+await publisher.login();
+
+const result = await publisher.publishDocument({
+	site: 'https://yourblog.com',
+	title: 'Understanding ATProto',
+	publishedAt: new Date().toISOString(),
+	path: '/posts/understanding-atproto'
+	// ...
+});
+```
+
+2. **Share on Bluesky**
+
+```typescript
+// Create announcement post
+const agent = publisher.getAtpAgent();
+
+const postResult = await agent.post({
+	text: `New blog post: Understanding ATProto
+
+Read it at: https://yourblog.com/posts/understanding-atproto`,
+	langs: ['en']
+});
+
+console.log('Post URI:', postResult.uri);
+// Save this: at://did:plc:xxx/app.bsky.feed.post/abc123
+```
+
+3. **Update your post with the AT-URI**
+
+```typescript
+await publisher.updateDocument(rkey, {
+	// ... all original fields
+	bskyPostRef: {
+		uri: postResult.uri,
+		cid: postResult.cid
+	}
+});
+```
+
+4. **Comments appear automatically**
+
+The Comments component fetches replies from Bluesky when users visit your post.
+
+## Programmatic Usage
+
+If you want to fetch comments in your load function instead of client-side:
+
+```typescript
+// src/routes/blog/[slug]/+page.server.ts
+import { fetchComments } from 'svelte-standard-site/comments';
+import type { PageServerLoad } from './$types';
+
+export const load: PageServerLoad = async ({ params }) => {
+	const post = await getPost(params.slug); // Your database/CMS
+
+	let comments = [];
+	if (post.bskyPostUri) {
+		comments = await fetchComments({
+			bskyPostUri: post.bskyPostUri,
+			canonicalUrl: `https://yourblog.com/blog/${params.slug}`,
+			maxDepth: 3
+		});
+	}
+
+	return {
+		post,
+		comments
+	};
+};
+```
+
+Then render them manually:
+
+```svelte
+<script lang="ts">
+	import type { PageData } from './$types';
+
+	const { data }: { data: PageData } = $props();
+</script>
+
+<div class="comments">
+	{#each data.comments as comment}
+		<div class="comment">
+			<img src={comment.author.avatar} alt={comment.author.handle} />
+			<p>{comment.text}</p>
+		</div>
+	{/each}
+</div>
+```
+
+## Functions
+
+### fetchComments
+
+```typescript
+import { fetchComments } from 'svelte-standard-site/comments';
+
+const comments = await fetchComments({
+	bskyPostUri: 'at://did:plc:xxx/app.bsky.feed.post/abc123',
+	canonicalUrl: 'https://yourblog.com/posts/my-post',
+	maxDepth: 3
+});
+
+// Returns array of Comment objects
+```
+
+### fetchMentionComments
+
+Fetch posts that mention your blog post URL (even if not replies):
+
+```typescript
+import { fetchMentionComments } from 'svelte-standard-site/comments';
+
+const mentions = await fetchMentionComments('https://yourblog.com/posts/my-post', 3);
+```
+
+### formatRelativeTime
+
+```typescript
+import { formatRelativeTime } from 'svelte-standard-site/comments';
+
+formatRelativeTime('2026-01-25T10:00:00Z');
+// "2 hours ago"
+```
+
+## Types
+
+```typescript
+interface Comment {
+	uri: string; // AT-URI of the reply
+	cid: string; // Content hash
+	author: CommentAuthor;
+	text: string; // Comment text
+	createdAt: string; // ISO date
+	likeCount: number;
+	replyCount: number;
+	replies?: Comment[]; // Nested replies
+	depth: number; // Nesting level (0 = top-level)
+}
+
+interface CommentAuthor {
+	did: string;
+	handle: string;
+	displayName?: string;
+	avatar?: string;
+}
+```
+
+## Styling
+
+The Comments component uses your site's design system classes. You can customize:
+
+```svelte
+<Comments
+  {bskyPostUri}
+  {canonicalUrl}
+  class="my-12 rounded-xl border-2 p-6"
+/>
+
+<style>
+  :global(.comments-section) {
+    /* Custom styles */
+  }
+</style>
+```
+
+## Advanced Usage
+
+### Custom Comment Renderer
+
+Build your own comment UI:
+
+```svelte
+<script lang="ts">
+	import { fetchComments, formatRelativeTime } from 'svelte-standard-site/comments';
+	import { onMount } from 'svelte';
+
+	let comments = $state([]);
+
+	onMount(async () => {
+		comments = await fetchComments({
+			bskyPostUri: 'at://...',
+			canonicalUrl: 'https://...'
+		});
+	});
+</script>
+
+<div class="comments">
+	{#each comments as comment}
+		<article>
+			<header>
+				<a href="https://bsky.app/profile/{comment.author.handle}">
+					{comment.author.displayName || comment.author.handle}
+				</a>
+				<time>{formatRelativeTime(comment.createdAt)}</time>
+			</header>
+
+			<p>{comment.text}</p>
+
+			{#if comment.replies}
+				<!-- Recursively render replies -->
+				{#each comment.replies as reply}
+					<!-- ... -->
+				{/each}
+			{/if}
+		</article>
+	{/each}
+</div>
+```
+
+### Combine with Mentions
+
+Show both replies and mentions:
+
+```typescript
+const [replies, mentions] = await Promise.all([
+	fetchComments({
+		bskyPostUri: post.bskyPostUri,
+		canonicalUrl: post.url
+	}),
+	fetchMentionComments(post.url)
+]);
+
+const allComments = [...replies, ...mentions];
+```
+
+### Filter by Language
+
+```typescript
+const comments = await fetchComments({
+	bskyPostUri,
+	canonicalUrl
+});
+
+const englishComments = comments.filter((c) => {
+	// You'd need to add language detection
+	return detectLanguage(c.text) === 'en';
+});
+```
+
+### Moderation
+
+Since these are from Bluesky, you can use their moderation tools:
+
+```typescript
+const comments = await fetchComments({
+	bskyPostUri,
+	canonicalUrl
+});
+
+// Filter out blocked users
+const moderated = comments.filter((c) => {
+	return !isUserBlocked(c.author.did);
+});
+```
+
+## Best Practices
+
+1. **Always include canonical URL** - Helps with mention detection
+2. **Set appropriate maxDepth** - Too deep can be overwhelming (3 is good)
+3. **Show "Reply on Bluesky" link** - Encourages engagement
+4. **Handle loading states** - Comments load async
+5. **Cache on server** - Fetch in load() for better performance
+6. **Respect privacy** - Remember these are public Bluesky posts
+7. **Test thoroughly** - Ensure AT-URI is correct
+
+## Troubleshooting
+
+### Comments Not Loading
+
+1. **Check the AT-URI format**
+   ```
+   ✅ at://did:plc:xxx/app.bsky.feed.post/abc123
+   ❌ https://bsky.app/profile/you.bsky.social/post/abc123
+   ```
+2. **Verify the post exists** - Visit it on bsky.app
+3. **Check console** - Look for error messages
+4. **Ensure post is public** - Private posts won't be accessible
+
+### Wrong Comments Showing
+
+- Double-check the AT-URI
+- Make sure you're using the announcement post URI, not a reply URI
+
+### Missing Nested Replies
+
+- Increase `maxDepth` prop
+- Check if replies are actually nested (some clients flatten threads)
+
+### Performance Issues
+
+- Fetch comments server-side in `load()`
+- Implement pagination for posts with many comments
+- Cache results
+
+## Static Sites
+
+For static sites (using adapter-static):
+
+1. **Pre-build comments**
+
+```typescript
+// scripts/prebuild-comments.ts
+const posts = await getAllPosts();
+
+for (const post of posts) {
+	if (post.bskyPostUri) {
+		const comments = await fetchComments({
+			bskyPostUri: post.bskyPostUri,
+			canonicalUrl: post.url
+		});
+
+		fs.writeFileSync(`static/comments/${post.slug}.json`, JSON.stringify(comments));
+	}
+}
+```
+
+2. **Load from static file**
+
+```typescript
+// +page.server.ts
+export const load = async ({ params }) => {
+	const comments = JSON.parse(fs.readFileSync(`static/comments/${params.slug}.json`, 'utf-8'));
+
+	return { comments };
+};
+```
+
+3. **Rebuild on schedule** - Use GitHub Actions or similar to rebuild daily/weekly
+
+## Examples
+
+### Basic Blog Post
+
+```svelte
+<script lang="ts">
+	import { Comments } from 'svelte-standard-site';
+
+	const post = {
+		title: 'My Post',
+		content: '...',
+		bskyPostUri: 'at://did:plc:xxx/app.bsky.feed.post/abc123'
+	};
+</script>
+
+<article>
+	<h1>{post.title}</h1>
+	{@html post.content}
+</article>
+
+<Comments
+	bskyPostUri={post.bskyPostUri}
+	canonicalUrl="https://yourblog.com/posts/my-post"
+/>
+```
+
+### With Loading State
+
+```svelte
+<script lang="ts">
+	import { Comments } from 'svelte-standard-site';
+	import { page } from '$app/stores';
+
+	const { data } = $props();
+
+	let commentsLoaded = $state(false);
+</script>
+
+<article>
+	<!-- Post content -->
+</article>
+
+{#if data.post.bskyPostUri}
+	<div class="comments-wrapper">
+		{#if !commentsLoaded}
+			<div class="loading">Loading comments...</div>
+		{/if}
+
+		<Comments
+			bskyPostUri={data.post.bskyPostUri}
+			canonicalUrl={$page.url.href}
+			on:load={() => (commentsLoaded = true)}
+		/>
+	</div>
+{/if}
+```
+
+## Next Steps
+
+- [Publishing](./publishing.md)
+- [Content Transformation](./content-transformation.md)
+- [Verification](./verification.md)

packages/svelte-standard-site/docs/content-transformation.md

···
+# Content Transformation
+
+Content transformation utilities convert your markdown content into formats suitable for ATProto publishing.
+
+## Why Transform Content?
+
+When publishing to ATProto, you need to:
+
+1. **Convert sidenotes** - HTML sidenotes → markdown blockquotes
+2. **Resolve links** - Relative URLs → absolute URLs
+3. **Extract plain text** - For search indexing (`textContent` field)
+4. **Calculate metadata** - Word count and reading time
+
+## Quick Start
+
+```typescript
+import { transformContent } from 'svelte-standard-site/content';
+
+const markdown = `
+# My Blog Post
+
+This is [a link](/about) with some content.
+
+<div class="sidenote">
+  <span class="sidenote-label">Tip</span>
+  <p>This is helpful information</p>
+</div>
+`;
+
+const result = transformContent(markdown, {
+	baseUrl: 'https://yourblog.com'
+});
+
+// result.markdown - Clean markdown for ATProto
+// result.textContent - Plain text for search
+// result.wordCount - Number of words
+// result.readingTime - Estimated minutes to read
+```
+
+## Individual Functions
+
+### Convert Sidenotes
+
+Transform HTML sidenotes into markdown blockquotes:
+
+```typescript
+import { convertSidenotes, convertComplexSidenotes } from 'svelte-standard-site/content';
+
+const input = `
+<div class="sidenote sidenote--tip">
+  <span class="sidenote-label">Tip</span>
+  <p>This is a helpful tip</p>
+</div>
+`;
+
+const output = convertSidenotes(input);
+// > **Tip:** This is a helpful tip
+
+// For complex sidenotes with multiple paragraphs:
+const complex = convertComplexSidenotes(input);
+```
+
+### Resolve Relative Links
+
+Convert relative URLs to absolute:
+
+```typescript
+import { resolveRelativeLinks } from 'svelte-standard-site/content';
+
+const input = `
+[About page](/about)
+![Image](/images/photo.jpg)
+`;
+
+const output = resolveRelativeLinks(input, 'https://yourblog.com');
+// [About page](https://yourblog.com/about)
+// ![Image](https://yourblog.com/images/photo.jpg)
+```
+
+### Strip to Plain Text
+
+Extract plain text from markdown:
+
+```typescript
+import { stripToPlainText } from 'svelte-standard-site/content';
+
+const markdown = `
+# Heading
+
+This is **bold** and *italic*.
+
+[Link](https://example.com)
+`;
+
+const plain = stripToPlainText(markdown);
+// Heading
+// This is bold and italic.
+// Link
+```
+
+### Calculate Metadata
+
+```typescript
+import { countWords, calculateReadingTime } from 'svelte-standard-site/content';
+
+const text = 'Your blog post content here...';
+const words = countWords(text); // 42
+const minutes = calculateReadingTime(words); // 1 (assumes 200 wpm)
+
+// Custom reading speed
+const slowRead = calculateReadingTime(words, 150); // Slower pace
+```
+
+## Complete Pipeline
+
+The `transformContent` function runs all transformations:
+
+```typescript
+import { transformContent } from 'svelte-standard-site/content';
+
+const result = transformContent(rawMarkdown, {
+	baseUrl: 'https://yourblog.com',
+	postPath: '/blog/my-post' // Optional
+});
+
+// Use in publisher
+await publisher.publishDocument({
+	site: 'https://yourblog.com',
+	title: 'My Post',
+	publishedAt: new Date().toISOString(),
+	content: {
+		$type: 'site.standard.content.markdown',
+		text: result.markdown,
+		version: '1.0'
+	},
+	textContent: result.textContent
+});
+```
+
+## Use Cases
+
+### Publishing from Markdown Files
+
+```typescript
+import fs from 'fs';
+import matter from 'gray-matter';
+import { transformContent } from 'svelte-standard-site/content';
+
+const file = fs.readFileSync('./posts/my-post.md', 'utf-8');
+const { data, content } = matter(file);
+
+const transformed = transformContent(content, {
+	baseUrl: 'https://yourblog.com'
+});
+
+// Now publish...
+```
+
+### SvelteKit Form Actions
+
+```typescript
+// src/routes/admin/publish/+page.server.ts
+import { transformContent } from 'svelte-standard-site/content';
+import type { Actions } from './$types';
+
+export const actions = {
+	publish: async ({ request }) => {
+		const formData = await request.formData();
+		const markdown = formData.get('content') as string;
+
+		const transformed = transformContent(markdown, {
+			baseUrl: 'https://yourblog.com'
+		});
+
+		// Publish using transformed content
+	}
+} satisfies Actions;
+```
+
+### Preview with Metadata
+
+```svelte
+<script lang="ts">
+	import { transformContent } from 'svelte-standard-site/content';
+
+	let markdown = $state('');
+	let preview = $derived(
+		transformContent(markdown, {
+			baseUrl: 'https://yourblog.com'
+		})
+	);
+</script>
+
+<div>
+	<textarea bind:value={markdown} />
+
+	<div class="stats">
+		<p>Words: {preview.wordCount}</p>
+		<p>Reading time: {preview.readingTime} min</p>
+	</div>
+
+	<div class="preview">
+		{@html marked(preview.markdown)}
+	</div>
+</div>
+```
+
+## Advanced Examples
+
+### Custom Sidenote Formats
+
+If you have custom sidenote HTML, create your own converter:
+
+```typescript
+function convertCustomSidenotes(markdown: string): string {
+	const regex = /<aside class="note">([\s\S]*?)<\/aside>/gi;
+
+	return markdown.replace(regex, (match, content) => {
+		const clean = content.replace(/<[^>]+>/g, '').trim();
+		return `\n> ${clean}\n`;
+	});
+}
+
+// Use in pipeline
+import { resolveRelativeLinks, stripToPlainText } from 'svelte-standard-site/content';
+
+let transformed = convertCustomSidenotes(markdown);
+transformed = resolveRelativeLinks(transformed, baseUrl);
+const textContent = stripToPlainText(transformed);
+```
+
+### Preserve Certain HTML
+
+If you want to keep some HTML in the markdown:
+
+```typescript
+function stripToPlainTextPreserveCode(markdown: string): string {
+	// Extract code blocks first
+	const codeBlocks: string[] = [];
+	let text = markdown.replace(/```[\s\S]*?```/g, (match) => {
+		codeBlocks.push(match);
+		return `__CODE_BLOCK_${codeBlocks.length - 1}__`;
+	});
+
+	// Strip other markdown
+	text = stripToPlainText(text);
+
+	// Restore code blocks
+	text = text.replace(/__CODE_BLOCK_(\d+)__/g, (_, index) => codeBlocks[parseInt(index)]);
+
+	return text;
+}
+```
+
+### Image Alt Text Extraction
+
+Extract all image alt text for accessibility metadata:
+
+```typescript
+function extractImageAltText(markdown: string): string[] {
+	const regex = /!\[([^\]]*)\]/g;
+	const matches = [];
+	let match;
+
+	while ((match = regex.exec(markdown)) !== null) {
+		if (match[1]) {
+			matches.push(match[1]);
+		}
+	}
+
+	return matches;
+}
+
+const altTexts = extractImageAltText(markdown);
+// ['Photo of sunset', 'Diagram showing architecture']
+```
+
+## Best Practices
+
+1. **Always transform before publishing** - Don't skip transformation
+2. **Include textContent** - Essential for search and accessibility
+3. **Use absolute URLs** - Prevents broken links on other platforms
+4. **Test transformations** - Write tests for custom sidenotes
+5. **Validate output** - Ensure markdown is valid before publishing
+6. **Consider locale** - If using date formatting, respect user locale
+
+## Common Issues
+
+### Sidenotes Not Converting
+
+Make sure the HTML structure matches exactly:
+
+```html
+<!-- This works -->
+<div class="sidenote">
+	<span class="sidenote-label">Note</span>
+	<p>Content</p>
+</div>
+
+<!-- This won't work (missing class) -->
+<div>
+	<span>Note</span>
+	<p>Content</p>
+</div>
+```
+
+### Links Not Resolving
+
+Ensure you're passing the base URL correctly:
+
+```typescript
+// ❌ Wrong - missing protocol
+transformContent(md, { baseUrl: 'yourblog.com' });
+
+// ✅ Correct
+transformContent(md, { baseUrl: 'https://yourblog.com' });
+
+// ✅ Also correct - trailing slash is OK
+transformContent(md, { baseUrl: 'https://yourblog.com/' });
+```
+
+### Plain Text Too Long
+
+The `textContent` field should be shorter than the markdown. If it's the same length, check that your markdown is being processed:
+
+```typescript
+const result = transformContent(markdown, options);
+
+console.log('Markdown length:', result.markdown.length);
+console.log('Text length:', result.textContent.length);
+// Text should be shorter
+```
+
+## Performance Tips
+
+For large documents, transformation can be slow. Consider:
+
+1. **Cache results** - Don't re-transform unchanged content
+2. **Transform on build** - Pre-transform content at build time
+3. **Lazy load** - Transform on-demand for preview
+
+```typescript
+// Cache example
+const cache = new Map();
+
+function getCachedTransform(markdown: string, options: TransformOptions) {
+	const key = `${markdown.substring(0, 100)}:${options.baseUrl}`;
+
+	if (cache.has(key)) {
+		return cache.get(key);
+	}
+
+	const result = transformContent(markdown, options);
+	cache.set(key, result);
+	return result;
+}
+```
+
+## Next Steps
+
+- [Publishing](./publishing.md)
+- [Verification](./verification.md)
+- [Comments](./comments.md)

packages/svelte-standard-site/docs/publishing.md

···
+# Publishing to ATProto
+
+This guide explains how to publish content FROM your SvelteKit site TO the ATProto network (Bluesky, Leaflet, WhiteWind, etc.).
+
+## Prerequisites
+
+1. A Bluesky account (or any ATProto account)
+2. An app password (NOT your main password)
+   - Get one at: https://bsky.app/settings/app-passwords
+3. Your DID (Decentralized Identifier)
+   - Find it at: https://bsky.app/settings
+
+## Quick Start
+
+### 1. Install Dependencies
+
+```bash
+pnpm add svelte-standard-site zod
+```
+
+### 2. Create a Publication
+
+A publication represents your blog/site on ATProto.
+
+```typescript
+// scripts/create-publication.ts
+import { StandardSitePublisher } from 'svelte-standard-site/publisher';
+
+const publisher = new StandardSitePublisher({
+	identifier: 'you.bsky.social', // or your DID
+	password: process.env.ATPROTO_APP_PASSWORD!
+});
+
+await publisher.login();
+
+const result = await publisher.publishPublication({
+	name: 'My Awesome Blog',
+	url: 'https://yourblog.com',
+	description: 'Thoughts on code, life, and everything',
+	basicTheme: {
+		background: { r: 255, g: 245, b: 235 },
+		foreground: { r: 30, g: 30, b: 30 },
+		accent: { r: 74, g: 124, b: 155 },
+		accentForeground: { r: 255, g: 255, b: 255 }
+	}
+});
+
+console.log('Publication created!');
+console.log('AT-URI:', result.uri);
+console.log('Save this rkey:', result.uri.split('/').pop());
+```
+
+Run it:
+
+```bash
+ATPROTO_APP_PASSWORD="xxxx-xxxx-xxxx-xxxx" node scripts/create-publication.ts
+```
+
+### 3. Publish Documents
+
+Create a script to sync your blog posts to ATProto:
+
+```typescript
+// scripts/publish-posts.ts
+import { StandardSitePublisher } from 'svelte-standard-site/publisher';
+import { transformContent } from 'svelte-standard-site/content';
+import fs from 'fs';
+import matter from 'gray-matter';
+
+const publisher = new StandardSitePublisher({
+	identifier: 'you.bsky.social',
+	password: process.env.ATPROTO_APP_PASSWORD!
+});
+
+await publisher.login();
+
+// Read your markdown files
+const files = fs.readdirSync('./content/posts');
+
+for (const file of files) {
+	const content = fs.readFileSync(`./content/posts/${file}`, 'utf-8');
+	const { data, content: markdown } = matter(content);
+
+	// Transform content for ATProto
+	const transformed = transformContent(markdown, {
+		baseUrl: 'https://yourblog.com'
+	});
+
+	// Publish to ATProto
+	const result = await publisher.publishDocument({
+		site: 'https://yourblog.com', // or AT-URI of your publication
+		title: data.title,
+		description: data.description,
+		publishedAt: data.date.toISOString(),
+		path: `/posts/${file.replace('.md', '')}`,
+		tags: data.tags,
+		content: {
+			$type: 'site.standard.content.markdown',
+			text: transformed.markdown,
+			version: '1.0'
+		},
+		textContent: transformed.textContent
+	});
+
+	console.log(`Published: ${data.title}`);
+	console.log(`  → ${result.uri}`);
+}
+```
+
+## Advanced Usage
+
+### Update Existing Documents
+
+```typescript
+// Get the rkey from the original publish result
+const rkey = '3abc123xyz789';
+
+await publisher.updateDocument(rkey, {
+	site: 'https://yourblog.com',
+	title: 'Updated Title',
+	publishedAt: originalDate.toISOString(),
+	updatedAt: new Date().toISOString(),
+	content: {
+		$type: 'site.standard.content.markdown',
+		text: updatedMarkdown
+	}
+});
+```
+
+### Delete Documents
+
+```typescript
+await publisher.deleteDocument('3abc123xyz789');
+```
+
+### List Your Published Documents
+
+```typescript
+const documents = await publisher.listDocuments();
+
+for (const doc of documents) {
+	console.log(`${doc.value.title} - ${doc.uri}`);
+}
+```
+
+### Custom Themes
+
+```typescript
+await publisher.publishPublication({
+	name: 'Dark Mode Blog',
+	url: 'https://yourblog.com',
+	basicTheme: {
+		background: { r: 13, g: 17, b: 23 }, // Dark
+		foreground: { r: 230, g: 237, b: 243 }, // Light text
+		accent: { r: 136, g: 58, b: 234 }, // Purple
+		accentForeground: { r: 255, g: 255, b: 255 }
+	}
+});
+```
+
+### With Cover Images
+
+First, upload the image as a blob:
+
+```typescript
+const agent = publisher.getAtpAgent();
+
+const imageBuffer = fs.readFileSync('./cover.jpg');
+const uploadResult = await agent.uploadBlob(imageBuffer, {
+	encoding: 'image/jpeg'
+});
+
+await publisher.publishDocument({
+	// ...other fields
+	coverImage: {
+		$type: 'blob',
+		ref: { $link: uploadResult.data.blob.ref.$link },
+		mimeType: 'image/jpeg',
+		size: imageBuffer.length
+	}
+});
+```
+
+## SvelteKit Integration
+
+### Create an Admin Route
+
+```typescript
+// src/routes/admin/publish/+page.server.ts
+import { StandardSitePublisher } from 'svelte-standard-site/publisher';
+import { env } from '$env/dynamic/private';
+import { error } from '@sveltejs/kit';
+import type { PageServerLoad, Actions } from './$types';
+
+export const load: PageServerLoad = async () => {
+	// List existing documents
+	const publisher = new StandardSitePublisher({
+		identifier: env.ATPROTO_HANDLE!,
+		password: env.ATPROTO_APP_PASSWORD!
+	});
+
+	await publisher.login();
+	const documents = await publisher.listDocuments();
+
+	return {
+		documents
+	};
+};
+
+export const actions = {
+	publish: async ({ request }) => {
+		const data = await request.formData();
+		const title = data.get('title') as string;
+		const content = data.get('content') as string;
+
+		const publisher = new StandardSitePublisher({
+			identifier: env.ATPROTO_HANDLE!,
+			password: env.ATPROTO_APP_PASSWORD!
+		});
+
+		await publisher.login();
+
+		const result = await publisher.publishDocument({
+			site: env.PUBLIC_SITE_URL!,
+			title,
+			publishedAt: new Date().toISOString(),
+			content: {
+				$type: 'site.standard.content.markdown',
+				text: content
+			}
+		});
+
+		return { success: true, uri: result.uri };
+	}
+} satisfies Actions;
+```
+
+## Important Notes
+
+### Security
+
+1. **Never commit app passwords** - Use environment variables
+2. **Never use main password** - Always use app passwords
+3. **Validate input** - Always validate data before publishing
+4. **Rate limiting** - Be mindful of API rate limits
+
+### TID Format
+
+Record keys (rkeys) MUST be TIDs (Timestamp Identifiers). The publisher generates these automatically. Do not manually create rkeys.
+
+### PDS Resolution
+
+The publisher automatically resolves your PDS from your DID document. You don't need to specify it unless you're using a custom PDS.
+
+### Content Types
+
+The `content` field is an open union. Different platforms support different types:
+
+- `site.standard.content.markdown` - Markdown content
+- `site.standard.content.html` - HTML content
+- Platform-specific types
+
+Always include `textContent` for search/indexing.
+
+## Troubleshooting
+
+### "Failed to resolve handle"
+
+- Check your handle is correct
+- Verify your PDS is reachable
+- Ensure you're using an app password
+
+### "Schema validation failed"
+
+- Check your data matches the schema
+- Ensure dates are ISO 8601 format
+- Verify URLs are valid
+
+### "Invalid TID"
+
+- Don't manually create rkeys
+- Let the publisher generate TIDs automatically
+
+### "Authentication failed"
+
+- Verify your app password is correct
+- Check it hasn't been revoked
+- Ensure you're not using your main password
+
+## Best Practices
+
+1. **Use content transformation** - Always run markdown through `transformContent()`
+2. **Include textContent** - Provides plain text for search
+3. **Add descriptions** - Helps with discovery
+4. **Use tags** - Categorize your content
+5. **Set updatedAt** - Track when content changes
+6. **Link Bluesky posts** - Use `bskyPostRef` for engagement
+7. **Verify ownership** - Set up `.well-known` endpoints
+
+## Next Steps
+
+- [Content Transformation](./content-transformation.md)
+- [Verification](./verification.md)
+- [Comments](./comments.md)

packages/svelte-standard-site/docs/verification.md

···
+# Content Verification
+
+Verification proves that you own the content you've published to ATProto. This is done through `.well-known` endpoints and `<link>` tags.
+
+## Why Verify?
+
+Verification allows platforms like Leaflet and WhiteWind to:
+
+1. Confirm you control the content you claim to have published
+2. Prevent impersonation
+3. Enable features that require ownership proof
+4. Build trust in the federated ecosystem
+
+## Quick Start
+
+### 1. Create .well-known Endpoint
+
+Create a SvelteKit endpoint at `.well-known/site.standard.publication`:
+
+```typescript
+// src/routes/.well-known/site.standard.publication/+server.ts
+import { text } from '@sveltejs/kit';
+import { generatePublicationWellKnown } from 'svelte-standard-site/verification';
+
+export function GET() {
+	return text(
+		generatePublicationWellKnown({
+			did: 'did:plc:your-did-here',
+			publicationRkey: '3abc123xyz789' // From publication creation
+		})
+	);
+}
+```
+
+### 2. Verify It Works
+
+```bash
+curl https://yourblog.com/.well-known/site.standard.publication
+# Should output: at://did:plc:xxx/site.standard.publication/3abc123xyz789
+```
+
+### 3. Add Link Tag (Optional)
+
+Add verification to individual documents:
+
+```svelte
+<!-- src/routes/blog/[slug]/+page.svelte -->
+<script lang="ts">
+	import { generateDocumentLinkTag } from 'svelte-standard-site/verification';
+
+	const { data } = $props();
+</script>
+
+<svelte:head>
+	{@html generateDocumentLinkTag({
+		did: 'did:plc:xxx',
+		documentRkey: data.rkey
+	})}
+</svelte:head>
+```
+
+## Functions
+
+### generatePublicationWellKnown
+
+Generate content for the `.well-known` endpoint:
+
+```typescript
+import { generatePublicationWellKnown } from 'svelte-standard-site/verification';
+
+const content = generatePublicationWellKnown({
+	did: 'did:plc:xxx',
+	publicationRkey: '3abc123xyz'
+});
+// Returns: "at://did:plc:xxx/site.standard.publication/3abc123xyz"
+```
+
+### generateDocumentLinkTag
+
+Generate a `<link>` tag for a specific document:
+
+```typescript
+import { generateDocumentLinkTag } from 'svelte-standard-site/verification';
+
+const tag = generateDocumentLinkTag({
+	did: 'did:plc:xxx',
+	documentRkey: '3xyz789abc'
+});
+// Returns: '<link rel="site.standard.document" href="at://...">'
+```
+
+### generatePublicationLinkTag
+
+Generate a `<link>` tag for your publication:
+
+```typescript
+import { generatePublicationLinkTag } from 'svelte-standard-site/verification';
+
+const tag = generatePublicationLinkTag({
+	did: 'did:plc:xxx',
+	publicationRkey: '3abc123xyz'
+});
+```
+
+### verifyPublicationWellKnown
+
+Programmatically verify a site's `.well-known` endpoint:
+
+```typescript
+import { verifyPublicationWellKnown } from 'svelte-standard-site/verification';
+
+const isValid = await verifyPublicationWellKnown(
+	'https://example.com',
+	'did:plc:xxx',
+	'3abc123xyz'
+);
+
+if (isValid) {
+	console.log('Site is verified!');
+}
+```
+
+## Complete Setup
+
+### Get Your Publication Rkey
+
+When you create a publication, save the rkey:
+
+```typescript
+import { StandardSitePublisher } from 'svelte-standard-site/publisher';
+
+const publisher = new StandardSitePublisher({
+	identifier: 'you.bsky.social',
+	password: process.env.ATPROTO_APP_PASSWORD!
+});
+
+await publisher.login();
+
+const result = await publisher.publishPublication({
+	name: 'My Blog',
+	url: 'https://yourblog.com'
+});
+
+// Save these!
+console.log('DID:', publisher.getDid());
+console.log('Rkey:', result.uri.split('/').pop());
+```
+
+### Store in Environment Variables
+
+```env
+# .env
+PUBLIC_ATPROTO_DID=did:plc:xxx
+PUBLIC_PUBLICATION_RKEY=3abc123xyz
+```
+
+### Create Endpoint
+
+```typescript
+// src/routes/.well-known/site.standard.publication/+server.ts
+import { text } from '@sveltejs/kit';
+import { generatePublicationWellKnown } from 'svelte-standard-site/verification';
+import { PUBLIC_ATPROTO_DID, PUBLIC_PUBLICATION_RKEY } from '$env/static/public';
+
+export function GET() {
+	return text(
+		generatePublicationWellKnown({
+			did: PUBLIC_ATPROTO_DID,
+			publicationRkey: PUBLIC_PUBLICATION_RKEY
+		}),
+		{
+			headers: {
+				'Content-Type': 'text/plain',
+				'Cache-Control': 'public, max-age=3600'
+			}
+		}
+	);
+}
+```
+
+### Add to Site Header
+
+```svelte
+<!-- src/routes/+layout.svelte -->
+<script lang="ts">
+	import { generatePublicationLinkTag } from 'svelte-standard-site/verification';
+	import { PUBLIC_ATPROTO_DID, PUBLIC_PUBLICATION_RKEY } from '$env/static/public';
+</script>
+
+<svelte:head>
+	{@html generatePublicationLinkTag({
+		did: PUBLIC_ATPROTO_DID,
+		publicationRkey: PUBLIC_PUBLICATION_RKEY
+	})}
+</svelte:head>
+```
+
+## Document Verification
+
+For individual blog posts:
+
+### Store Document Rkeys
+
+When publishing, save the mapping:
+
+```typescript
+// In your publish script
+const result = await publisher.publishDocument({
+	// ... document data
+});
+
+// Save mapping: slug -> rkey
+const mapping = {
+	'my-first-post': result.uri.split('/').pop(),
+	'another-post': '3xyz789abc'
+	// etc.
+};
+
+fs.writeFileSync('document-rkeys.json', JSON.stringify(mapping));
+```
+
+### Add to Document Pages
+
+```svelte
+<!-- src/routes/blog/[slug]/+page.svelte -->
+<script lang="ts">
+	import { generateDocumentLinkTag } from 'svelte-standard-site/verification';
+	import documentRkeys from '$lib/document-rkeys.json';
+
+	const { data } = $props();
+	const rkey = documentRkeys[data.slug];
+</script>
+
+<svelte:head>
+	{#if rkey}
+		{@html generateDocumentLinkTag({
+			did: 'did:plc:xxx',
+			documentRkey: rkey
+		})}
+	{/if}
+</svelte:head>
+```
+
+## AT-URI Utilities
+
+### Build AT-URIs
+
+```typescript
+import { getDocumentAtUri, getPublicationAtUri } from 'svelte-standard-site/verification';
+
+const docUri = getDocumentAtUri('did:plc:xxx', '3xyz789abc');
+// "at://did:plc:xxx/site.standard.document/3xyz789abc"
+
+const pubUri = getPublicationAtUri('did:plc:xxx', '3abc123xyz');
+// "at://did:plc:xxx/site.standard.publication/3abc123xyz"
+```
+
+### Parse AT-URIs
+
+```typescript
+import { parseAtUri } from 'svelte-standard-site/verification';
+
+const parsed = parseAtUri('at://did:plc:xxx/site.standard.document/3xyz');
+
+if (parsed) {
+	console.log(parsed.did); // "did:plc:xxx"
+	console.log(parsed.collection); // "site.standard.document"
+	console.log(parsed.rkey); // "3xyz"
+}
+```
+
+### Extract from HTML
+
+```typescript
+import { extractDocumentLinkFromHtml, extractPublicationLinkFromHtml } from 'svelte-standard-site/verification';
+
+const html = await fetch('https://example.com/post').then((r) => r.text());
+
+const docUri = extractDocumentLinkFromHtml(html);
+// "at://did:plc:xxx/site.standard.document/3xyz"
+
+const pubUri = extractPublicationLinkFromHtml(html);
+// "at://did:plc:xxx/site.standard.publication/3abc"
+```
+
+## Verification Flow
+
+1. **Publish** a publication to ATProto
+2. **Save** the DID and rkey
+3. **Create** `.well-known` endpoint returning the AT-URI
+4. **Optionally** add `<link>` tags to your HTML
+5. **Platforms** fetch your `.well-known` endpoint to verify ownership
+
+```mermaid
+sequenceDiagram
+    participant You
+    participant ATProto
+    participant Platform
+    
+    You->>ATProto: Publish publication
+    ATProto->>You: Return AT-URI
+    You->>Your Site: Add .well-known endpoint
+    Platform->>Your Site: Fetch .well-known
+    Your Site->>Platform: Return AT-URI
+    Platform->>ATProto: Verify AT-URI exists
+    ATProto->>Platform: Confirmed
+    Platform->>Platform: Mark as verified ✓
+```
+
+## Troubleshooting
+
+### .well-known Returning 404
+
+SvelteKit requires special handling for `.well-known`:
+
+```typescript
+// Option 1: Create the exact path
+// src/routes/.well-known/site.standard.publication/+server.ts
+
+// Option 2: Use static files
+// static/.well-known/site.standard.publication
+```
+
+If using static files, make sure your hosting platform allows `.well-known`.
+
+### Wrong MIME Type
+
+Ensure you're returning `text/plain`:
+
+```typescript
+export function GET() {
+	return text(content, {
+		headers: {
+			'Content-Type': 'text/plain'
+		}
+	});
+}
+```
+
+### CORS Issues
+
+If platforms can't access your endpoint:
+
+```typescript
+export function GET() {
+	return text(content, {
+		headers: {
+			'Content-Type': 'text/plain',
+			'Access-Control-Allow-Origin': '*'
+		}
+	});
+}
+```
+
+### Verification Failing
+
+Use the verification utility to test:
+
+```typescript
+const isValid = await verifyPublicationWellKnown(
+	'https://yourblog.com',
+	'did:plc:xxx',
+	'3abc123xyz'
+);
+
+if (!isValid) {
+	// Check:
+	// 1. .well-known endpoint is accessible
+	// 2. Returns exact AT-URI
+	// 3. No extra whitespace
+	// 4. Correct MIME type
+}
+```
+
+## Best Practices
+
+1. **Use environment variables** - Don't hardcode DIDs/rkeys
+2. **Add caching headers** - `.well-known` content doesn't change often
+3. **Test before deploying** - Verify the endpoint works
+4. **Keep rkeys secure** - Don't expose in client code unnecessarily
+5. **Monitor** - Check that verification keeps working after deploys
+
+## Hosting Platform Notes
+
+### Vercel
+
+Works out of the box. No special configuration needed.
+
+### Netlify
+
+Add to `netlify.toml`:
+
+```toml
+[[redirects]]
+  from = "/.well-known/site.standard.publication"
+  to = "/.well-known/site.standard.publication/index.html"
+  status = 200
+```
+
+### Cloudflare Pages
+
+Works by default. Consider adding a cache rule for `.well-known`.
+
+### GitHub Pages
+
+Static files work, but SvelteKit endpoints don't. Use the static file approach.
+
+## Next Steps
+
+- [Publishing](./publishing.md)
+- [Content Transformation](./content-transformation.md)
+- [Comments](./comments.md)

packages/svelte-standard-site/package.json

···
+{
+	"name": "@ewanc26/svelte-standard-site",
+	"version": "0.1.0",
+	"description": "SvelteKit library for reading and writing AT Protocol longform content via site.standard.* records — with a complete design system, federated comments, publishing tools, and content verification.",
+	"license": "AGPL-3.0-only",
+	"author": {
+		"name": "Ewan Croft",
+		"url": "https://github.com/ewanc26"
+	},
+	"type": "module",
+	"svelte": "./dist/index.js",
+	"types": "./dist/index.d.ts",
+	"exports": {
+		".": {
+			"types": "./dist/index.d.ts",
+			"svelte": "./dist/index.js",
+			"default": "./dist/index.js"
+		},
+		"./publisher": {
+			"types": "./dist/publisher.d.ts",
+			"default": "./dist/publisher.js"
+		},
+		"./content": {
+			"types": "./dist/utils/content.d.ts",
+			"default": "./dist/utils/content.js"
+		},
+		"./comments": {
+			"types": "./dist/utils/comments.d.ts",
+			"default": "./dist/utils/comments.js"
+		},
+		"./verification": {
+			"types": "./dist/utils/verification.d.ts",
+			"default": "./dist/utils/verification.js"
+		},
+		"./schemas": {
+			"types": "./dist/schemas.d.ts",
+			"default": "./dist/schemas.js"
+		},
+		"./config/env": {
+			"types": "./dist/config/env.d.ts",
+			"default": "./dist/config/env.js"
+		},
+		"./styles/base.css": {
+			"default": "./dist/styles/base.css"
+		},
+		"./styles/themes.css": {
+			"default": "./dist/styles/themes.css"
+		}
+	},
+	"files": [
+		"dist",
+		"src/lib",
+		"README.md"
+	],
+	"sideEffects": [
+		"**/*.css"
+	],
+	"publishConfig": {
+		"access": "public"
+	},
+	"scripts": {
+		"build": "svelte-kit sync && svelte-package -i src/lib -o dist && publint",
+		"dev": "svelte-kit sync && svelte-package -i src/lib -o dist --watch",
+		"dev:app": "vite dev",
+		"preview": "vite preview",
+		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+		"test": "vitest run",
+		"test:watch": "vitest",
+		"format": "prettier --write .",
+		"lint": "prettier --check ."
+	},
+	"peerDependencies": {
+		"@sveltejs/kit": "^2.0.0",
+		"svelte": "^5.0.0"
+	},
+	"dependencies": {
+		"@atproto/api": "^0.18.16",
+		"@ewanc26/atproto": "workspace:*",
+		"@ewanc26/tid": "workspace:*",
+		"@ewanc26/utils": "workspace:*",
+		"@lucide/svelte": "^0.562.0",
+		"katex": "^0.16.27",
+		"shiki": "^3.21.0",
+		"zod": "^3.24.0"
+	},
+	"devDependencies": {
+		"@sveltejs/adapter-auto": "^7.0.0",
+		"@sveltejs/kit": "^2.49.1",
+		"@sveltejs/package": "^2.5.7",
+		"@sveltejs/vite-plugin-svelte": "^6.2.1",
+		"@tailwindcss/typography": "^0.5.19",
+		"@tailwindcss/vite": "^4.1.17",
+		"@types/node": "^22.0.0",
+		"prettier": "^3.7.4",
+		"prettier-plugin-svelte": "^3.4.0",
+		"prettier-plugin-tailwindcss": "^0.7.2",
+		"publint": "^0.3.15",
+		"svelte": "^5.45.6",
+		"svelte-check": "^4.3.4",
+		"tailwindcss": "^4.1.17",
+		"typescript": "^5.9.3",
+		"vite": "^7.2.6",
+		"vitest": "^4.0.16"
+	},
+	"keywords": [
+		"svelte",
+		"sveltekit",
+		"atproto",
+		"at-protocol",
+		"bluesky",
+		"site-standard",
+		"blog",
+		"cms",
+		"design-system",
+		"components",
+		"dark-mode",
+		"light-mode",
+		"theme",
+		"publishing",
+		"federation",
+		"comments"
+	],
+	"repository": {
+		"type": "git",
+		"url": "git+https://github.com/ewanc26/pkgs.git",
+		"directory": "packages/svelte-standard-site"
+	},
+	"homepage": "https://github.com/ewanc26/pkgs/tree/main/packages/svelte-standard-site",
+	"bugs": {
+		"url": "https://github.com/ewanc26/pkgs/issues"
+	}
+}

packages/svelte-standard-site/pnpm-lock.yaml

···
+lockfileVersion: '9.0'
+
+settings:
+  autoInstallPeers: true
+  excludeLinksFromLockfile: false
+
+importers:
+
+  .:
+    dependencies:
+      '@atproto/api':
+        specifier: ^0.18.16
+        version: 0.18.16
+      '@lucide/svelte':
+        specifier: ^0.562.0
+        version: 0.562.0(svelte@5.46.4)
+      katex:
+        specifier: ^0.16.27
+        version: 0.16.27
+      shiki:
+        specifier: ^3.21.0
+        version: 3.21.0
+    devDependencies:
+      '@sveltejs/adapter-auto':
+        specifier: ^7.0.0
+        version: 7.0.0(@sveltejs/kit@2.50.0(@sveltejs/vite-plugin-svelte@6.2.4(svelte@5.46.4)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2)))(svelte@5.46.4)(typescript@5.9.3)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2)))
+      '@sveltejs/kit':
+        specifier: ^2.49.1
+        version: 2.50.0(@sveltejs/vite-plugin-svelte@6.2.4(svelte@5.46.4)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2)))(svelte@5.46.4)(typescript@5.9.3)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2))
+      '@sveltejs/package':
+        specifier: ^2.5.7
+        version: 2.5.7(svelte@5.46.4)(typescript@5.9.3)
+      '@sveltejs/vite-plugin-svelte':
+        specifier: ^6.2.1
+        version: 6.2.4(svelte@5.46.4)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2))
+      '@tailwindcss/typography':
+        specifier: ^0.5.19
+        version: 0.5.19(tailwindcss@4.1.18)
+      '@tailwindcss/vite':
+        specifier: ^4.1.17
+        version: 4.1.18(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2))
+      prettier:
+        specifier: ^3.7.4
+        version: 3.8.0
+      prettier-plugin-svelte:
+        specifier: ^3.4.0
+        version: 3.4.1(prettier@3.8.0)(svelte@5.46.4)
+      prettier-plugin-tailwindcss:
+        specifier: ^0.7.2
+        version: 0.7.2(prettier-plugin-svelte@3.4.1(prettier@3.8.0)(svelte@5.46.4))(prettier@3.8.0)
+      publint:
+        specifier: ^0.3.15
+        version: 0.3.16
+      svelte:
+        specifier: ^5.45.6
+        version: 5.46.4
+      svelte-check:
+        specifier: ^4.3.4
+        version: 4.3.5(picomatch@4.0.3)(svelte@5.46.4)(typescript@5.9.3)
+      tailwindcss:
+        specifier: ^4.1.17
+        version: 4.1.18
+      typescript:
+        specifier: ^5.9.3
+        version: 5.9.3
+      vite:
+        specifier: ^7.2.6
+        version: 7.3.1(jiti@2.6.1)(lightningcss@1.30.2)
+
+packages:
+
+  '@atproto/api@0.18.16':
+    resolution: {integrity: sha512-tRGKSWr83pP5CQpSboePU21pE+GqLDYy1XHae4HH4hjaT0pr5V8wNgu70kbKB0B02GVUumeDRpJnlHKD+eMzLg==}
+
+  '@atproto/common-web@0.4.12':
+    resolution: {integrity: sha512-3aCJemqM/fkHQrVPbTCHCdiVstKFI+2LkFLvUhO6XZP0EqUZa/rg/CIZBKTFUWu9I5iYiaEiXL9VwcDRpEevSw==}
+
+  '@atproto/lex-data@0.0.8':
+    resolution: {integrity: sha512-1Y5tz7BkS7380QuLNXaE8GW8Xba+mRWugt8BKM4BUFYjjUZdmirU8lr72iM4XlEBrzRu8Cfvj+MbsbYaZv+IgA==}
+
+  '@atproto/lex-json@0.0.8':
+    resolution: {integrity: sha512-w1Qmkae1QhmNz+i1Zm3xr3jp0UPPRENmdlpU0qIrdxWDo9W4Mzkeyc3eSoa+Zs+zN8xkRSQw7RLZte/B7Ipdwg==}
+
+  '@atproto/lexicon@0.6.0':
+    resolution: {integrity: sha512-5veb8aD+J5M0qszLJ+73KSFsFrJBgAY/nM1TSAJvGY7fNc9ZAT+PSUlmIyrdye9YznAZ07yktalls/TwNV7cHQ==}
+
+  '@atproto/syntax@0.4.2':
+    resolution: {integrity: sha512-X9XSRPinBy/0VQ677j8VXlBsYSsUXaiqxWVpGGxJYsAhugdQRb0jqaVKJFtm6RskeNkV6y9xclSUi9UYG/COrA==}
+
+  '@atproto/xrpc@0.7.7':
+    resolution: {integrity: sha512-K1ZyO/BU8JNtXX5dmPp7b5UrkLMMqpsIa/Lrj5D3Su+j1Xwq1m6QJ2XJ1AgjEjkI1v4Muzm7klianLE6XGxtmA==}
+
+  '@esbuild/aix-ppc64@0.27.2':
+    resolution: {integrity: sha512-GZMB+a0mOMZs4MpDbj8RJp4cw+w1WV5NYD6xzgvzUJ5Ek2jerwfO2eADyI6ExDSUED+1X8aMbegahsJi+8mgpw==}
+    engines: {node: '>=18'}
+    cpu: [ppc64]
+    os: [aix]
+
+  '@esbuild/android-arm64@0.27.2':
+    resolution: {integrity: sha512-pvz8ZZ7ot/RBphf8fv60ljmaoydPU12VuXHImtAs0XhLLw+EXBi2BLe3OYSBslR4rryHvweW5gmkKFwTiFy6KA==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [android]
+
+  '@esbuild/android-arm@0.27.2':
+    resolution: {integrity: sha512-DVNI8jlPa7Ujbr1yjU2PfUSRtAUZPG9I1RwW4F4xFB1Imiu2on0ADiI/c3td+KmDtVKNbi+nffGDQMfcIMkwIA==}
+    engines: {node: '>=18'}
+    cpu: [arm]
+    os: [android]
+
+  '@esbuild/android-x64@0.27.2':
+    resolution: {integrity: sha512-z8Ank4Byh4TJJOh4wpz8g2vDy75zFL0TlZlkUkEwYXuPSgX8yzep596n6mT7905kA9uHZsf/o2OJZubl2l3M7A==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [android]
+
+  '@esbuild/darwin-arm64@0.27.2':
+    resolution: {integrity: sha512-davCD2Zc80nzDVRwXTcQP/28fiJbcOwvdolL0sOiOsbwBa72kegmVU0Wrh1MYrbuCL98Omp5dVhQFWRKR2ZAlg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@esbuild/darwin-x64@0.27.2':
+    resolution: {integrity: sha512-ZxtijOmlQCBWGwbVmwOF/UCzuGIbUkqB1faQRf5akQmxRJ1ujusWsb3CVfk/9iZKr2L5SMU5wPBi1UWbvL+VQA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@esbuild/freebsd-arm64@0.27.2':
+    resolution: {integrity: sha512-lS/9CN+rgqQ9czogxlMcBMGd+l8Q3Nj1MFQwBZJyoEKI50XGxwuzznYdwcav6lpOGv5BqaZXqvBSiB/kJ5op+g==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [freebsd]
+
+  '@esbuild/freebsd-x64@0.27.2':
+    resolution: {integrity: sha512-tAfqtNYb4YgPnJlEFu4c212HYjQWSO/w/h/lQaBK7RbwGIkBOuNKQI9tqWzx7Wtp7bTPaGC6MJvWI608P3wXYA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@esbuild/linux-arm64@0.27.2':
+    resolution: {integrity: sha512-hYxN8pr66NsCCiRFkHUAsxylNOcAQaxSSkHMMjcpx0si13t1LHFphxJZUiGwojB1a/Hd5OiPIqDdXONia6bhTw==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@esbuild/linux-arm@0.27.2':
+    resolution: {integrity: sha512-vWfq4GaIMP9AIe4yj1ZUW18RDhx6EPQKjwe7n8BbIecFtCQG4CfHGaHuh7fdfq+y3LIA2vGS/o9ZBGVxIDi9hw==}
+    engines: {node: '>=18'}
+    cpu: [arm]
+    os: [linux]
+
+  '@esbuild/linux-ia32@0.27.2':
+    resolution: {integrity: sha512-MJt5BRRSScPDwG2hLelYhAAKh9imjHK5+NE/tvnRLbIqUWa+0E9N4WNMjmp/kXXPHZGqPLxggwVhz7QP8CTR8w==}
+    engines: {node: '>=18'}
+    cpu: [ia32]
+    os: [linux]
+
+  '@esbuild/linux-loong64@0.27.2':
+    resolution: {integrity: sha512-lugyF1atnAT463aO6KPshVCJK5NgRnU4yb3FUumyVz+cGvZbontBgzeGFO1nF+dPueHD367a2ZXe1NtUkAjOtg==}
+    engines: {node: '>=18'}
+    cpu: [loong64]
+    os: [linux]
+
+  '@esbuild/linux-mips64el@0.27.2':
+    resolution: {integrity: sha512-nlP2I6ArEBewvJ2gjrrkESEZkB5mIoaTswuqNFRv/WYd+ATtUpe9Y09RnJvgvdag7he0OWgEZWhviS1OTOKixw==}
+    engines: {node: '>=18'}
+    cpu: [mips64el]
+    os: [linux]
+
+  '@esbuild/linux-ppc64@0.27.2':
+    resolution: {integrity: sha512-C92gnpey7tUQONqg1n6dKVbx3vphKtTHJaNG2Ok9lGwbZil6DrfyecMsp9CrmXGQJmZ7iiVXvvZH6Ml5hL6XdQ==}
+    engines: {node: '>=18'}
+    cpu: [ppc64]
+    os: [linux]
+
+  '@esbuild/linux-riscv64@0.27.2':
+    resolution: {integrity: sha512-B5BOmojNtUyN8AXlK0QJyvjEZkWwy/FKvakkTDCziX95AowLZKR6aCDhG7LeF7uMCXEJqwa8Bejz5LTPYm8AvA==}
+    engines: {node: '>=18'}
+    cpu: [riscv64]
+    os: [linux]
+
+  '@esbuild/linux-s390x@0.27.2':
+    resolution: {integrity: sha512-p4bm9+wsPwup5Z8f4EpfN63qNagQ47Ua2znaqGH6bqLlmJ4bx97Y9JdqxgGZ6Y8xVTixUnEkoKSHcpRlDnNr5w==}
+    engines: {node: '>=18'}
+    cpu: [s390x]
+    os: [linux]
+
+  '@esbuild/linux-x64@0.27.2':
+    resolution: {integrity: sha512-uwp2Tip5aPmH+NRUwTcfLb+W32WXjpFejTIOWZFw/v7/KnpCDKG66u4DLcurQpiYTiYwQ9B7KOeMJvLCu/OvbA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [linux]
+
+  '@esbuild/netbsd-arm64@0.27.2':
+    resolution: {integrity: sha512-Kj6DiBlwXrPsCRDeRvGAUb/LNrBASrfqAIok+xB0LxK8CHqxZ037viF13ugfsIpePH93mX7xfJp97cyDuTZ3cw==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [netbsd]
+
+  '@esbuild/netbsd-x64@0.27.2':
+    resolution: {integrity: sha512-HwGDZ0VLVBY3Y+Nw0JexZy9o/nUAWq9MlV7cahpaXKW6TOzfVno3y3/M8Ga8u8Yr7GldLOov27xiCnqRZf0tCA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [netbsd]
+
+  '@esbuild/openbsd-arm64@0.27.2':
+    resolution: {integrity: sha512-DNIHH2BPQ5551A7oSHD0CKbwIA/Ox7+78/AWkbS5QoRzaqlev2uFayfSxq68EkonB+IKjiuxBFoV8ESJy8bOHA==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [openbsd]
+
+  '@esbuild/openbsd-x64@0.27.2':
+    resolution: {integrity: sha512-/it7w9Nb7+0KFIzjalNJVR5bOzA9Vay+yIPLVHfIQYG/j+j9VTH84aNB8ExGKPU4AzfaEvN9/V4HV+F+vo8OEg==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [openbsd]
+
+  '@esbuild/openharmony-arm64@0.27.2':
+    resolution: {integrity: sha512-LRBbCmiU51IXfeXk59csuX/aSaToeG7w48nMwA6049Y4J4+VbWALAuXcs+qcD04rHDuSCSRKdmY63sruDS5qag==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@esbuild/sunos-x64@0.27.2':
+    resolution: {integrity: sha512-kMtx1yqJHTmqaqHPAzKCAkDaKsffmXkPHThSfRwZGyuqyIeBvf08KSsYXl+abf5HDAPMJIPnbBfXvP2ZC2TfHg==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [sunos]
+
+  '@esbuild/win32-arm64@0.27.2':
+    resolution: {integrity: sha512-Yaf78O/B3Kkh+nKABUF++bvJv5Ijoy9AN1ww904rOXZFLWVc5OLOfL56W+C8F9xn5JQZa3UX6m+IktJnIb1Jjg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@esbuild/win32-ia32@0.27.2':
+    resolution: {integrity: sha512-Iuws0kxo4yusk7sw70Xa2E2imZU5HoixzxfGCdxwBdhiDgt9vX9VUCBhqcwY7/uh//78A1hMkkROMJq9l27oLQ==}
+    engines: {node: '>=18'}
+    cpu: [ia32]
+    os: [win32]
+
+  '@esbuild/win32-x64@0.27.2':
+    resolution: {integrity: sha512-sRdU18mcKf7F+YgheI/zGf5alZatMUTKj/jNS6l744f9u3WFu4v7twcUI9vu4mknF4Y9aDlblIie0IM+5xxaqQ==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [win32]
+
+  '@jridgewell/gen-mapping@0.3.13':
+    resolution: {integrity: sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==}
+
+  '@jridgewell/remapping@2.3.5':
+    resolution: {integrity: sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==}
+
+  '@jridgewell/resolve-uri@3.1.2':
+    resolution: {integrity: sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==}
+    engines: {node: '>=6.0.0'}
+
+  '@jridgewell/sourcemap-codec@1.5.5':
+    resolution: {integrity: sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==}
+
+  '@jridgewell/trace-mapping@0.3.31':
+    resolution: {integrity: sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==}
+
+  '@lucide/svelte@0.562.0':
+    resolution: {integrity: sha512-wDMULwtTFN2Sc/TFBm6gfuVCNb4Y5P9LDrwxNnUbV52+IEU7NXZmvxwXoz+vrrpad6Xupq+Hw5eUlqIHEGhouw==}
+    peerDependencies:
+      svelte: ^5
+
+  '@polka/url@1.0.0-next.29':
+    resolution: {integrity: sha512-wwQAWhWSuHaag8c4q/KN/vCoeOJYshAIvMQwD4GpSb3OiZklFfvAgmj0VCBBImRpuF/aFgIRzllXlVX93Jevww==}
+
+  '@publint/pack@0.1.2':
+    resolution: {integrity: sha512-S+9ANAvUmjutrshV4jZjaiG8XQyuJIZ8a4utWmN/vW1sgQ9IfBnPndwkmQYw53QmouOIytT874u65HEmu6H5jw==}
+    engines: {node: '>=18'}
+
+  '@rollup/rollup-android-arm-eabi@4.55.1':
+    resolution: {integrity: sha512-9R0DM/ykwfGIlNu6+2U09ga0WXeZ9MRC2Ter8jnz8415VbuIykVuc6bhdrbORFZANDmTDvq26mJrEVTl8TdnDg==}
+    cpu: [arm]
+    os: [android]
+
+  '@rollup/rollup-android-arm64@4.55.1':
+    resolution: {integrity: sha512-eFZCb1YUqhTysgW3sj/55du5cG57S7UTNtdMjCW7LwVcj3dTTcowCsC8p7uBdzKsZYa8J7IDE8lhMI+HX1vQvg==}
+    cpu: [arm64]
+    os: [android]
+
+  '@rollup/rollup-darwin-arm64@4.55.1':
+    resolution: {integrity: sha512-p3grE2PHcQm2e8PSGZdzIhCKbMCw/xi9XvMPErPhwO17vxtvCN5FEA2mSLgmKlCjHGMQTP6phuQTYWUnKewwGg==}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@rollup/rollup-darwin-x64@4.55.1':
+    resolution: {integrity: sha512-rDUjG25C9qoTm+e02Esi+aqTKSBYwVTaoS1wxcN47/Luqef57Vgp96xNANwt5npq9GDxsH7kXxNkJVEsWEOEaQ==}
+    cpu: [x64]
+    os: [darwin]
+
+  '@rollup/rollup-freebsd-arm64@4.55.1':
+    resolution: {integrity: sha512-+JiU7Jbp5cdxekIgdte0jfcu5oqw4GCKr6i3PJTlXTCU5H5Fvtkpbs4XJHRmWNXF+hKmn4v7ogI5OQPaupJgOg==}
+    cpu: [arm64]
+    os: [freebsd]
+
+  '@rollup/rollup-freebsd-x64@4.55.1':
+    resolution: {integrity: sha512-V5xC1tOVWtLLmr3YUk2f6EJK4qksksOYiz/TCsFHu/R+woubcLWdC9nZQmwjOAbmExBIVKsm1/wKmEy4z4u4Bw==}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@rollup/rollup-linux-arm-gnueabihf@4.55.1':
+    resolution: {integrity: sha512-Rn3n+FUk2J5VWx+ywrG/HGPTD9jXNbicRtTM11e/uorplArnXZYsVifnPPqNNP5BsO3roI4n8332ukpY/zN7rQ==}
+    cpu: [arm]
+    os: [linux]
+
+  '@rollup/rollup-linux-arm-musleabihf@4.55.1':
+    resolution: {integrity: sha512-grPNWydeKtc1aEdrJDWk4opD7nFtQbMmV7769hiAaYyUKCT1faPRm2av8CX1YJsZ4TLAZcg9gTR1KvEzoLjXkg==}
+    cpu: [arm]
+    os: [linux]
+
+  '@rollup/rollup-linux-arm64-gnu@4.55.1':
+    resolution: {integrity: sha512-a59mwd1k6x8tXKcUxSyISiquLwB5pX+fJW9TkWU46lCqD/GRDe9uDN31jrMmVP3feI3mhAdvcCClhV8V5MhJFQ==}
+    cpu: [arm64]
+    os: [linux]
+
+  '@rollup/rollup-linux-arm64-musl@4.55.1':
+    resolution: {integrity: sha512-puS1MEgWX5GsHSoiAsF0TYrpomdvkaXm0CofIMG5uVkP6IBV+ZO9xhC5YEN49nsgYo1DuuMquF9+7EDBVYu4uA==}
+    cpu: [arm64]
+    os: [linux]
+
+  '@rollup/rollup-linux-loong64-gnu@4.55.1':
+    resolution: {integrity: sha512-r3Wv40in+lTsULSb6nnoudVbARdOwb2u5fpeoOAZjFLznp6tDU8kd+GTHmJoqZ9lt6/Sys33KdIHUaQihFcu7g==}
+    cpu: [loong64]
+    os: [linux]
+
+  '@rollup/rollup-linux-loong64-musl@4.55.1':
+    resolution: {integrity: sha512-MR8c0+UxAlB22Fq4R+aQSPBayvYa3+9DrwG/i1TKQXFYEaoW3B5b/rkSRIypcZDdWjWnpcvxbNaAJDcSbJU3Lw==}
+    cpu: [loong64]
+    os: [linux]
+
+  '@rollup/rollup-linux-ppc64-gnu@4.55.1':
+    resolution: {integrity: sha512-3KhoECe1BRlSYpMTeVrD4sh2Pw2xgt4jzNSZIIPLFEsnQn9gAnZagW9+VqDqAHgm1Xc77LzJOo2LdigS5qZ+gw==}
+    cpu: [ppc64]
+    os: [linux]
+
+  '@rollup/rollup-linux-ppc64-musl@4.55.1':
+    resolution: {integrity: sha512-ziR1OuZx0vdYZZ30vueNZTg73alF59DicYrPViG0NEgDVN8/Jl87zkAPu4u6VjZST2llgEUjaiNl9JM6HH1Vdw==}
+    cpu: [ppc64]
+    os: [linux]
+
+  '@rollup/rollup-linux-riscv64-gnu@4.55.1':
+    resolution: {integrity: sha512-uW0Y12ih2XJRERZ4jAfKamTyIHVMPQnTZcQjme2HMVDAHY4amf5u414OqNYC+x+LzRdRcnIG1YodLrrtA8xsxw==}
+    cpu: [riscv64]
+    os: [linux]
+
+  '@rollup/rollup-linux-riscv64-musl@4.55.1':
+    resolution: {integrity: sha512-u9yZ0jUkOED1BFrqu3BwMQoixvGHGZ+JhJNkNKY/hyoEgOwlqKb62qu+7UjbPSHYjiVy8kKJHvXKv5coH4wDeg==}
+    cpu: [riscv64]
+    os: [linux]
+
+  '@rollup/rollup-linux-s390x-gnu@4.55.1':
+    resolution: {integrity: sha512-/0PenBCmqM4ZUd0190j7J0UsQ/1nsi735iPRakO8iPciE7BQ495Y6msPzaOmvx0/pn+eJVVlZrNrSh4WSYLxNg==}
+    cpu: [s390x]
+    os: [linux]
+
+  '@rollup/rollup-linux-x64-gnu@4.55.1':
+    resolution: {integrity: sha512-a8G4wiQxQG2BAvo+gU6XrReRRqj+pLS2NGXKm8io19goR+K8lw269eTrPkSdDTALwMmJp4th2Uh0D8J9bEV1vg==}
+    cpu: [x64]
+    os: [linux]
+
+  '@rollup/rollup-linux-x64-musl@4.55.1':
+    resolution: {integrity: sha512-bD+zjpFrMpP/hqkfEcnjXWHMw5BIghGisOKPj+2NaNDuVT+8Ds4mPf3XcPHuat1tz89WRL+1wbcxKY3WSbiT7w==}
+    cpu: [x64]
+    os: [linux]
+
+  '@rollup/rollup-openbsd-x64@4.55.1':
+    resolution: {integrity: sha512-eLXw0dOiqE4QmvikfQ6yjgkg/xDM+MdU9YJuP4ySTibXU0oAvnEWXt7UDJmD4UkYialMfOGFPJnIHSe/kdzPxg==}
+    cpu: [x64]
+    os: [openbsd]
+
+  '@rollup/rollup-openharmony-arm64@4.55.1':
+    resolution: {integrity: sha512-xzm44KgEP11te3S2HCSyYf5zIzWmx3n8HDCc7EE59+lTcswEWNpvMLfd9uJvVX8LCg9QWG67Xt75AuHn4vgsXw==}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@rollup/rollup-win32-arm64-msvc@4.55.1':
+    resolution: {integrity: sha512-yR6Bl3tMC/gBok5cz/Qi0xYnVbIxGx5Fcf/ca0eB6/6JwOY+SRUcJfI0OpeTpPls7f194as62thCt/2BjxYN8g==}
+    cpu: [arm64]
+    os: [win32]
+
+  '@rollup/rollup-win32-ia32-msvc@4.55.1':
+    resolution: {integrity: sha512-3fZBidchE0eY0oFZBnekYCfg+5wAB0mbpCBuofh5mZuzIU/4jIVkbESmd2dOsFNS78b53CYv3OAtwqkZZmU5nA==}
+    cpu: [ia32]
+    os: [win32]
+
+  '@rollup/rollup-win32-x64-gnu@4.55.1':
+    resolution: {integrity: sha512-xGGY5pXj69IxKb4yv/POoocPy/qmEGhimy/FoTpTSVju3FYXUQQMFCaZZXJVidsmGxRioZAwpThl/4zX41gRKg==}
+    cpu: [x64]
+    os: [win32]
+
+  '@rollup/rollup-win32-x64-msvc@4.55.1':
+    resolution: {integrity: sha512-SPEpaL6DX4rmcXtnhdrQYgzQ5W2uW3SCJch88lB2zImhJRhIIK44fkUrgIV/Q8yUNfw5oyZ5vkeQsZLhCb06lw==}
+    cpu: [x64]
+    os: [win32]
+
+  '@shikijs/core@3.21.0':
+    resolution: {integrity: sha512-AXSQu/2n1UIQekY8euBJlvFYZIw0PHY63jUzGbrOma4wPxzznJXTXkri+QcHeBNaFxiiOljKxxJkVSoB3PjbyA==}
+
+  '@shikijs/engine-javascript@3.21.0':
+    resolution: {integrity: sha512-ATwv86xlbmfD9n9gKRiwuPpWgPENAWCLwYCGz9ugTJlsO2kOzhOkvoyV/UD+tJ0uT7YRyD530x6ugNSffmvIiQ==}
+
+  '@shikijs/engine-oniguruma@3.21.0':
+    resolution: {integrity: sha512-OYknTCct6qiwpQDqDdf3iedRdzj6hFlOPv5hMvI+hkWfCKs5mlJ4TXziBG9nyabLwGulrUjHiCq3xCspSzErYQ==}
+
+  '@shikijs/langs@3.21.0':
+    resolution: {integrity: sha512-g6mn5m+Y6GBJ4wxmBYqalK9Sp0CFkUqfNzUy2pJglUginz6ZpWbaWjDB4fbQ/8SHzFjYbtU6Ddlp1pc+PPNDVA==}
+
+  '@shikijs/themes@3.21.0':
+    resolution: {integrity: sha512-BAE4cr9EDiZyYzwIHEk7JTBJ9CzlPuM4PchfcA5ao1dWXb25nv6hYsoDiBq2aZK9E3dlt3WB78uI96UESD+8Mw==}
+
+  '@shikijs/types@3.21.0':
+    resolution: {integrity: sha512-zGrWOxZ0/+0ovPY7PvBU2gIS9tmhSUUt30jAcNV0Bq0gb2S98gwfjIs1vxlmH5zM7/4YxLamT6ChlqqAJmPPjA==}
+
+  '@shikijs/vscode-textmate@10.0.2':
+    resolution: {integrity: sha512-83yeghZ2xxin3Nj8z1NMd/NCuca+gsYXswywDy5bHvwlWL8tpTQmzGeUuHd9FC3E/SBEMvzJRwWEOz5gGes9Qg==}
+
+  '@standard-schema/spec@1.1.0':
+    resolution: {integrity: sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==}
+
+  '@sveltejs/acorn-typescript@1.0.8':
+    resolution: {integrity: sha512-esgN+54+q0NjB0Y/4BomT9samII7jGwNy/2a3wNZbT2A2RpmXsXwUt24LvLhx6jUq2gVk4cWEvcRO6MFQbOfNA==}
+    peerDependencies:
+      acorn: ^8.9.0
+
+  '@sveltejs/adapter-auto@7.0.0':
+    resolution: {integrity: sha512-ImDWaErTOCkRS4Gt+5gZuymKFBobnhChXUZ9lhUZLahUgvA4OOvRzi3sahzYgbxGj5nkA6OV0GAW378+dl/gyw==}
+    peerDependencies:
+      '@sveltejs/kit': ^2.0.0
+
+  '@sveltejs/kit@2.50.0':
+    resolution: {integrity: sha512-Hj8sR8O27p2zshFEIJzsvfhLzxga/hWw6tRLnBjMYw70m1aS9BSYCqAUtzDBjRREtX1EvLMYgaC0mYE3Hz4KWA==}
+    engines: {node: '>=18.13'}
+    hasBin: true
+    peerDependencies:
+      '@opentelemetry/api': ^1.0.0
+      '@sveltejs/vite-plugin-svelte': ^3.0.0 || ^4.0.0-next.1 || ^5.0.0 || ^6.0.0-next.0
+      svelte: ^4.0.0 || ^5.0.0-next.0
+      typescript: ^5.3.3
+      vite: ^5.0.3 || ^6.0.0 || ^7.0.0-beta.0
+    peerDependenciesMeta:
+      '@opentelemetry/api':
+        optional: true
+      typescript:
+        optional: true
+
+  '@sveltejs/package@2.5.7':
+    resolution: {integrity: sha512-qqD9xa9H7TDiGFrF6rz7AirOR8k15qDK/9i4MIE8te4vWsv5GEogPks61rrZcLy+yWph+aI6pIj2MdoK3YI8AQ==}
+    engines: {node: ^16.14 || >=18}
+    hasBin: true
+    peerDependencies:
+      svelte: ^3.44.0 || ^4.0.0 || ^5.0.0-next.1
+
+  '@sveltejs/vite-plugin-svelte-inspector@5.0.2':
+    resolution: {integrity: sha512-TZzRTcEtZffICSAoZGkPSl6Etsj2torOVrx6Uw0KpXxrec9Gg6jFWQ60Q3+LmNGfZSxHRCZL7vXVZIWmuV50Ig==}
+    engines: {node: ^20.19 || ^22.12 || >=24}
+    peerDependencies:
+      '@sveltejs/vite-plugin-svelte': ^6.0.0-next.0
+      svelte: ^5.0.0
+      vite: ^6.3.0 || ^7.0.0
+
+  '@sveltejs/vite-plugin-svelte@6.2.4':
+    resolution: {integrity: sha512-ou/d51QSdTyN26D7h6dSpusAKaZkAiGM55/AKYi+9AGZw7q85hElbjK3kEyzXHhLSnRISHOYzVge6x0jRZ7DXA==}
+    engines: {node: ^20.19 || ^22.12 || >=24}
+    peerDependencies:
+      svelte: ^5.0.0
+      vite: ^6.3.0 || ^7.0.0
+
+  '@tailwindcss/node@4.1.18':
+    resolution: {integrity: sha512-DoR7U1P7iYhw16qJ49fgXUlry1t4CpXeErJHnQ44JgTSKMaZUdf17cfn5mHchfJ4KRBZRFA/Coo+MUF5+gOaCQ==}
+
+  '@tailwindcss/oxide-android-arm64@4.1.18':
+    resolution: {integrity: sha512-dJHz7+Ugr9U/diKJA0W6N/6/cjI+ZTAoxPf9Iz9BFRF2GzEX8IvXxFIi/dZBloVJX/MZGvRuFA9rqwdiIEZQ0Q==}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [android]
+
+  '@tailwindcss/oxide-darwin-arm64@4.1.18':
+    resolution: {integrity: sha512-Gc2q4Qhs660bhjyBSKgq6BYvwDz4G+BuyJ5H1xfhmDR3D8HnHCmT/BSkvSL0vQLy/nkMLY20PQ2OoYMO15Jd0A==}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@tailwindcss/oxide-darwin-x64@4.1.18':
+    resolution: {integrity: sha512-FL5oxr2xQsFrc3X9o1fjHKBYBMD1QZNyc1Xzw/h5Qu4XnEBi3dZn96HcHm41c/euGV+GRiXFfh2hUCyKi/e+yw==}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@tailwindcss/oxide-freebsd-x64@4.1.18':
+    resolution: {integrity: sha512-Fj+RHgu5bDodmV1dM9yAxlfJwkkWvLiRjbhuO2LEtwtlYlBgiAT4x/j5wQr1tC3SANAgD+0YcmWVrj8R9trVMA==}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@tailwindcss/oxide-linux-arm-gnueabihf@4.1.18':
+    resolution: {integrity: sha512-Fp+Wzk/Ws4dZn+LV2Nqx3IilnhH51YZoRaYHQsVq3RQvEl+71VGKFpkfHrLM/Li+kt5c0DJe/bHXK1eHgDmdiA==}
+    engines: {node: '>= 10'}
+    cpu: [arm]
+    os: [linux]
+
+  '@tailwindcss/oxide-linux-arm64-gnu@4.1.18':
+    resolution: {integrity: sha512-S0n3jboLysNbh55Vrt7pk9wgpyTTPD0fdQeh7wQfMqLPM/Hrxi+dVsLsPrycQjGKEQk85Kgbx+6+QnYNiHalnw==}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@tailwindcss/oxide-linux-arm64-musl@4.1.18':
+    resolution: {integrity: sha512-1px92582HkPQlaaCkdRcio71p8bc8i/ap5807tPRDK/uw953cauQBT8c5tVGkOwrHMfc2Yh6UuxaH4vtTjGvHg==}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@tailwindcss/oxide-linux-x64-gnu@4.1.18':
+    resolution: {integrity: sha512-v3gyT0ivkfBLoZGF9LyHmts0Isc8jHZyVcbzio6Wpzifg/+5ZJpDiRiUhDLkcr7f/r38SWNe7ucxmGW3j3Kb/g==}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [linux]
+
+  '@tailwindcss/oxide-linux-x64-musl@4.1.18':
+    resolution: {integrity: sha512-bhJ2y2OQNlcRwwgOAGMY0xTFStt4/wyU6pvI6LSuZpRgKQwxTec0/3Scu91O8ir7qCR3AuepQKLU/kX99FouqQ==}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [linux]
+
+  '@tailwindcss/oxide-wasm32-wasi@4.1.18':
+    resolution: {integrity: sha512-LffYTvPjODiP6PT16oNeUQJzNVyJl1cjIebq/rWWBF+3eDst5JGEFSc5cWxyRCJ0Mxl+KyIkqRxk1XPEs9x8TA==}
+    engines: {node: '>=14.0.0'}
+    cpu: [wasm32]
+    bundledDependencies:
+      - '@napi-rs/wasm-runtime'
+      - '@emnapi/core'
+      - '@emnapi/runtime'
+      - '@tybys/wasm-util'
+      - '@emnapi/wasi-threads'
+      - tslib
+
+  '@tailwindcss/oxide-win32-arm64-msvc@4.1.18':
+    resolution: {integrity: sha512-HjSA7mr9HmC8fu6bdsZvZ+dhjyGCLdotjVOgLA2vEqxEBZaQo9YTX4kwgEvPCpRh8o4uWc4J/wEoFzhEmjvPbA==}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@tailwindcss/oxide-win32-x64-msvc@4.1.18':
+    resolution: {integrity: sha512-bJWbyYpUlqamC8dpR7pfjA0I7vdF6t5VpUGMWRkXVE3AXgIZjYUYAK7II1GNaxR8J1SSrSrppRar8G++JekE3Q==}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [win32]
+
+  '@tailwindcss/oxide@4.1.18':
+    resolution: {integrity: sha512-EgCR5tTS5bUSKQgzeMClT6iCY3ToqE1y+ZB0AKldj809QXk1Y+3jB0upOYZrn9aGIzPtUsP7sX4QQ4XtjBB95A==}
+    engines: {node: '>= 10'}
+
+  '@tailwindcss/typography@0.5.19':
+    resolution: {integrity: sha512-w31dd8HOx3k9vPtcQh5QHP9GwKcgbMp87j58qi6xgiBnFFtKEAgCWnDw4qUT8aHwkCp8bKvb/KGKWWHedP0AAg==}
+    peerDependencies:
+      tailwindcss: '>=3.0.0 || insiders || >=4.0.0-alpha.20 || >=4.0.0-beta.1'
+
+  '@tailwindcss/vite@4.1.18':
+    resolution: {integrity: sha512-jVA+/UpKL1vRLg6Hkao5jldawNmRo7mQYrZtNHMIVpLfLhDml5nMRUo/8MwoX2vNXvnaXNNMedrMfMugAVX1nA==}
+    peerDependencies:
+      vite: ^5.2.0 || ^6 || ^7
+
+  '@types/cookie@0.6.0':
+    resolution: {integrity: sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA==}
+
+  '@types/estree@1.0.8':
+    resolution: {integrity: sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==}
+
+  '@types/hast@3.0.4':
+    resolution: {integrity: sha512-WPs+bbQw5aCj+x6laNGWLH3wviHtoCv/P3+otBhbOhJgG8qtpdAMlTCxLtsTWA7LH1Oh/bFCHsBn0TPS5m30EQ==}
+
+  '@types/mdast@4.0.4':
+    resolution: {integrity: sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA==}
+
+  '@types/unist@3.0.3':
+    resolution: {integrity: sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==}
+
+  '@ungap/structured-clone@1.3.0':
+    resolution: {integrity: sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==}
+
+  acorn@8.15.0:
+    resolution: {integrity: sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==}
+    engines: {node: '>=0.4.0'}
+    hasBin: true
+
+  aria-query@5.3.2:
+    resolution: {integrity: sha512-COROpnaoap1E2F000S62r6A60uHZnmlvomhfyT2DlTcrY1OrBKn2UhH7qn5wTC9zMvD0AY7csdPSNwKP+7WiQw==}
+    engines: {node: '>= 0.4'}
+
+  await-lock@2.2.2:
+    resolution: {integrity: sha512-aDczADvlvTGajTDjcjpJMqRkOF6Qdz3YbPZm/PyW6tKPkx2hlYBzxMhEywM/tU72HrVZjgl5VCdRuMlA7pZ8Gw==}
+
+  axobject-query@4.1.0:
+    resolution: {integrity: sha512-qIj0G9wZbMGNLjLmg1PT6v2mE9AH2zlnADJD/2tC6E00hgmhUOfEB6greHPAfLRSufHqROIUTkw6E+M3lH0PTQ==}
+    engines: {node: '>= 0.4'}
+
+  ccount@2.0.1:
+    resolution: {integrity: sha512-eyrF0jiFpY+3drT6383f1qhkbGsLSifNAjA61IUjZjmLCWjItY6LB9ft9YhoDgwfmclB2zhu51Lc7+95b8NRAg==}
+
+  character-entities-html4@2.1.0:
+    resolution: {integrity: sha512-1v7fgQRj6hnSwFpq1Eu0ynr/CDEw0rXo2B61qXrLNdHZmPKgb7fqS1a2JwF0rISo9q77jDI8VMEHoApn8qDoZA==}
+
+  character-entities-legacy@3.0.0:
+    resolution: {integrity: sha512-RpPp0asT/6ufRm//AJVwpViZbGM/MkjQFxJccQRHmISF/22NBtsHqAWmL+/pmkPWoIUJdWyeVleTl1wydHATVQ==}
+
+  chokidar@4.0.3:
+    resolution: {integrity: sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==}
+    engines: {node: '>= 14.16.0'}
+
+  chokidar@5.0.0:
+    resolution: {integrity: sha512-TQMmc3w+5AxjpL8iIiwebF73dRDF4fBIieAqGn9RGCWaEVwQ6Fb2cGe31Yns0RRIzii5goJ1Y7xbMwo1TxMplw==}
+    engines: {node: '>= 20.19.0'}
+
+  clsx@2.1.1:
+    resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==}
+    engines: {node: '>=6'}
+
+  comma-separated-tokens@2.0.3:
+    resolution: {integrity: sha512-Fu4hJdvzeylCfQPp9SGWidpzrMs7tTrlu6Vb8XGaRGck8QSNZJJp538Wrb60Lax4fPwR64ViY468OIUTbRlGZg==}
+
+  commander@8.3.0:
+    resolution: {integrity: sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==}
+    engines: {node: '>= 12'}
+
+  cookie@0.6.0:
+    resolution: {integrity: sha512-U71cyTamuh1CRNCfpGY6to28lxvNwPG4Guz/EVjgf3Jmzv0vlDp1atT9eS5dDjMYHucpHbWns6Lwf3BKz6svdw==}
+    engines: {node: '>= 0.6'}
+
+  cssesc@3.0.0:
+    resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==}
+    engines: {node: '>=4'}
+    hasBin: true
+
+  dedent-js@1.0.1:
+    resolution: {integrity: sha512-OUepMozQULMLUmhxS95Vudo0jb0UchLimi3+pQ2plj61Fcy8axbP9hbiD4Sz6DPqn6XG3kfmziVfQ1rSys5AJQ==}
+
+  deepmerge@4.3.1:
+    resolution: {integrity: sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==}
+    engines: {node: '>=0.10.0'}
+
+  dequal@2.0.3:
+    resolution: {integrity: sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==}
+    engines: {node: '>=6'}
+
+  detect-libc@2.1.2:
+    resolution: {integrity: sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==}
+    engines: {node: '>=8'}
+
+  devalue@5.6.2:
+    resolution: {integrity: sha512-nPRkjWzzDQlsejL1WVifk5rvcFi/y1onBRxjaFMjZeR9mFpqu2gmAZ9xUB9/IEanEP/vBtGeGganC/GO1fmufg==}
+
+  devlop@1.1.0:
+    resolution: {integrity: sha512-RWmIqhcFf1lRYBvNmr7qTNuyCt/7/ns2jbpp1+PalgE/rDQcBT0fioSMUpJ93irlUhC5hrg4cYqe6U+0ImW0rA==}
+
+  enhanced-resolve@5.18.4:
+    resolution: {integrity: sha512-LgQMM4WXU3QI+SYgEc2liRgznaD5ojbmY3sb8LxyguVkIg5FxdpTkvk72te2R38/TGKxH634oLxXRGY6d7AP+Q==}
+    engines: {node: '>=10.13.0'}
+
+  esbuild@0.27.2:
+    resolution: {integrity: sha512-HyNQImnsOC7X9PMNaCIeAm4ISCQXs5a5YasTXVliKv4uuBo1dKrG0A+uQS8M5eXjVMnLg3WgXaKvprHlFJQffw==}
+    engines: {node: '>=18'}
+    hasBin: true
+
+  esm-env@1.2.2:
+    resolution: {integrity: sha512-Epxrv+Nr/CaL4ZcFGPJIYLWFom+YeV1DqMLHJoEd9SYRxNbaFruBwfEX/kkHUJf55j2+TUbmDcmuilbP1TmXHA==}
+
+  esrap@2.2.1:
+    resolution: {integrity: sha512-GiYWG34AN/4CUyaWAgunGt0Rxvr1PTMlGC0vvEov/uOQYWne2bpN03Um+k8jT+q3op33mKouP2zeJ6OlM+qeUg==}
+
+  fdir@6.5.0:
+    resolution: {integrity: sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==}
+    engines: {node: '>=12.0.0'}
+    peerDependencies:
+      picomatch: ^3 || ^4
+    peerDependenciesMeta:
+      picomatch:
+        optional: true
+
+  fsevents@2.3.3:
+    resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
+    engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
+    os: [darwin]
+
+  graceful-fs@4.2.11:
+    resolution: {integrity: sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==}
+
+  hast-util-to-html@9.0.5:
+    resolution: {integrity: sha512-OguPdidb+fbHQSU4Q4ZiLKnzWo8Wwsf5bZfbvu7//a9oTYoqD/fWpe96NuHkoS9h0ccGOTe0C4NGXdtS0iObOw==}
+
+  hast-util-whitespace@3.0.0:
+    resolution: {integrity: sha512-88JUN06ipLwsnv+dVn+OIYOvAuvBMy/Qoi6O7mQHxdPXpjy+Cd6xRkWwux7DKO+4sYILtLBRIKgsdpS2gQc7qw==}
+
+  html-void-elements@3.0.0:
+    resolution: {integrity: sha512-bEqo66MRXsUGxWHV5IP0PUiAWwoEjba4VCzg0LjFJBpchPaTfyfCKTG6bc5F8ucKec3q5y6qOdGyYTSBEvhCrg==}
+
+  is-reference@3.0.3:
+    resolution: {integrity: sha512-ixkJoqQvAP88E6wLydLGGqCJsrFUnqoH6HnaczB8XmDH1oaWU+xxdptvikTgaEhtZ53Ky6YXiBuUI2WXLMCwjw==}
+
+  iso-datestring-validator@2.2.2:
+    resolution: {integrity: sha512-yLEMkBbLZTlVQqOnQ4FiMujR6T4DEcCb1xizmvXS+OxuhwcbtynoosRzdMA69zZCShCNAbi+gJ71FxZBBXx1SA==}
+
+  jiti@2.6.1:
+    resolution: {integrity: sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ==}
+    hasBin: true
+
+  katex@0.16.27:
+    resolution: {integrity: sha512-aeQoDkuRWSqQN6nSvVCEFvfXdqo1OQiCmmW1kc9xSdjutPv7BGO7pqY9sQRJpMOGrEdfDgF2TfRXe5eUAD2Waw==}
+    hasBin: true
+
+  kleur@4.1.5:
+    resolution: {integrity: sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==}
+    engines: {node: '>=6'}
+
+  lightningcss-android-arm64@1.30.2:
+    resolution: {integrity: sha512-BH9sEdOCahSgmkVhBLeU7Hc9DWeZ1Eb6wNS6Da8igvUwAe0sqROHddIlvU06q3WyXVEOYDZ6ykBZQnjTbmo4+A==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [android]
+
+  lightningcss-darwin-arm64@1.30.2:
+    resolution: {integrity: sha512-ylTcDJBN3Hp21TdhRT5zBOIi73P6/W0qwvlFEk22fkdXchtNTOU4Qc37SkzV+EKYxLouZ6M4LG9NfZ1qkhhBWA==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [darwin]
+
+  lightningcss-darwin-x64@1.30.2:
+    resolution: {integrity: sha512-oBZgKchomuDYxr7ilwLcyms6BCyLn0z8J0+ZZmfpjwg9fRVZIR5/GMXd7r9RH94iDhld3UmSjBM6nXWM2TfZTQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [darwin]
+
+  lightningcss-freebsd-x64@1.30.2:
+    resolution: {integrity: sha512-c2bH6xTrf4BDpK8MoGG4Bd6zAMZDAXS569UxCAGcA7IKbHNMlhGQ89eRmvpIUGfKWNVdbhSbkQaWhEoMGmGslA==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [freebsd]
+
+  lightningcss-linux-arm-gnueabihf@1.30.2:
+    resolution: {integrity: sha512-eVdpxh4wYcm0PofJIZVuYuLiqBIakQ9uFZmipf6LF/HRj5Bgm0eb3qL/mr1smyXIS1twwOxNWndd8z0E374hiA==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm]
+    os: [linux]
+
+  lightningcss-linux-arm64-gnu@1.30.2:
+    resolution: {integrity: sha512-UK65WJAbwIJbiBFXpxrbTNArtfuznvxAJw4Q2ZGlU8kPeDIWEX1dg3rn2veBVUylA2Ezg89ktszWbaQnxD/e3A==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [linux]
+
+  lightningcss-linux-arm64-musl@1.30.2:
+    resolution: {integrity: sha512-5Vh9dGeblpTxWHpOx8iauV02popZDsCYMPIgiuw97OJ5uaDsL86cnqSFs5LZkG3ghHoX5isLgWzMs+eD1YzrnA==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [linux]
+
+  lightningcss-linux-x64-gnu@1.30.2:
+    resolution: {integrity: sha512-Cfd46gdmj1vQ+lR6VRTTadNHu6ALuw2pKR9lYq4FnhvgBc4zWY1EtZcAc6EffShbb1MFrIPfLDXD6Xprbnni4w==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [linux]
+
+  lightningcss-linux-x64-musl@1.30.2:
+    resolution: {integrity: sha512-XJaLUUFXb6/QG2lGIW6aIk6jKdtjtcffUT0NKvIqhSBY3hh9Ch+1LCeH80dR9q9LBjG3ewbDjnumefsLsP6aiA==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [linux]
+
+  lightningcss-win32-arm64-msvc@1.30.2:
+    resolution: {integrity: sha512-FZn+vaj7zLv//D/192WFFVA0RgHawIcHqLX9xuWiQt7P0PtdFEVaxgF9rjM/IRYHQXNnk61/H/gb2Ei+kUQ4xQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [win32]
+
+  lightningcss-win32-x64-msvc@1.30.2:
+    resolution: {integrity: sha512-5g1yc73p+iAkid5phb4oVFMB45417DkRevRbt/El/gKXJk4jid+vPFF/AXbxn05Aky8PapwzZrdJShv5C0avjw==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [win32]
+
+  lightningcss@1.30.2:
+    resolution: {integrity: sha512-utfs7Pr5uJyyvDETitgsaqSyjCb2qNRAtuqUeWIAKztsOYdcACf2KtARYXg2pSvhkt+9NfoaNY7fxjl6nuMjIQ==}
+    engines: {node: '>= 12.0.0'}
+
+  locate-character@3.0.0:
+    resolution: {integrity: sha512-SW13ws7BjaeJ6p7Q6CO2nchbYEc3X3J6WrmTTDto7yMPqVSZTUyY5Tjbid+Ab8gLnATtygYtiDIJGQRRn2ZOiA==}
+
+  magic-string@0.30.21:
+    resolution: {integrity: sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==}
+
+  mdast-util-to-hast@13.2.1:
+    resolution: {integrity: sha512-cctsq2wp5vTsLIcaymblUriiTcZd0CwWtCbLvrOzYCDZoWyMNV8sZ7krj09FSnsiJi3WVsHLM4k6Dq/yaPyCXA==}
+
+  micromark-util-character@2.1.1:
+    resolution: {integrity: sha512-wv8tdUTJ3thSFFFJKtpYKOYiGP2+v96Hvk4Tu8KpCAsTMs6yi+nVmGh1syvSCsaxz45J6Jbw+9DD6g97+NV67Q==}
+
+  micromark-util-encode@2.0.1:
+    resolution: {integrity: sha512-c3cVx2y4KqUnwopcO9b/SCdo2O67LwJJ/UyqGfbigahfegL9myoEFoDYZgkT7f36T0bLrM9hZTAaAyH+PCAXjw==}
+
+  micromark-util-sanitize-uri@2.0.1:
+    resolution: {integrity: sha512-9N9IomZ/YuGGZZmQec1MbgxtlgougxTodVwDzzEouPKo3qFWvymFHWcnDi2vzV1ff6kas9ucW+o3yzJK9YB1AQ==}
+
+  micromark-util-symbol@2.0.1:
+    resolution: {integrity: sha512-vs5t8Apaud9N28kgCrRUdEed4UJ+wWNvicHLPxCa9ENlYuAY31M0ETy5y1vA33YoNPDFTghEbnh6efaE8h4x0Q==}
+
+  micromark-util-types@2.0.2:
+    resolution: {integrity: sha512-Yw0ECSpJoViF1qTU4DC6NwtC4aWGt1EkzaQB8KPPyCRR8z9TWeV0HbEFGTO+ZY1wB22zmxnJqhPyTpOVCpeHTA==}
+
+  mri@1.2.0:
+    resolution: {integrity: sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA==}
+    engines: {node: '>=4'}
+
+  mrmime@2.0.1:
+    resolution: {integrity: sha512-Y3wQdFg2Va6etvQ5I82yUhGdsKrcYox6p7FfL1LbK2J4V01F9TGlepTIhnK24t7koZibmg82KGglhA1XK5IsLQ==}
+    engines: {node: '>=10'}
+
+  multiformats@9.9.0:
+    resolution: {integrity: sha512-HoMUjhH9T8DDBNT+6xzkrd9ga/XiBI4xLr58LJACwK6G3HTOPeMz4nB4KJs33L2BelrIJa7P0VuNaVF3hMYfjg==}
+
+  nanoid@3.3.11:
+    resolution: {integrity: sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==}
+    engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
+    hasBin: true
+
+  obug@2.1.1:
+    resolution: {integrity: sha512-uTqF9MuPraAQ+IsnPf366RG4cP9RtUi7MLO1N3KEc+wb0a6yKpeL0lmk2IB1jY5KHPAlTc6T/JRdC/YqxHNwkQ==}
+
+  oniguruma-parser@0.12.1:
+    resolution: {integrity: sha512-8Unqkvk1RYc6yq2WBYRj4hdnsAxVze8i7iPfQr8e4uSP3tRv0rpZcbGUDvxfQQcdwHt/e9PrMvGCsa8OqG9X3w==}
+
+  oniguruma-to-es@4.3.4:
+    resolution: {integrity: sha512-3VhUGN3w2eYxnTzHn+ikMI+fp/96KoRSVK9/kMTcFqj1NRDh2IhQCKvYxDnWePKRXY/AqH+Fuiyb7VHSzBjHfA==}
+
+  package-manager-detector@1.6.0:
+    resolution: {integrity: sha512-61A5ThoTiDG/C8s8UMZwSorAGwMJ0ERVGj2OjoW5pAalsNOg15+iQiPzrLJ4jhZ1HJzmC2PIHT2oEiH3R5fzNA==}
+
+  picocolors@1.1.1:
+    resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==}
+
+  picomatch@4.0.3:
+    resolution: {integrity: sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==}
+    engines: {node: '>=12'}
+
+  postcss-selector-parser@6.0.10:
+    resolution: {integrity: sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==}
+    engines: {node: '>=4'}
+
+  postcss@8.5.6:
+    resolution: {integrity: sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==}
+    engines: {node: ^10 || ^12 || >=14}
+
+  prettier-plugin-svelte@3.4.1:
+    resolution: {integrity: sha512-xL49LCloMoZRvSwa6IEdN2GV6cq2IqpYGstYtMT+5wmml1/dClEoI0MZR78MiVPpu6BdQFfN0/y73yO6+br5Pg==}
+    peerDependencies:
+      prettier: ^3.0.0
+      svelte: ^3.2.0 || ^4.0.0-next.0 || ^5.0.0-next.0
+
+  prettier-plugin-tailwindcss@0.7.2:
+    resolution: {integrity: sha512-LkphyK3Fw+q2HdMOoiEHWf93fNtYJwfamoKPl7UwtjFQdei/iIBoX11G6j706FzN3ymX9mPVi97qIY8328vdnA==}
+    engines: {node: '>=20.19'}
+    peerDependencies:
+      '@ianvs/prettier-plugin-sort-imports': '*'
+      '@prettier/plugin-hermes': '*'
+      '@prettier/plugin-oxc': '*'
+      '@prettier/plugin-pug': '*'
+      '@shopify/prettier-plugin-liquid': '*'
+      '@trivago/prettier-plugin-sort-imports': '*'
+      '@zackad/prettier-plugin-twig': '*'
+      prettier: ^3.0
+      prettier-plugin-astro: '*'
+      prettier-plugin-css-order: '*'
+      prettier-plugin-jsdoc: '*'
+      prettier-plugin-marko: '*'
+      prettier-plugin-multiline-arrays: '*'
+      prettier-plugin-organize-attributes: '*'
+      prettier-plugin-organize-imports: '*'
+      prettier-plugin-sort-imports: '*'
+      prettier-plugin-svelte: '*'
+    peerDependenciesMeta:
+      '@ianvs/prettier-plugin-sort-imports':
+        optional: true
+      '@prettier/plugin-hermes':
+        optional: true
+      '@prettier/plugin-oxc':
+        optional: true
+      '@prettier/plugin-pug':
+        optional: true
+      '@shopify/prettier-plugin-liquid':
+        optional: true
+      '@trivago/prettier-plugin-sort-imports':
+        optional: true
+      '@zackad/prettier-plugin-twig':
+        optional: true
+      prettier-plugin-astro:
+        optional: true
+      prettier-plugin-css-order:
+        optional: true
+      prettier-plugin-jsdoc:
+        optional: true
+      prettier-plugin-marko:
+        optional: true
+      prettier-plugin-multiline-arrays:
+        optional: true
+      prettier-plugin-organize-attributes:
+        optional: true
+      prettier-plugin-organize-imports:
+        optional: true
+      prettier-plugin-sort-imports:
+        optional: true
+      prettier-plugin-svelte:
+        optional: true
+
+  prettier@3.8.0:
+    resolution: {integrity: sha512-yEPsovQfpxYfgWNhCfECjG5AQaO+K3dp6XERmOepyPDVqcJm+bjyCVO3pmU+nAPe0N5dDvekfGezt/EIiRe1TA==}
+    engines: {node: '>=14'}
+    hasBin: true
+
+  property-information@7.1.0:
+    resolution: {integrity: sha512-TwEZ+X+yCJmYfL7TPUOcvBZ4QfoT5YenQiJuX//0th53DE6w0xxLEtfK3iyryQFddXuvkIk51EEgrJQ0WJkOmQ==}
+
+  publint@0.3.16:
+    resolution: {integrity: sha512-MFqyfRLAExPVZdTQFwkAQELzA8idyXzROVOytg6nEJ/GEypXBUmMGrVaID8cTuzRS1U5L8yTOdOJtMXgFUJAeA==}
+    engines: {node: '>=18'}
+    hasBin: true
+
+  readdirp@4.1.2:
+    resolution: {integrity: sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==}
+    engines: {node: '>= 14.18.0'}
+
+  readdirp@5.0.0:
+    resolution: {integrity: sha512-9u/XQ1pvrQtYyMpZe7DXKv2p5CNvyVwzUB6uhLAnQwHMSgKMBR62lc7AHljaeteeHXn11XTAaLLUVZYVZyuRBQ==}
+    engines: {node: '>= 20.19.0'}
+
+  regex-recursion@6.0.2:
+    resolution: {integrity: sha512-0YCaSCq2VRIebiaUviZNs0cBz1kg5kVS2UKUfNIx8YVs1cN3AV7NTctO5FOKBA+UT2BPJIWZauYHPqJODG50cg==}
+
+  regex-utilities@2.3.0:
+    resolution: {integrity: sha512-8VhliFJAWRaUiVvREIiW2NXXTmHs4vMNnSzuJVhscgmGav3g9VDxLrQndI3dZZVVdp0ZO/5v0xmX516/7M9cng==}
+
+  regex@6.1.0:
+    resolution: {integrity: sha512-6VwtthbV4o/7+OaAF9I5L5V3llLEsoPyq9P1JVXkedTP33c7MfCG0/5NOPcSJn0TzXcG9YUrR0gQSWioew3LDg==}
+
+  rollup@4.55.1:
+    resolution: {integrity: sha512-wDv/Ht1BNHB4upNbK74s9usvl7hObDnvVzknxqY/E/O3X6rW1U1rV1aENEfJ54eFZDTNo7zv1f5N4edCluH7+A==}
+    engines: {node: '>=18.0.0', npm: '>=8.0.0'}
+    hasBin: true
+
+  sade@1.8.1:
+    resolution: {integrity: sha512-xal3CZX1Xlo/k4ApwCFrHVACi9fBqJ7V+mwhBsuf/1IOKbBy098Fex+Wa/5QMubw09pSZ/u8EY8PWgevJsXp1A==}
+    engines: {node: '>=6'}
+
+  scule@1.3.0:
+    resolution: {integrity: sha512-6FtHJEvt+pVMIB9IBY+IcCJ6Z5f1iQnytgyfKMhDKgmzYG+TeH/wx1y3l27rshSbLiSanrR9ffZDrEsmjlQF2g==}
+
+  semver@7.7.3:
+    resolution: {integrity: sha512-SdsKMrI9TdgjdweUSR9MweHA4EJ8YxHn8DFaDisvhVlUOe4BF1tLD7GAj0lIqWVl+dPb/rExr0Btby5loQm20Q==}
+    engines: {node: '>=10'}
+    hasBin: true
+
+  set-cookie-parser@2.7.2:
+    resolution: {integrity: sha512-oeM1lpU/UvhTxw+g3cIfxXHyJRc/uidd3yK1P242gzHds0udQBYzs3y8j4gCCW+ZJ7ad0yctld8RYO+bdurlvw==}
+
+  shiki@3.21.0:
+    resolution: {integrity: sha512-N65B/3bqL/TI2crrXr+4UivctrAGEjmsib5rPMMPpFp1xAx/w03v8WZ9RDDFYteXoEgY7qZ4HGgl5KBIu1153w==}
+
+  sirv@3.0.2:
+    resolution: {integrity: sha512-2wcC/oGxHis/BoHkkPwldgiPSYcpZK3JU28WoMVv55yHJgcZ8rlXvuG9iZggz+sU1d4bRgIGASwyWqjxu3FM0g==}
+    engines: {node: '>=18'}
+
+  source-map-js@1.2.1:
+    resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==}
+    engines: {node: '>=0.10.0'}
+
+  space-separated-tokens@2.0.2:
+    resolution: {integrity: sha512-PEGlAwrG8yXGXRjW32fGbg66JAlOAwbObuqVoJpv/mRgoWDQfgH1wDPvtzWyUSNAXBGSk8h755YDbbcEy3SH2Q==}
+
+  stringify-entities@4.0.4:
+    resolution: {integrity: sha512-IwfBptatlO+QCJUo19AqvrPNqlVMpW9YEL2LIVY+Rpv2qsjCGxaDLNRgeGsQWJhfItebuJhsGSLjaBbNSQ+ieg==}
+
+  svelte-check@4.3.5:
+    resolution: {integrity: sha512-e4VWZETyXaKGhpkxOXP+B/d0Fp/zKViZoJmneZWe/05Y2aqSKj3YN2nLfYPJBQ87WEiY4BQCQ9hWGu9mPT1a1Q==}
+    engines: {node: '>= 18.0.0'}
+    hasBin: true
+    peerDependencies:
+      svelte: ^4.0.0 || ^5.0.0-next.0
+      typescript: '>=5.0.0'
+
+  svelte2tsx@0.7.46:
+    resolution: {integrity: sha512-S++Vw3w47a8rBuhbz4JK0fcGea8tOoX1boT53Aib8+oUO2EKeOG+geXprJVTDfBlvR+IJdf3jIpR2RGwT6paQA==}
+    peerDependencies:
+      svelte: ^3.55 || ^4.0.0-next.0 || ^4.0 || ^5.0.0-next.0
+      typescript: ^4.9.4 || ^5.0.0
+
+  svelte@5.46.4:
+    resolution: {integrity: sha512-VJwdXrmv9L8L7ZasJeWcCjoIuMRVbhuxbss0fpVnR8yorMmjNDwcjIH08vS6wmSzzzgAG5CADQ1JuXPS2nwt9w==}
+    engines: {node: '>=18'}
+
+  tailwindcss@4.1.18:
+    resolution: {integrity: sha512-4+Z+0yiYyEtUVCScyfHCxOYP06L5Ne+JiHhY2IjR2KWMIWhJOYZKLSGZaP5HkZ8+bY0cxfzwDE5uOmzFXyIwxw==}
+
+  tapable@2.3.0:
+    resolution: {integrity: sha512-g9ljZiwki/LfxmQADO3dEY1CbpmXT5Hm2fJ+QaGKwSXUylMybePR7/67YW7jOrrvjEgL1Fmz5kzyAjWVWLlucg==}
+    engines: {node: '>=6'}
+
+  tinyglobby@0.2.15:
+    resolution: {integrity: sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ==}
+    engines: {node: '>=12.0.0'}
+
+  tlds@1.261.0:
+    resolution: {integrity: sha512-QXqwfEl9ddlGBaRFXIvNKK6OhipSiLXuRuLJX5DErz0o0Q0rYxulWLdFryTkV5PkdZct5iMInwYEGe/eR++1AA==}
+    hasBin: true
+
+  totalist@3.0.1:
+    resolution: {integrity: sha512-sf4i37nQ2LBx4m3wB74y+ubopq6W/dIzXg0FDGjsYnZHVa1Da8FH853wlL2gtUhg+xJXjfk3kUZS3BRoQeoQBQ==}
+    engines: {node: '>=6'}
+
+  trim-lines@3.0.1:
+    resolution: {integrity: sha512-kRj8B+YHZCc9kQYdWfJB2/oUl9rA99qbowYYBtr4ui4mZyAQ2JpvVBd/6U2YloATfqBhBTSMhTpgBHtU0Mf3Rg==}
+
+  tslib@2.8.1:
+    resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==}
+
+  typescript@5.9.3:
+    resolution: {integrity: sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==}
+    engines: {node: '>=14.17'}
+    hasBin: true
+
+  uint8arrays@3.0.0:
+    resolution: {integrity: sha512-HRCx0q6O9Bfbp+HHSfQQKD7wU70+lydKVt4EghkdOvlK/NlrF90z+eXV34mUd48rNvVJXwkrMSPpCATkct8fJA==}
+
+  unicode-segmenter@0.14.5:
+    resolution: {integrity: sha512-jHGmj2LUuqDcX3hqY12Ql+uhUTn8huuxNZGq7GvtF6bSybzH3aFgedYu/KTzQStEgt1Ra2F3HxadNXsNjb3m3g==}
+
+  unist-util-is@6.0.1:
+    resolution: {integrity: sha512-LsiILbtBETkDz8I9p1dQ0uyRUWuaQzd/cuEeS1hoRSyW5E5XGmTzlwY1OrNzzakGowI9Dr/I8HVaw4hTtnxy8g==}
+
+  unist-util-position@5.0.0:
+    resolution: {integrity: sha512-fucsC7HjXvkB5R3kTCO7kUjRdrS0BJt3M/FPxmHMBOm8JQi2BsHAHFsy27E0EolP8rp0NzXsJ+jNPyDWvOJZPA==}
+
+  unist-util-stringify-position@4.0.0:
+    resolution: {integrity: sha512-0ASV06AAoKCDkS2+xw5RXJywruurpbC4JZSm7nr7MOt1ojAzvyyaO+UxZf18j8FCF6kmzCZKcAgN/yu2gm2XgQ==}
+
+  unist-util-visit-parents@6.0.2:
+    resolution: {integrity: sha512-goh1s1TBrqSqukSc8wrjwWhL0hiJxgA8m4kFxGlQ+8FYQ3C/m11FcTs4YYem7V664AhHVvgoQLk890Ssdsr2IQ==}
+
+  unist-util-visit@5.1.0:
+    resolution: {integrity: sha512-m+vIdyeCOpdr/QeQCu2EzxX/ohgS8KbnPDgFni4dQsfSCtpz8UqDyY5GjRru8PDKuYn7Fq19j1CQ+nJSsGKOzg==}
+
+  util-deprecate@1.0.2:
+    resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
+
+  vfile-message@4.0.3:
+    resolution: {integrity: sha512-QTHzsGd1EhbZs4AsQ20JX1rC3cOlt/IWJruk893DfLRr57lcnOeMaWG4K0JrRta4mIJZKth2Au3mM3u03/JWKw==}
+
+  vfile@6.0.3:
+    resolution: {integrity: sha512-KzIbH/9tXat2u30jf+smMwFCsno4wHVdNmzFyL+T/L3UGqqk6JKfVqOFOZEpZSHADH1k40ab6NUIXZq422ov3Q==}
+
+  vite@7.3.1:
+    resolution: {integrity: sha512-w+N7Hifpc3gRjZ63vYBXA56dvvRlNWRczTdmCBBa+CotUzAPf5b7YMdMR/8CQoeYE5LX3W4wj6RYTgonm1b9DA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    hasBin: true
+    peerDependencies:
+      '@types/node': ^20.19.0 || >=22.12.0
+      jiti: '>=1.21.0'
+      less: ^4.0.0
+      lightningcss: ^1.21.0
+      sass: ^1.70.0
+      sass-embedded: ^1.70.0
+      stylus: '>=0.54.8'
+      sugarss: ^5.0.0
+      terser: ^5.16.0
+      tsx: ^4.8.1
+      yaml: ^2.4.2
+    peerDependenciesMeta:
+      '@types/node':
+        optional: true
+      jiti:
+        optional: true
+      less:
+        optional: true
+      lightningcss:
+        optional: true
+      sass:
+        optional: true
+      sass-embedded:
+        optional: true
+      stylus:
+        optional: true
+      sugarss:
+        optional: true
+      terser:
+        optional: true
+      tsx:
+        optional: true
+      yaml:
+        optional: true
+
+  vitefu@1.1.1:
+    resolution: {integrity: sha512-B/Fegf3i8zh0yFbpzZ21amWzHmuNlLlmJT6n7bu5e+pCHUKQIfXSYokrqOBGEMMe9UG2sostKQF9mml/vYaWJQ==}
+    peerDependencies:
+      vite: ^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0-beta.0
+    peerDependenciesMeta:
+      vite:
+        optional: true
+
+  zimmerframe@1.1.4:
+    resolution: {integrity: sha512-B58NGBEoc8Y9MWWCQGl/gq9xBCe4IiKM0a2x7GZdQKOW5Exr8S1W24J6OgM1njK8xCRGvAJIL/MxXHf6SkmQKQ==}
+
+  zod@3.25.76:
+    resolution: {integrity: sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==}
+
+  zwitch@2.0.4:
+    resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
+
+snapshots:
+
+  '@atproto/api@0.18.16':
+    dependencies:
+      '@atproto/common-web': 0.4.12
+      '@atproto/lexicon': 0.6.0
+      '@atproto/syntax': 0.4.2
+      '@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.12':
+    dependencies:
+      '@atproto/lex-data': 0.0.8
+      '@atproto/lex-json': 0.0.8
+      zod: 3.25.76
+
+  '@atproto/lex-data@0.0.8':
+    dependencies:
+      '@atproto/syntax': 0.4.2
+      multiformats: 9.9.0
+      tslib: 2.8.1
+      uint8arrays: 3.0.0
+      unicode-segmenter: 0.14.5
+
+  '@atproto/lex-json@0.0.8':
+    dependencies:
+      '@atproto/lex-data': 0.0.8
+      tslib: 2.8.1
+
+  '@atproto/lexicon@0.6.0':
+    dependencies:
+      '@atproto/common-web': 0.4.12
+      '@atproto/syntax': 0.4.2
+      iso-datestring-validator: 2.2.2
+      multiformats: 9.9.0
+      zod: 3.25.76
+
+  '@atproto/syntax@0.4.2': {}
+
+  '@atproto/xrpc@0.7.7':
+    dependencies:
+      '@atproto/lexicon': 0.6.0
+      zod: 3.25.76
+
+  '@esbuild/aix-ppc64@0.27.2':
+    optional: true
+
+  '@esbuild/android-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/android-arm@0.27.2':
+    optional: true
+
+  '@esbuild/android-x64@0.27.2':
+    optional: true
+
+  '@esbuild/darwin-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/darwin-x64@0.27.2':
+    optional: true
+
+  '@esbuild/freebsd-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/freebsd-x64@0.27.2':
+    optional: true
+
+  '@esbuild/linux-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/linux-arm@0.27.2':
+    optional: true
+
+  '@esbuild/linux-ia32@0.27.2':
+    optional: true
+
+  '@esbuild/linux-loong64@0.27.2':
+    optional: true
+
+  '@esbuild/linux-mips64el@0.27.2':
+    optional: true
+
+  '@esbuild/linux-ppc64@0.27.2':
+    optional: true
+
+  '@esbuild/linux-riscv64@0.27.2':
+    optional: true
+
+  '@esbuild/linux-s390x@0.27.2':
+    optional: true
+
+  '@esbuild/linux-x64@0.27.2':
+    optional: true
+
+  '@esbuild/netbsd-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/netbsd-x64@0.27.2':
+    optional: true
+
+  '@esbuild/openbsd-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/openbsd-x64@0.27.2':
+    optional: true
+
+  '@esbuild/openharmony-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/sunos-x64@0.27.2':
+    optional: true
+
+  '@esbuild/win32-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/win32-ia32@0.27.2':
+    optional: true
+
+  '@esbuild/win32-x64@0.27.2':
+    optional: true
+
+  '@jridgewell/gen-mapping@0.3.13':
+    dependencies:
+      '@jridgewell/sourcemap-codec': 1.5.5
+      '@jridgewell/trace-mapping': 0.3.31
+
+  '@jridgewell/remapping@2.3.5':
+    dependencies:
+      '@jridgewell/gen-mapping': 0.3.13
+      '@jridgewell/trace-mapping': 0.3.31
+
+  '@jridgewell/resolve-uri@3.1.2': {}
+
+  '@jridgewell/sourcemap-codec@1.5.5': {}
+
+  '@jridgewell/trace-mapping@0.3.31':
+    dependencies:
+      '@jridgewell/resolve-uri': 3.1.2
+      '@jridgewell/sourcemap-codec': 1.5.5
+
+  '@lucide/svelte@0.562.0(svelte@5.46.4)':
+    dependencies:
+      svelte: 5.46.4
+
+  '@polka/url@1.0.0-next.29': {}
+
+  '@publint/pack@0.1.2': {}
+
+  '@rollup/rollup-android-arm-eabi@4.55.1':
+    optional: true
+
+  '@rollup/rollup-android-arm64@4.55.1':
+    optional: true
+
+  '@rollup/rollup-darwin-arm64@4.55.1':
+    optional: true
+
+  '@rollup/rollup-darwin-x64@4.55.1':
+    optional: true
+
+  '@rollup/rollup-freebsd-arm64@4.55.1':
+    optional: true
+
+  '@rollup/rollup-freebsd-x64@4.55.1':
+    optional: true
+
+  '@rollup/rollup-linux-arm-gnueabihf@4.55.1':
+    optional: true
+
+  '@rollup/rollup-linux-arm-musleabihf@4.55.1':
+    optional: true
+
+  '@rollup/rollup-linux-arm64-gnu@4.55.1':
+    optional: true
+
+  '@rollup/rollup-linux-arm64-musl@4.55.1':
+    optional: true
+
+  '@rollup/rollup-linux-loong64-gnu@4.55.1':
+    optional: true
+
+  '@rollup/rollup-linux-loong64-musl@4.55.1':
+    optional: true
+
+  '@rollup/rollup-linux-ppc64-gnu@4.55.1':
+    optional: true
+
+  '@rollup/rollup-linux-ppc64-musl@4.55.1':
+    optional: true
+
+  '@rollup/rollup-linux-riscv64-gnu@4.55.1':
+    optional: true
+
+  '@rollup/rollup-linux-riscv64-musl@4.55.1':
+    optional: true
+
+  '@rollup/rollup-linux-s390x-gnu@4.55.1':
+    optional: true
+
+  '@rollup/rollup-linux-x64-gnu@4.55.1':
+    optional: true
+
+  '@rollup/rollup-linux-x64-musl@4.55.1':
+    optional: true
+
+  '@rollup/rollup-openbsd-x64@4.55.1':
+    optional: true
+
+  '@rollup/rollup-openharmony-arm64@4.55.1':
+    optional: true
+
+  '@rollup/rollup-win32-arm64-msvc@4.55.1':
+    optional: true
+
+  '@rollup/rollup-win32-ia32-msvc@4.55.1':
+    optional: true
+
+  '@rollup/rollup-win32-x64-gnu@4.55.1':
+    optional: true
+
+  '@rollup/rollup-win32-x64-msvc@4.55.1':
+    optional: true
+
+  '@shikijs/core@3.21.0':
+    dependencies:
+      '@shikijs/types': 3.21.0
+      '@shikijs/vscode-textmate': 10.0.2
+      '@types/hast': 3.0.4
+      hast-util-to-html: 9.0.5
+
+  '@shikijs/engine-javascript@3.21.0':
+    dependencies:
+      '@shikijs/types': 3.21.0
+      '@shikijs/vscode-textmate': 10.0.2
+      oniguruma-to-es: 4.3.4
+
+  '@shikijs/engine-oniguruma@3.21.0':
+    dependencies:
+      '@shikijs/types': 3.21.0
+      '@shikijs/vscode-textmate': 10.0.2
+
+  '@shikijs/langs@3.21.0':
+    dependencies:
+      '@shikijs/types': 3.21.0
+
+  '@shikijs/themes@3.21.0':
+    dependencies:
+      '@shikijs/types': 3.21.0
+
+  '@shikijs/types@3.21.0':
+    dependencies:
+      '@shikijs/vscode-textmate': 10.0.2
+      '@types/hast': 3.0.4
+
+  '@shikijs/vscode-textmate@10.0.2': {}
+
+  '@standard-schema/spec@1.1.0': {}
+
+  '@sveltejs/acorn-typescript@1.0.8(acorn@8.15.0)':
+    dependencies:
+      acorn: 8.15.0
+
+  '@sveltejs/adapter-auto@7.0.0(@sveltejs/kit@2.50.0(@sveltejs/vite-plugin-svelte@6.2.4(svelte@5.46.4)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2)))(svelte@5.46.4)(typescript@5.9.3)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2)))':
+    dependencies:
+      '@sveltejs/kit': 2.50.0(@sveltejs/vite-plugin-svelte@6.2.4(svelte@5.46.4)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2)))(svelte@5.46.4)(typescript@5.9.3)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2))
+
+  '@sveltejs/kit@2.50.0(@sveltejs/vite-plugin-svelte@6.2.4(svelte@5.46.4)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2)))(svelte@5.46.4)(typescript@5.9.3)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2))':
+    dependencies:
+      '@standard-schema/spec': 1.1.0
+      '@sveltejs/acorn-typescript': 1.0.8(acorn@8.15.0)
+      '@sveltejs/vite-plugin-svelte': 6.2.4(svelte@5.46.4)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2))
+      '@types/cookie': 0.6.0
+      acorn: 8.15.0
+      cookie: 0.6.0
+      devalue: 5.6.2
+      esm-env: 1.2.2
+      kleur: 4.1.5
+      magic-string: 0.30.21
+      mrmime: 2.0.1
+      sade: 1.8.1
+      set-cookie-parser: 2.7.2
+      sirv: 3.0.2
+      svelte: 5.46.4
+      vite: 7.3.1(jiti@2.6.1)(lightningcss@1.30.2)
+    optionalDependencies:
+      typescript: 5.9.3
+
+  '@sveltejs/package@2.5.7(svelte@5.46.4)(typescript@5.9.3)':
+    dependencies:
+      chokidar: 5.0.0
+      kleur: 4.1.5
+      sade: 1.8.1
+      semver: 7.7.3
+      svelte: 5.46.4
+      svelte2tsx: 0.7.46(svelte@5.46.4)(typescript@5.9.3)
+    transitivePeerDependencies:
+      - typescript
+
+  '@sveltejs/vite-plugin-svelte-inspector@5.0.2(@sveltejs/vite-plugin-svelte@6.2.4(svelte@5.46.4)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2)))(svelte@5.46.4)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2))':
+    dependencies:
+      '@sveltejs/vite-plugin-svelte': 6.2.4(svelte@5.46.4)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2))
+      obug: 2.1.1
+      svelte: 5.46.4
+      vite: 7.3.1(jiti@2.6.1)(lightningcss@1.30.2)
+
+  '@sveltejs/vite-plugin-svelte@6.2.4(svelte@5.46.4)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2))':
+    dependencies:
+      '@sveltejs/vite-plugin-svelte-inspector': 5.0.2(@sveltejs/vite-plugin-svelte@6.2.4(svelte@5.46.4)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2)))(svelte@5.46.4)(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2))
+      deepmerge: 4.3.1
+      magic-string: 0.30.21
+      obug: 2.1.1
+      svelte: 5.46.4
+      vite: 7.3.1(jiti@2.6.1)(lightningcss@1.30.2)
+      vitefu: 1.1.1(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2))
+
+  '@tailwindcss/node@4.1.18':
+    dependencies:
+      '@jridgewell/remapping': 2.3.5
+      enhanced-resolve: 5.18.4
+      jiti: 2.6.1
+      lightningcss: 1.30.2
+      magic-string: 0.30.21
+      source-map-js: 1.2.1
+      tailwindcss: 4.1.18
+
+  '@tailwindcss/oxide-android-arm64@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-darwin-arm64@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-darwin-x64@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-freebsd-x64@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-linux-arm-gnueabihf@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-linux-arm64-gnu@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-linux-arm64-musl@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-linux-x64-gnu@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-linux-x64-musl@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-wasm32-wasi@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-win32-arm64-msvc@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-win32-x64-msvc@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide@4.1.18':
+    optionalDependencies:
+      '@tailwindcss/oxide-android-arm64': 4.1.18
+      '@tailwindcss/oxide-darwin-arm64': 4.1.18
+      '@tailwindcss/oxide-darwin-x64': 4.1.18
+      '@tailwindcss/oxide-freebsd-x64': 4.1.18
+      '@tailwindcss/oxide-linux-arm-gnueabihf': 4.1.18
+      '@tailwindcss/oxide-linux-arm64-gnu': 4.1.18
+      '@tailwindcss/oxide-linux-arm64-musl': 4.1.18
+      '@tailwindcss/oxide-linux-x64-gnu': 4.1.18
+      '@tailwindcss/oxide-linux-x64-musl': 4.1.18
+      '@tailwindcss/oxide-wasm32-wasi': 4.1.18
+      '@tailwindcss/oxide-win32-arm64-msvc': 4.1.18
+      '@tailwindcss/oxide-win32-x64-msvc': 4.1.18
+
+  '@tailwindcss/typography@0.5.19(tailwindcss@4.1.18)':
+    dependencies:
+      postcss-selector-parser: 6.0.10
+      tailwindcss: 4.1.18
+
+  '@tailwindcss/vite@4.1.18(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2))':
+    dependencies:
+      '@tailwindcss/node': 4.1.18
+      '@tailwindcss/oxide': 4.1.18
+      tailwindcss: 4.1.18
+      vite: 7.3.1(jiti@2.6.1)(lightningcss@1.30.2)
+
+  '@types/cookie@0.6.0': {}
+
+  '@types/estree@1.0.8': {}
+
+  '@types/hast@3.0.4':
+    dependencies:
+      '@types/unist': 3.0.3
+
+  '@types/mdast@4.0.4':
+    dependencies:
+      '@types/unist': 3.0.3
+
+  '@types/unist@3.0.3': {}
+
+  '@ungap/structured-clone@1.3.0': {}
+
+  acorn@8.15.0: {}
+
+  aria-query@5.3.2: {}
+
+  await-lock@2.2.2: {}
+
+  axobject-query@4.1.0: {}
+
+  ccount@2.0.1: {}
+
+  character-entities-html4@2.1.0: {}
+
+  character-entities-legacy@3.0.0: {}
+
+  chokidar@4.0.3:
+    dependencies:
+      readdirp: 4.1.2
+
+  chokidar@5.0.0:
+    dependencies:
+      readdirp: 5.0.0
+
+  clsx@2.1.1: {}
+
+  comma-separated-tokens@2.0.3: {}
+
+  commander@8.3.0: {}
+
+  cookie@0.6.0: {}
+
+  cssesc@3.0.0: {}
+
+  dedent-js@1.0.1: {}
+
+  deepmerge@4.3.1: {}
+
+  dequal@2.0.3: {}
+
+  detect-libc@2.1.2: {}
+
+  devalue@5.6.2: {}
+
+  devlop@1.1.0:
+    dependencies:
+      dequal: 2.0.3
+
+  enhanced-resolve@5.18.4:
+    dependencies:
+      graceful-fs: 4.2.11
+      tapable: 2.3.0
+
+  esbuild@0.27.2:
+    optionalDependencies:
+      '@esbuild/aix-ppc64': 0.27.2
+      '@esbuild/android-arm': 0.27.2
+      '@esbuild/android-arm64': 0.27.2
+      '@esbuild/android-x64': 0.27.2
+      '@esbuild/darwin-arm64': 0.27.2
+      '@esbuild/darwin-x64': 0.27.2
+      '@esbuild/freebsd-arm64': 0.27.2
+      '@esbuild/freebsd-x64': 0.27.2
+      '@esbuild/linux-arm': 0.27.2
+      '@esbuild/linux-arm64': 0.27.2
+      '@esbuild/linux-ia32': 0.27.2
+      '@esbuild/linux-loong64': 0.27.2
+      '@esbuild/linux-mips64el': 0.27.2
+      '@esbuild/linux-ppc64': 0.27.2
+      '@esbuild/linux-riscv64': 0.27.2
+      '@esbuild/linux-s390x': 0.27.2
+      '@esbuild/linux-x64': 0.27.2
+      '@esbuild/netbsd-arm64': 0.27.2
+      '@esbuild/netbsd-x64': 0.27.2
+      '@esbuild/openbsd-arm64': 0.27.2
+      '@esbuild/openbsd-x64': 0.27.2
+      '@esbuild/openharmony-arm64': 0.27.2
+      '@esbuild/sunos-x64': 0.27.2
+      '@esbuild/win32-arm64': 0.27.2
+      '@esbuild/win32-ia32': 0.27.2
+      '@esbuild/win32-x64': 0.27.2
+
+  esm-env@1.2.2: {}
+
+  esrap@2.2.1:
+    dependencies:
+      '@jridgewell/sourcemap-codec': 1.5.5
+
+  fdir@6.5.0(picomatch@4.0.3):
+    optionalDependencies:
+      picomatch: 4.0.3
+
+  fsevents@2.3.3:
+    optional: true
+
+  graceful-fs@4.2.11: {}
+
+  hast-util-to-html@9.0.5:
+    dependencies:
+      '@types/hast': 3.0.4
+      '@types/unist': 3.0.3
+      ccount: 2.0.1
+      comma-separated-tokens: 2.0.3
+      hast-util-whitespace: 3.0.0
+      html-void-elements: 3.0.0
+      mdast-util-to-hast: 13.2.1
+      property-information: 7.1.0
+      space-separated-tokens: 2.0.2
+      stringify-entities: 4.0.4
+      zwitch: 2.0.4
+
+  hast-util-whitespace@3.0.0:
+    dependencies:
+      '@types/hast': 3.0.4
+
+  html-void-elements@3.0.0: {}
+
+  is-reference@3.0.3:
+    dependencies:
+      '@types/estree': 1.0.8
+
+  iso-datestring-validator@2.2.2: {}
+
+  jiti@2.6.1: {}
+
+  katex@0.16.27:
+    dependencies:
+      commander: 8.3.0
+
+  kleur@4.1.5: {}
+
+  lightningcss-android-arm64@1.30.2:
+    optional: true
+
+  lightningcss-darwin-arm64@1.30.2:
+    optional: true
+
+  lightningcss-darwin-x64@1.30.2:
+    optional: true
+
+  lightningcss-freebsd-x64@1.30.2:
+    optional: true
+
+  lightningcss-linux-arm-gnueabihf@1.30.2:
+    optional: true
+
+  lightningcss-linux-arm64-gnu@1.30.2:
+    optional: true
+
+  lightningcss-linux-arm64-musl@1.30.2:
+    optional: true
+
+  lightningcss-linux-x64-gnu@1.30.2:
+    optional: true
+
+  lightningcss-linux-x64-musl@1.30.2:
+    optional: true
+
+  lightningcss-win32-arm64-msvc@1.30.2:
+    optional: true
+
+  lightningcss-win32-x64-msvc@1.30.2:
+    optional: true
+
+  lightningcss@1.30.2:
+    dependencies:
+      detect-libc: 2.1.2
+    optionalDependencies:
+      lightningcss-android-arm64: 1.30.2
+      lightningcss-darwin-arm64: 1.30.2
+      lightningcss-darwin-x64: 1.30.2
+      lightningcss-freebsd-x64: 1.30.2
+      lightningcss-linux-arm-gnueabihf: 1.30.2
+      lightningcss-linux-arm64-gnu: 1.30.2
+      lightningcss-linux-arm64-musl: 1.30.2
+      lightningcss-linux-x64-gnu: 1.30.2
+      lightningcss-linux-x64-musl: 1.30.2
+      lightningcss-win32-arm64-msvc: 1.30.2
+      lightningcss-win32-x64-msvc: 1.30.2
+
+  locate-character@3.0.0: {}
+
+  magic-string@0.30.21:
+    dependencies:
+      '@jridgewell/sourcemap-codec': 1.5.5
+
+  mdast-util-to-hast@13.2.1:
+    dependencies:
+      '@types/hast': 3.0.4
+      '@types/mdast': 4.0.4
+      '@ungap/structured-clone': 1.3.0
+      devlop: 1.1.0
+      micromark-util-sanitize-uri: 2.0.1
+      trim-lines: 3.0.1
+      unist-util-position: 5.0.0
+      unist-util-visit: 5.1.0
+      vfile: 6.0.3
+
+  micromark-util-character@2.1.1:
+    dependencies:
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-util-encode@2.0.1: {}
+
+  micromark-util-sanitize-uri@2.0.1:
+    dependencies:
+      micromark-util-character: 2.1.1
+      micromark-util-encode: 2.0.1
+      micromark-util-symbol: 2.0.1
+
+  micromark-util-symbol@2.0.1: {}
+
+  micromark-util-types@2.0.2: {}
+
+  mri@1.2.0: {}
+
+  mrmime@2.0.1: {}
+
+  multiformats@9.9.0: {}
+
+  nanoid@3.3.11: {}
+
+  obug@2.1.1: {}
+
+  oniguruma-parser@0.12.1: {}
+
+  oniguruma-to-es@4.3.4:
+    dependencies:
+      oniguruma-parser: 0.12.1
+      regex: 6.1.0
+      regex-recursion: 6.0.2
+
+  package-manager-detector@1.6.0: {}
+
+  picocolors@1.1.1: {}
+
+  picomatch@4.0.3: {}
+
+  postcss-selector-parser@6.0.10:
+    dependencies:
+      cssesc: 3.0.0
+      util-deprecate: 1.0.2
+
+  postcss@8.5.6:
+    dependencies:
+      nanoid: 3.3.11
+      picocolors: 1.1.1
+      source-map-js: 1.2.1
+
+  prettier-plugin-svelte@3.4.1(prettier@3.8.0)(svelte@5.46.4):
+    dependencies:
+      prettier: 3.8.0
+      svelte: 5.46.4
+
+  prettier-plugin-tailwindcss@0.7.2(prettier-plugin-svelte@3.4.1(prettier@3.8.0)(svelte@5.46.4))(prettier@3.8.0):
+    dependencies:
+      prettier: 3.8.0
+    optionalDependencies:
+      prettier-plugin-svelte: 3.4.1(prettier@3.8.0)(svelte@5.46.4)
+
+  prettier@3.8.0: {}
+
+  property-information@7.1.0: {}
+
+  publint@0.3.16:
+    dependencies:
+      '@publint/pack': 0.1.2
+      package-manager-detector: 1.6.0
+      picocolors: 1.1.1
+      sade: 1.8.1
+
+  readdirp@4.1.2: {}
+
+  readdirp@5.0.0: {}
+
+  regex-recursion@6.0.2:
+    dependencies:
+      regex-utilities: 2.3.0
+
+  regex-utilities@2.3.0: {}
+
+  regex@6.1.0:
+    dependencies:
+      regex-utilities: 2.3.0
+
+  rollup@4.55.1:
+    dependencies:
+      '@types/estree': 1.0.8
+    optionalDependencies:
+      '@rollup/rollup-android-arm-eabi': 4.55.1
+      '@rollup/rollup-android-arm64': 4.55.1
+      '@rollup/rollup-darwin-arm64': 4.55.1
+      '@rollup/rollup-darwin-x64': 4.55.1
+      '@rollup/rollup-freebsd-arm64': 4.55.1
+      '@rollup/rollup-freebsd-x64': 4.55.1
+      '@rollup/rollup-linux-arm-gnueabihf': 4.55.1
+      '@rollup/rollup-linux-arm-musleabihf': 4.55.1
+      '@rollup/rollup-linux-arm64-gnu': 4.55.1
+      '@rollup/rollup-linux-arm64-musl': 4.55.1
+      '@rollup/rollup-linux-loong64-gnu': 4.55.1
+      '@rollup/rollup-linux-loong64-musl': 4.55.1
+      '@rollup/rollup-linux-ppc64-gnu': 4.55.1
+      '@rollup/rollup-linux-ppc64-musl': 4.55.1
+      '@rollup/rollup-linux-riscv64-gnu': 4.55.1
+      '@rollup/rollup-linux-riscv64-musl': 4.55.1
+      '@rollup/rollup-linux-s390x-gnu': 4.55.1
+      '@rollup/rollup-linux-x64-gnu': 4.55.1
+      '@rollup/rollup-linux-x64-musl': 4.55.1
+      '@rollup/rollup-openbsd-x64': 4.55.1
+      '@rollup/rollup-openharmony-arm64': 4.55.1
+      '@rollup/rollup-win32-arm64-msvc': 4.55.1
+      '@rollup/rollup-win32-ia32-msvc': 4.55.1
+      '@rollup/rollup-win32-x64-gnu': 4.55.1
+      '@rollup/rollup-win32-x64-msvc': 4.55.1
+      fsevents: 2.3.3
+
+  sade@1.8.1:
+    dependencies:
+      mri: 1.2.0
+
+  scule@1.3.0: {}
+
+  semver@7.7.3: {}
+
+  set-cookie-parser@2.7.2: {}
+
+  shiki@3.21.0:
+    dependencies:
+      '@shikijs/core': 3.21.0
+      '@shikijs/engine-javascript': 3.21.0
+      '@shikijs/engine-oniguruma': 3.21.0
+      '@shikijs/langs': 3.21.0
+      '@shikijs/themes': 3.21.0
+      '@shikijs/types': 3.21.0
+      '@shikijs/vscode-textmate': 10.0.2
+      '@types/hast': 3.0.4
+
+  sirv@3.0.2:
+    dependencies:
+      '@polka/url': 1.0.0-next.29
+      mrmime: 2.0.1
+      totalist: 3.0.1
+
+  source-map-js@1.2.1: {}
+
+  space-separated-tokens@2.0.2: {}
+
+  stringify-entities@4.0.4:
+    dependencies:
+      character-entities-html4: 2.1.0
+      character-entities-legacy: 3.0.0
+
+  svelte-check@4.3.5(picomatch@4.0.3)(svelte@5.46.4)(typescript@5.9.3):
+    dependencies:
+      '@jridgewell/trace-mapping': 0.3.31
+      chokidar: 4.0.3
+      fdir: 6.5.0(picomatch@4.0.3)
+      picocolors: 1.1.1
+      sade: 1.8.1
+      svelte: 5.46.4
+      typescript: 5.9.3
+    transitivePeerDependencies:
+      - picomatch
+
+  svelte2tsx@0.7.46(svelte@5.46.4)(typescript@5.9.3):
+    dependencies:
+      dedent-js: 1.0.1
+      scule: 1.3.0
+      svelte: 5.46.4
+      typescript: 5.9.3
+
+  svelte@5.46.4:
+    dependencies:
+      '@jridgewell/remapping': 2.3.5
+      '@jridgewell/sourcemap-codec': 1.5.5
+      '@sveltejs/acorn-typescript': 1.0.8(acorn@8.15.0)
+      '@types/estree': 1.0.8
+      acorn: 8.15.0
+      aria-query: 5.3.2
+      axobject-query: 4.1.0
+      clsx: 2.1.1
+      devalue: 5.6.2
+      esm-env: 1.2.2
+      esrap: 2.2.1
+      is-reference: 3.0.3
+      locate-character: 3.0.0
+      magic-string: 0.30.21
+      zimmerframe: 1.1.4
+
+  tailwindcss@4.1.18: {}
+
+  tapable@2.3.0: {}
+
+  tinyglobby@0.2.15:
+    dependencies:
+      fdir: 6.5.0(picomatch@4.0.3)
+      picomatch: 4.0.3
+
+  tlds@1.261.0: {}
+
+  totalist@3.0.1: {}
+
+  trim-lines@3.0.1: {}
+
+  tslib@2.8.1: {}
+
+  typescript@5.9.3: {}
+
+  uint8arrays@3.0.0:
+    dependencies:
+      multiformats: 9.9.0
+
+  unicode-segmenter@0.14.5: {}
+
+  unist-util-is@6.0.1:
+    dependencies:
+      '@types/unist': 3.0.3
+
+  unist-util-position@5.0.0:
+    dependencies:
+      '@types/unist': 3.0.3
+
+  unist-util-stringify-position@4.0.0:
+    dependencies:
+      '@types/unist': 3.0.3
+
+  unist-util-visit-parents@6.0.2:
+    dependencies:
+      '@types/unist': 3.0.3
+      unist-util-is: 6.0.1
+
+  unist-util-visit@5.1.0:
+    dependencies:
+      '@types/unist': 3.0.3
+      unist-util-is: 6.0.1
+      unist-util-visit-parents: 6.0.2
+
+  util-deprecate@1.0.2: {}
+
+  vfile-message@4.0.3:
+    dependencies:
+      '@types/unist': 3.0.3
+      unist-util-stringify-position: 4.0.0
+
+  vfile@6.0.3:
+    dependencies:
+      '@types/unist': 3.0.3
+      vfile-message: 4.0.3
+
+  vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2):
+    dependencies:
+      esbuild: 0.27.2
+      fdir: 6.5.0(picomatch@4.0.3)
+      picomatch: 4.0.3
+      postcss: 8.5.6
+      rollup: 4.55.1
+      tinyglobby: 0.2.15
+    optionalDependencies:
+      fsevents: 2.3.3
+      jiti: 2.6.1
+      lightningcss: 1.30.2
+
+  vitefu@1.1.1(vite@7.3.1(jiti@2.6.1)(lightningcss@1.30.2)):
+    optionalDependencies:
+      vite: 7.3.1(jiti@2.6.1)(lightningcss@1.30.2)
+
+  zimmerframe@1.1.4: {}
+
+  zod@3.25.76: {}
+
+  zwitch@2.0.4: {}

packages/svelte-standard-site/pnpm-workspace.yaml

···
+onlyBuiltDependencies:
+  - esbuild

packages/svelte-standard-site/scripts/test-publisher.js

···
+/**
+ * Example script to test publishing to ATProto
+ *
+ * Usage:
+ *   ATPROTO_APP_PASSWORD="xxxx-xxxx-xxxx-xxxx" node scripts/test-publisher.js
+ *
+ * This script demonstrates:
+ * 1. Creating a publisher instance
+ * 2. Logging in
+ * 3. Publishing a publication
+ * 4. Publishing a document
+ * 5. Listing your content
+ */
+
+import { StandardSitePublisher } from '../src/lib/publisher.js';
+import { transformContent } from '../src/lib/utils/content.js';
+
+async function main() {
+	// Check for app password
+	if (!process.env.ATPROTO_APP_PASSWORD) {
+		console.error('Error: ATPROTO_APP_PASSWORD environment variable not set');
+		console.error('');
+		console.error('Get an app password at: https://bsky.app/settings/app-passwords');
+		console.error('');
+		console.error('Usage:');
+		console.error('  ATPROTO_APP_PASSWORD="xxxx-xxxx-xxxx-xxxx" node scripts/test-publisher.js');
+		process.exit(1);
+	}
+
+	console.log('🚀 Testing svelte-standard-site Publisher\n');
+
+	// Step 1: Create publisher
+	console.log('Step 1: Creating publisher instance...');
+	const publisher = new StandardSitePublisher({
+		identifier: process.env.ATPROTO_HANDLE || 'your-handle.bsky.social',
+		password: process.env.ATPROTO_APP_PASSWORD
+	});
+
+	// Step 2: Login
+	console.log('Step 2: Logging in...');
+	try {
+		await publisher.login();
+		console.log('✅ Logged in successfully');
+		console.log('   DID:', publisher.getDid());
+		console.log('   PDS:', publisher.getPdsUrl());
+	} catch (error) {
+		console.error('❌ Login failed:', error.message);
+		process.exit(1);
+	}
+
+	// Step 3: Create a publication
+	console.log('\nStep 3: Creating publication...');
+	try {
+		const pubResult = await publisher.publishPublication({
+			name: 'Test Blog',
+			url: 'https://example.com',
+			description: 'A test publication created by svelte-standard-site',
+			basicTheme: {
+				background: { r: 255, g: 250, b: 240 },
+				foreground: { r: 30, g: 30, b: 30 },
+				accent: { r: 74, g: 124, b: 155 },
+				accentForeground: { r: 255, g: 255, b: 255 }
+			}
+		});
+
+		console.log('✅ Publication created');
+		console.log('   URI:', pubResult.uri);
+		console.log('   CID:', pubResult.cid);
+		console.log('   Rkey:', pubResult.uri.split('/').pop());
+		console.log('');
+		console.log('   💡 Save the rkey for verification!');
+	} catch (error) {
+		console.error('❌ Failed to create publication:', error.message);
+	}
+
+	// Step 4: Transform and publish a document
+	console.log('\nStep 4: Publishing a test document...');
+
+	const sampleMarkdown = `
+# Test Blog Post
+
+This is a test blog post published using \`svelte-standard-site\`.
+
+## Features
+
+- **Markdown support** - Full markdown formatting
+- [Links](/about) are automatically resolved
+- Content is transformed for ATProto compatibility
+
+<div class="sidenote">
+  <span class="sidenote-label">Note</span>
+  <p>This sidenote will be converted to a markdown blockquote!</p>
+</div>
+
+## Code Example
+
+\`\`\`typescript
+import { StandardSitePublisher } from 'svelte-standard-site/publisher';
+
+const publisher = new StandardSitePublisher({
+  identifier: 'you.bsky.social',
+  password: process.env.ATPROTO_APP_PASSWORD!
+});
+
+await publisher.login();
+\`\`\`
+
+Pretty cool, right?
+  `.trim();
+
+	try {
+		// Transform the content
+		const transformed = transformContent(sampleMarkdown, {
+			baseUrl: 'https://example.com'
+		});
+
+		console.log('   Content stats:');
+		console.log('   - Word count:', transformed.wordCount);
+		console.log('   - Reading time:', transformed.readingTime, 'min');
+
+		// Publish the document
+		const docResult = await publisher.publishDocument({
+			site: 'https://example.com',
+			title: 'Test Blog Post from svelte-standard-site',
+			publishedAt: new Date().toISOString(),
+			path: '/posts/test-post',
+			description: 'A test document to verify publishing works',
+			tags: ['test', 'example', 'svelte-standard-site'],
+			content: {
+				$type: 'site.standard.content.markdown',
+				text: transformed.markdown,
+				version: '1.0'
+			},
+			textContent: transformed.textContent
+		});
+
+		console.log('\n✅ Document published');
+		console.log('   URI:', docResult.uri);
+		console.log('   CID:', docResult.cid);
+		console.log('   Rkey:', docResult.uri.split('/').pop());
+	} catch (error) {
+		console.error('❌ Failed to publish document:', error.message);
+	}
+
+	// Step 5: List all your content
+	console.log('\nStep 5: Listing your published content...');
+
+	try {
+		const [publications, documents] = await Promise.all([
+			publisher.listPublications(),
+			publisher.listDocuments()
+		]);
+
+		console.log(`\n📚 Publications (${publications.length}):`);
+		publications.forEach((pub, i) => {
+			console.log(`   ${i + 1}. ${pub.value.name}`);
+			console.log(`      URL: ${pub.value.url}`);
+			console.log(`      URI: ${pub.uri}`);
+		});
+
+		console.log(`\n📝 Documents (${documents.length}):`);
+		documents.forEach((doc, i) => {
+			console.log(`   ${i + 1}. ${doc.value.title}`);
+			console.log(`      Published: ${new Date(doc.value.publishedAt).toLocaleDateString()}`);
+			console.log(`      URI: ${doc.uri}`);
+		});
+	} catch (error) {
+		console.error('❌ Failed to list content:', error.message);
+	}
+
+	console.log('\n✨ Test complete!');
+	console.log('\nNext steps:');
+	console.log('1. View your content on pdsls.dev:');
+	console.log(`   https://pdsls.dev/at://${publisher.getDid()}/site.standard.publication`);
+	console.log(`   https://pdsls.dev/at://${publisher.getDid()}/site.standard.document`);
+	console.log('2. Set up verification with .well-known endpoints');
+	console.log('3. Add Comments component to your blog');
+	console.log('\nSee docs/ for more information!');
+}
+
+main().catch(console.error);

packages/svelte-standard-site/src/app.d.ts

···
+// See https://svelte.dev/docs/kit/types#app.d.ts
+// for information about these interfaces
+declare global {
+	namespace App {
+		// interface Error {}
+		// interface Locals {}
+		// interface PageData {}
+		// interface PageState {}
+		// interface Platform {}
+	}
+}
+
+export {};

packages/svelte-standard-site/src/app.html

···
+<!doctype html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8" />
+		<link rel="icon" href="%sveltekit.assets%/favicon.svg" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
+		%sveltekit.head%
+	</head>
+	<body data-sveltekit-preload-data="hover">
+		<div style="display: contents">%sveltekit.body%</div>
+	</body>
+</html>

packages/svelte-standard-site/src/lib/__tests__/content.test.ts

···
+/**
+ * Tests for content transformation utilities
+ */
+
+import { describe, it, expect } from 'vitest';
+import {
+	convertSidenotes,
+	resolveRelativeLinks,
+	stripToPlainText,
+	countWords,
+	calculateReadingTime,
+	transformContent
+} from '../utils/content.js';
+
+describe('convertSidenotes', () => {
+	it('converts simple sidenotes to blockquotes', () => {
+		const input = `
+Some text before.
+
+<div class="sidenote sidenote--tip">
+  <span class="sidenote-label">Tip</span>
+  <p>This is a helpful tip.</p>
+</div>
+
+Some text after.
+    `.trim();
+
+		const expected = `
+Some text before.
+
+> **Tip:** This is a helpful tip.
+
+Some text after.
+    `.trim();
+
+		expect(convertSidenotes(input)).toBe(expected);
+	});
+});
+
+describe('resolveRelativeLinks', () => {
+	it('converts relative links to absolute', () => {
+		const input = `
+[Link to about](/about)
+![Image](/images/photo.jpg)
+[External link](https://example.com) should stay the same
+    `.trim();
+
+		const expected = `
+[Link to about](https://myblog.com/about)
+![Image](https://myblog.com/images/photo.jpg)
+[External link](https://example.com) should stay the same
+    `.trim();
+
+		expect(resolveRelativeLinks(input, 'https://myblog.com')).toBe(expected);
+	});
+
+	it('handles trailing slash in base URL', () => {
+		const input = '[Link](/page)';
+		const expected = '[Link](https://myblog.com/page)';
+		expect(resolveRelativeLinks(input, 'https://myblog.com/')).toBe(expected);
+	});
+});
+
+describe('stripToPlainText', () => {
+	it('removes markdown formatting', () => {
+		const input = `
+# Heading
+
+This is **bold** and *italic* text.
+
+[Link text](https://example.com)
+
+\`code\`
+
+\`\`\`
+code block
+\`\`\`
+    `.trim();
+
+		const result = stripToPlainText(input);
+
+		expect(result).not.toContain('#');
+		expect(result).not.toContain('**');
+		expect(result).not.toContain('*');
+		expect(result).not.toContain('[');
+		expect(result).not.toContain(']');
+		expect(result).not.toContain('`');
+		expect(result).toContain('Heading');
+		expect(result).toContain('bold');
+		expect(result).toContain('italic');
+		expect(result).toContain('Link text');
+	});
+
+	it('removes images', () => {
+		const input = '![Alt text](/image.jpg)';
+		const result = stripToPlainText(input);
+		expect(result).toBe('');
+	});
+
+	it('preserves link text', () => {
+		const input = '[Click here](https://example.com)';
+		const result = stripToPlainText(input);
+		expect(result).toBe('Click here');
+	});
+});
+
+describe('countWords', () => {
+	it('counts words correctly', () => {
+		expect(countWords('Hello world')).toBe(2);
+		expect(countWords('One two three four five')).toBe(5);
+		expect(countWords('  Spaces   around   words  ')).toBe(3);
+		expect(countWords('')).toBe(0);
+	});
+});
+
+describe('calculateReadingTime', () => {
+	it('calculates reading time', () => {
+		expect(calculateReadingTime(200)).toBe(1); // 200 words = 1 minute
+		expect(calculateReadingTime(400)).toBe(2); // 400 words = 2 minutes
+		expect(calculateReadingTime(100)).toBe(1); // Always at least 1 minute
+		expect(calculateReadingTime(0)).toBe(1); // Always at least 1 minute
+	});
+});
+
+describe('transformContent', () => {
+	it('performs full transformation pipeline', () => {
+		const input = `
+# My Blog Post
+
+This is some **markdown** content with [relative links](/about).
+
+<div class="sidenote">
+  <span class="sidenote-label">Note</span>
+  <p>Important information</p>
+</div>
+    `.trim();
+
+		const result = transformContent(input, {
+			baseUrl: 'https://myblog.com'
+		});
+
+		// Should have transformed markdown
+		expect(result.markdown).toContain('(https://myblog.com/about)');
+		expect(result.markdown).toContain('> **Note:**');
+
+		// Should have plain text version
+		expect(result.textContent).not.toContain('[');
+		expect(result.textContent).not.toContain('**');
+		expect(result.textContent).toContain('markdown');
+
+		// Should have metadata
+		expect(result.wordCount).toBeGreaterThan(0);
+		expect(result.readingTime).toBeGreaterThan(0);
+	});
+});

packages/svelte-standard-site/src/lib/client.ts

···
+import type {
+	SiteStandardConfig,
+	Publication,
+	Document,
+	AtProtoRecord,
+	ResolvedIdentity
+} from './types.js';
+import { cache } from './utils/cache.js';
+import { resolveIdentity, withFallback, buildPdsBlobUrl } from './utils/agents.js';
+import { parseAtUri, atUriToHttps } from './utils/at-uri.js';
+
+/**
+ * Main client for interacting with site.standard.* records
+ */
+export class SiteStandardClient {
+	private config: Required<SiteStandardConfig>;
+	private pdsEndpoint: string | null = null;
+
+	constructor(config: SiteStandardConfig) {
+		this.config = {
+			did: config.did,
+			pds: config.pds ?? '',
+			cacheTTL: config.cacheTTL ?? 5 * 60 * 1000
+		};
+
+		// Set cache TTL
+		cache.setDefaultTTL(this.config.cacheTTL);
+	}
+
+	/**
+	 * Resolve and cache PDS endpoint
+	 */
+	private async resolvePDS(fetchFn?: typeof fetch): Promise<string> {
+		if (this.pdsEndpoint) return this.pdsEndpoint;
+
+		if (this.config.pds) {
+			this.pdsEndpoint = this.config.pds;
+			return this.pdsEndpoint;
+		}
+
+		const identity = await resolveIdentity(this.config.did, fetchFn);
+		this.pdsEndpoint = identity.pds;
+		return this.pdsEndpoint;
+	}
+
+	/**
+	 * Convert a blob object to a URL string
+	 */
+	private async getBlobUrl(blob: any, fetchFn?: typeof fetch): Promise<string | undefined> {
+		try {
+			const cid = blob?.ref?.$link || blob?.cid;
+			if (!cid) return undefined;
+
+			const pds = await this.resolvePDS(fetchFn);
+			return buildPdsBlobUrl(pds, this.config.did, cid);
+		} catch (error) {
+			console.warn('Failed to resolve blob URL:', error);
+			return undefined;
+		}
+	}
+
+	/**
+	 * Fetch a single publication by rkey
+	 * @param rkey - Record key for the publication
+	 * @param fetchFn - Optional fetch function for SSR
+	 * @returns Publication record or null if not found
+	 */
+	async fetchPublication(
+		rkey: string,
+		fetchFn?: typeof fetch
+	): Promise<AtProtoRecord<Publication> | null> {
+		const cacheKey = `publication:${this.config.did}:${rkey}`;
+		const cached = cache.get<AtProtoRecord<Publication>>(cacheKey);
+		if (cached) return cached;
+
+		try {
+			const result = await withFallback(
+				this.config.did,
+				async (agent) => {
+					const response = await agent.com.atproto.repo.getRecord({
+						repo: this.config.did,
+						collection: 'site.standard.publication',
+						rkey
+					});
+					return response.data;
+				},
+				fetchFn
+			);
+
+			if (!result || !result.value) return null;
+
+			const pubValue = result.value as any;
+
+			// Build the publication object with converted blob URLs
+			const record: AtProtoRecord<Publication> = {
+				uri: result.uri,
+				cid: result.cid || '',
+				value: {
+					$type: 'site.standard.publication',
+					url: pubValue.url,
+					name: pubValue.name,
+					icon: pubValue.icon ? await this.getBlobUrl(pubValue.icon, fetchFn) : undefined,
+					description: pubValue.description,
+					basicTheme: pubValue.basicTheme,
+					preferences: pubValue.preferences
+				}
+			};
+
+			cache.set(cacheKey, record);
+			return record;
+		} catch (error) {
+			console.error(`Failed to fetch publication ${rkey}:`, error);
+			return null;
+		}
+	}
+
+	/**
+	 * Fetch all publications for the configured DID
+	 * @param fetchFn - Optional fetch function for SSR
+	 * @returns Array of publication records
+	 */
+	async fetchAllPublications(fetchFn?: typeof fetch): Promise<AtProtoRecord<Publication>[]> {
+		const cacheKey = `publications:${this.config.did}:all`;
+		const cached = cache.get<AtProtoRecord<Publication>[]>(cacheKey);
+		if (cached) return cached;
+
+		try {
+			const allRecords: AtProtoRecord<Publication>[] = [];
+			let cursor: string | undefined;
+
+			do {
+				const records = await withFallback(
+					this.config.did,
+					async (agent) => {
+						const response = await agent.com.atproto.repo.listRecords({
+							repo: this.config.did,
+							collection: 'site.standard.publication',
+							limit: 100,
+							cursor
+						});
+						cursor = response.data.cursor;
+						return response.data.records;
+					},
+					fetchFn
+				);
+
+				// Convert each record with blob URLs
+				for (const record of records) {
+					const pubValue = record.value as any;
+					const pub: AtProtoRecord<Publication> = {
+						uri: record.uri,
+						cid: record.cid || '',
+						value: {
+							$type: 'site.standard.publication',
+							url: pubValue.url,
+							name: pubValue.name,
+							icon: pubValue.icon ? await this.getBlobUrl(pubValue.icon, fetchFn) : undefined,
+							description: pubValue.description,
+							basicTheme: pubValue.basicTheme,
+							preferences: pubValue.preferences
+						}
+					};
+					allRecords.push(pub);
+				}
+			} while (cursor);
+
+			cache.set(cacheKey, allRecords);
+			return allRecords;
+		} catch (error) {
+			console.error('Failed to fetch publications:', error);
+			return [];
+		}
+	}
+
+	/**
+	 * Fetch a single document by rkey
+	 * @param rkey - Record key for the document
+	 * @param fetchFn - Optional fetch function for SSR
+	 * @returns Document record or null if not found
+	 */
+	async fetchDocument(
+		rkey: string,
+		fetchFn?: typeof fetch
+	): Promise<AtProtoRecord<Document> | null> {
+		const cacheKey = `document:${this.config.did}:${rkey}`;
+		const cached = cache.get<AtProtoRecord<Document>>(cacheKey);
+		if (cached) return cached;
+
+		try {
+			const result = await withFallback(
+				this.config.did,
+				async (agent) => {
+					const response = await agent.com.atproto.repo.getRecord({
+						repo: this.config.did,
+						collection: 'site.standard.document',
+						rkey
+					});
+					return response.data;
+				},
+				fetchFn
+			);
+
+			if (!result || !result.value) return null;
+
+			const docValue = result.value as any;
+
+			// Build the document object with converted blob URLs
+			const record: AtProtoRecord<Document> = {
+				uri: result.uri,
+				cid: result.cid || '',
+				value: {
+					$type: 'site.standard.document',
+					site: docValue.site,
+					title: docValue.title,
+					path: docValue.path,
+					description: docValue.description,
+					coverImage: docValue.coverImage
+						? await this.getBlobUrl(docValue.coverImage, fetchFn)
+						: undefined,
+					content: docValue.content,
+					textContent: docValue.textContent,
+					bskyPostRef: docValue.bskyPostRef,
+					tags: docValue.tags,
+					publishedAt: docValue.publishedAt,
+					updatedAt: docValue.updatedAt
+				}
+			};
+
+			cache.set(cacheKey, record);
+			return record;
+		} catch (error) {
+			console.error(`Failed to fetch document ${rkey}:`, error);
+			return null;
+		}
+	}
+
+	/**
+	 * Fetch all documents for the configured DID
+	 * @param fetchFn - Optional fetch function for SSR
+	 * @returns Array of document records
+	 */
+	async fetchAllDocuments(fetchFn?: typeof fetch): Promise<AtProtoRecord<Document>[]> {
+		const cacheKey = `documents:${this.config.did}:all`;
+		const cached = cache.get<AtProtoRecord<Document>[]>(cacheKey);
+		if (cached) return cached;
+
+		try {
+			const allRecords: AtProtoRecord<Document>[] = [];
+			let cursor: string | undefined;
+
+			do {
+				const records = await withFallback(
+					this.config.did,
+					async (agent) => {
+						const response = await agent.com.atproto.repo.listRecords({
+							repo: this.config.did,
+							collection: 'site.standard.document',
+							limit: 100,
+							cursor
+						});
+						cursor = response.data.cursor;
+						return response.data.records;
+					},
+					fetchFn
+				);
+
+				// Convert each record with blob URLs
+				for (const record of records) {
+					const docValue = record.value as any;
+					const doc: AtProtoRecord<Document> = {
+						uri: record.uri,
+						cid: record.cid || '',
+						value: {
+							$type: 'site.standard.document',
+							site: docValue.site,
+							title: docValue.title,
+							path: docValue.path,
+							description: docValue.description,
+							coverImage: docValue.coverImage
+								? await this.getBlobUrl(docValue.coverImage, fetchFn)
+								: undefined,
+							content: docValue.content,
+							textContent: docValue.textContent,
+							bskyPostRef: docValue.bskyPostRef,
+							tags: docValue.tags,
+							publishedAt: docValue.publishedAt,
+							updatedAt: docValue.updatedAt
+						}
+					};
+					allRecords.push(doc);
+				}
+			} while (cursor);
+
+			// Sort by publishedAt, newest first
+			allRecords.sort(
+				(a, b) => new Date(b.value.publishedAt).getTime() - new Date(a.value.publishedAt).getTime()
+			);
+
+			cache.set(cacheKey, allRecords);
+			return allRecords;
+		} catch (error) {
+			console.error('Failed to fetch documents:', error);
+			return [];
+		}
+	}
+
+	/**
+	 * Fetch documents for a specific publication
+	 * @param publicationUri - AT URI of the publication
+	 * @param fetchFn - Optional fetch function for SSR
+	 * @returns Array of document records belonging to the publication
+	 */
+	async fetchDocumentsByPublication(
+		publicationUri: string,
+		fetchFn?: typeof fetch
+	): Promise<AtProtoRecord<Document>[]> {
+		const allDocs = await this.fetchAllDocuments(fetchFn);
+		return allDocs.filter((doc) => doc.value.site === publicationUri);
+	}
+
+	/**
+	 * Fetch a record by AT URI
+	 * @param atUri - Full AT URI (e.g., at://did:plc:xxx/site.standard.publication/rkey)
+	 * @param fetchFn - Optional fetch function for SSR
+	 * @returns Record or null if not found
+	 */
+	async fetchByAtUri<T = Publication | Document>(
+		atUri: string,
+		fetchFn?: typeof fetch
+	): Promise<AtProtoRecord<T> | null> {
+		const parsed = parseAtUri(atUri);
+		if (!parsed) {
+			console.error('Invalid AT URI:', atUri);
+			return null;
+		}
+
+		if (parsed.collection === 'site.standard.publication') {
+			return this.fetchPublication(parsed.rkey, fetchFn) as Promise<AtProtoRecord<T> | null>;
+		} else if (parsed.collection === 'site.standard.document') {
+			return this.fetchDocument(parsed.rkey, fetchFn) as Promise<AtProtoRecord<T> | null>;
+		}
+
+		return null;
+	}
+
+	/**
+	 * Clear all cached data
+	 */
+	clearCache(): void {
+		cache.clear();
+	}
+
+	/**
+	 * Get the resolved PDS endpoint
+	 */
+	async getPDS(fetchFn?: typeof fetch): Promise<string> {
+		return this.resolvePDS(fetchFn);
+	}
+}
+
+/**
+ * Create a new SiteStandardClient instance
+ * @param config - Configuration object
+ * @returns Configured client instance
+ */
+export function createClient(config: SiteStandardConfig): SiteStandardClient {
+	return new SiteStandardClient(config);
+}

packages/svelte-standard-site/src/lib/components/Comments.svelte

···
+<script lang="ts">
+	/**
+	 * Comments component for displaying Bluesky replies
+	 *
+	 * Fetches and displays threaded replies from Bluesky as comments on your blog.
+	 *
+	 * @example
+	 * ```svelte
+	 * <Comments
+	 *   bskyPostUri="at://did:plc:xxx/app.bsky.feed.post/abc123"
+	 *   canonicalUrl="https://yourblog.com/posts/my-post"
+	 *   maxDepth={3}
+	 * />
+	 * ```
+	 */
+
+	import { onMount } from 'svelte';
+	import { fetchComments, formatRelativeTime, type Comment } from '../utils/comments.js';
+	import { MessageSquare, ExternalLink, Heart } from '@lucide/svelte';
+
+	interface Props {
+		/** AT-URI of the Bluesky announcement post */
+		bskyPostUri: string;
+		/** Canonical URL of your blog post */
+		canonicalUrl: string;
+		/** Maximum nesting depth for replies (default: 3) */
+		maxDepth?: number;
+		/** Section title (default: "Comments") */
+		title?: string;
+		/** Show "Reply on Bluesky" link (default: true) */
+		showReplyLink?: boolean;
+		/** Additional CSS classes */
+		class?: string;
+	}
+
+	let {
+		bskyPostUri,
+		canonicalUrl,
+		maxDepth = 3,
+		title = 'Comments',
+		showReplyLink = true,
+		class: className = ''
+	}: Props = $props();
+
+	let comments = $state<Comment[]>([]);
+	let loading = $state(true);
+	let error = $state<string | null>(null);
+
+	// Convert AT-URI to HTTPS URL for the reply link
+	const bskyUrl = $derived.by(() => {
+		const match = bskyPostUri.match(/^at:\/\/([^/]+)\/app\.bsky\.feed\.post\/(.+)$/);
+		if (!match) return null;
+		const [, did, rkey] = match;
+		// We'll need to resolve the DID to a handle, but for now use DID
+		return `https://bsky.app/profile/${did}/post/${rkey}`;
+	});
+
+	onMount(async () => {
+		try {
+			comments = await fetchComments({
+				bskyPostUri,
+				canonicalUrl,
+				maxDepth
+			});
+		} catch (err) {
+			error = err instanceof Error ? err.message : 'Failed to load comments';
+			console.error('Failed to fetch comments:', err);
+		} finally {
+			loading = false;
+		}
+	});
+
+	function CommentItem(comment: Comment) {
+		const authorUrl = `https://bsky.app/profile/${comment.author.handle}`;
+		const postUrl = $derived.by(() => {
+			const match = comment.uri.match(/^at:\/\/([^/]+)\/app\.bsky\.feed\.post\/(.+)$/);
+			if (!match) return null;
+			return `https://bsky.app/profile/${comment.author.handle}/post/${match[2]}`;
+		});
+
+		return {
+			comment,
+			authorUrl,
+			postUrl
+		};
+	}
+</script>
+
+<section class="comments-section {className}">
+	<header class="mb-6">
+		<h2 class="text-ink-900 dark:text-ink-50 flex items-center gap-2 text-2xl font-bold">
+			<MessageSquare size={24} />
+			{title}
+		</h2>
+		{#if showReplyLink && bskyUrl}
+			<a
+				href={bskyUrl}
+				target="_blank"
+				rel="noopener noreferrer"
+				class="text-primary-600 hover:text-primary-700 dark:text-primary-400 dark:hover:text-primary-300 mt-2 inline-flex items-center gap-1 text-sm transition-colors"
+			>
+				Reply on Bluesky
+				<ExternalLink size={14} />
+			</a>
+		{/if}
+	</header>
+
+	{#if loading}
+		<div class="text-ink-600 dark:text-ink-400 py-8 text-center">
+			<div class="inline-block h-8 w-8 animate-spin rounded-full border-4 border-primary-600 border-t-transparent"></div>
+			<p class="mt-2">Loading comments...</p>
+		</div>
+	{:else if error}
+		<div class="border-canvas-200 bg-canvas-100 dark:border-canvas-700 dark:bg-canvas-800 rounded-lg border p-4">
+			<p class="text-ink-900 dark:text-ink-50 font-medium">Failed to load comments</p>
+			<p class="text-ink-600 dark:text-ink-400 mt-1 text-sm">{error}</p>
+		</div>
+	{:else if comments.length === 0}
+		<div class="text-ink-600 dark:text-ink-400 py-8 text-center">
+			<MessageSquare size={48} class="mx-auto mb-2 opacity-50" />
+			<p>No comments yet. Be the first to comment!</p>
+			{#if showReplyLink && bskyUrl}
+				<a
+					href={bskyUrl}
+					target="_blank"
+					rel="noopener noreferrer"
+					class="text-primary-600 hover:text-primary-700 dark:text-primary-400 dark:hover:text-primary-300 mt-2 inline-flex items-center gap-1 transition-colors"
+				>
+					Start the conversation on Bluesky
+					<ExternalLink size={14} />
+				</a>
+			{/if}
+		</div>
+	{:else}
+		<div class="space-y-4">
+			{#each comments as comment}
+				{@const item = CommentItem(comment)}
+				<article
+					class="border-canvas-200 bg-canvas-50 dark:border-canvas-700 dark:bg-canvas-900 rounded-lg border p-4"
+					style="margin-left: {comment.depth * 1.5}rem"
+				>
+					<header class="mb-2 flex items-start justify-between">
+						<div class="flex items-center gap-3">
+							{#if comment.author.avatar}
+								<img
+									src={comment.author.avatar}
+									alt={comment.author.displayName || comment.author.handle}
+									class="h-10 w-10 rounded-full"
+								/>
+							{:else}
+								<div class="bg-primary-200 dark:bg-primary-800 flex h-10 w-10 items-center justify-center rounded-full">
+									<span class="text-primary-900 dark:text-primary-100 text-sm font-bold">
+										{(comment.author.displayName || comment.author.handle)[0].toUpperCase()}
+									</span>
+								</div>
+							{/if}
+
+							<div>
+								<a
+									href={item.authorUrl}
+									target="_blank"
+									rel="noopener noreferrer"
+									class="text-ink-900 dark:text-ink-50 hover:text-primary-600 dark:hover:text-primary-400 font-medium transition-colors"
+								>
+									{comment.author.displayName || comment.author.handle}
+								</a>
+								<p class="text-ink-600 dark:text-ink-400 text-sm">@{comment.author.handle}</p>
+							</div>
+						</div>
+
+						<time class="text-ink-600 dark:text-ink-400 text-sm" datetime={comment.createdAt}>
+							{formatRelativeTime(comment.createdAt)}
+						</time>
+					</header>
+
+					<p class="text-ink-900 dark:text-ink-50 mb-3 whitespace-pre-wrap">{comment.text}</p>
+
+					<footer class="text-ink-600 dark:text-ink-400 flex items-center gap-4 text-sm">
+						{#if comment.likeCount > 0}
+							<span class="flex items-center gap-1">
+								<Heart size={14} />
+								{comment.likeCount}
+							</span>
+						{/if}
+
+						{#if item.postUrl}
+							<a
+								href={item.postUrl}
+								target="_blank"
+								rel="noopener noreferrer"
+								class="hover:text-primary-600 dark:hover:text-primary-400 flex items-center gap-1 transition-colors"
+							>
+								View on Bluesky
+								<ExternalLink size={12} />
+							</a>
+						{/if}
+					</footer>
+
+					{#if comment.replies && comment.replies.length > 0}
+						<div class="mt-4 space-y-4">
+							{#each comment.replies as reply}
+								{@const replyItem = CommentItem(reply)}
+								<article
+									class="border-canvas-200 bg-canvas-100 dark:border-canvas-600 dark:bg-canvas-800 rounded-lg border p-4"
+								>
+									<header class="mb-2 flex items-start justify-between">
+										<div class="flex items-center gap-3">
+											{#if reply.author.avatar}
+												<img
+													src={reply.author.avatar}
+													alt={reply.author.displayName || reply.author.handle}
+													class="h-8 w-8 rounded-full"
+												/>
+											{:else}
+												<div class="bg-primary-200 dark:bg-primary-800 flex h-8 w-8 items-center justify-center rounded-full">
+													<span class="text-primary-900 dark:text-primary-100 text-xs font-bold">
+														{(reply.author.displayName || reply.author.handle)[0].toUpperCase()}
+													</span>
+												</div>
+											{/if}
+
+											<div>
+												<a
+													href={replyItem.authorUrl}
+													target="_blank"
+													rel="noopener noreferrer"
+													class="text-ink-900 dark:text-ink-50 hover:text-primary-600 dark:hover:text-primary-400 text-sm font-medium transition-colors"
+												>
+													{reply.author.displayName || reply.author.handle}
+												</a>
+												<p class="text-ink-600 dark:text-ink-400 text-xs">@{reply.author.handle}</p>
+											</div>
+										</div>
+
+										<time class="text-ink-600 dark:text-ink-400 text-xs" datetime={reply.createdAt}>
+											{formatRelativeTime(reply.createdAt)}
+										</time>
+									</header>
+
+									<p class="text-ink-900 dark:text-ink-50 mb-2 whitespace-pre-wrap text-sm">{reply.text}</p>
+
+									<footer class="text-ink-600 dark:text-ink-400 flex items-center gap-4 text-xs">
+										{#if reply.likeCount > 0}
+											<span class="flex items-center gap-1">
+												<Heart size={12} />
+												{reply.likeCount}
+											</span>
+										{/if}
+
+										{#if replyItem.postUrl}
+											<a
+												href={replyItem.postUrl}
+												target="_blank"
+												rel="noopener noreferrer"
+												class="hover:text-primary-600 dark:hover:text-primary-400 flex items-center gap-1 transition-colors"
+											>
+												View on Bluesky
+												<ExternalLink size={10} />
+											</a>
+										{/if}
+									</footer>
+								</article>
+							{/each}
+						</div>
+					{/if}
+				</article>
+			{/each}
+		</div>
+	{/if}
+</section>
+
+<style>
+	.comments-section {
+		margin-top: 3rem;
+		margin-bottom: 3rem;
+	}
+</style>

packages/svelte-standard-site/src/lib/components/DocumentCard.svelte

···
+<script lang="ts">
+	import type { Document, Publication, AtProtoRecord } from '../types.js';
+	import { extractRkey } from '$lib/index.js';
+	import { ThemedCard, ThemedText, DateDisplay, TagList } from './index.js';
+
+	interface Props {
+		document: AtProtoRecord<Document>;
+		publication?: AtProtoRecord<Publication>;
+		class?: string;
+		showCover?: boolean;
+		href?: string;
+	}
+
+	const {
+		document,
+		publication,
+		class: className = '',
+		showCover = true,
+		href: customHref
+	}: Props = $props();
+
+	const value = $derived(document.value);
+	const hasTheme = $derived(!!publication?.value.basicTheme);
+
+	const pubRkey = $derived(extractRkey(value.site));
+	const docRkey = $derived(extractRkey(document.uri));
+	const href = $derived(customHref || `/${pubRkey}/${docRkey}`);
+</script>
+
+<ThemedCard
+	theme={publication?.value.basicTheme}
+	{href}
+	class="flex gap-6 duration-200 focus-within:shadow-md hover:shadow-md {className}"
+>
+	{#if showCover && value.coverImage}
+		<img
+			src={value.coverImage}
+			alt="{value.title} cover"
+			class="h-48 w-32 shrink-0 rounded-lg object-cover shadow-sm"
+		/>
+	{/if}
+
+	<div class="flex-1">
+		<ThemedText
+			{hasTheme}
+			element="h3"
+			class="group-hover:text-primary-600 dark:group-hover:text-primary-400 mb-2 text-2xl font-bold transition-colors"
+		>
+			{value.title}
+		</ThemedText>
+
+		{#if value.description}
+			<ThemedText
+				{hasTheme}
+				opacity={70}
+				element="p"
+				class="mb-4 line-clamp-3 text-sm leading-relaxed"
+			>
+				{value.description}
+			</ThemedText>
+		{/if}
+
+		<div class="mb-4 flex flex-wrap items-center gap-x-4 gap-y-2 text-sm">
+			<DateDisplay
+				date={value.publishedAt}
+				class="font-medium"
+				style={hasTheme
+					? `color: ${hasTheme ? 'color-mix(in srgb, var(--theme-foreground) 80%, transparent)' : ''}`
+					: ''}
+			/>
+			{#if value.updatedAt}
+				<span
+					class="flex items-center gap-1"
+					style:color={hasTheme
+						? 'color-mix(in srgb, var(--theme-foreground) 60%, transparent)'
+						: undefined}
+				>
+					<span
+						class="h-1 w-1 rounded-full"
+						class:bg-ink-400={!hasTheme}
+						class:dark:bg-ink-600={!hasTheme}
+						style:background-color={hasTheme
+							? 'color-mix(in srgb, var(--theme-foreground) 40%, transparent)'
+							: undefined}
+					></span>
+					Updated <DateDisplay date={value.updatedAt} />
+				</span>
+			{/if}
+		</div>
+
+		{#if value.tags && value.tags.length > 0}
+			<TagList tags={value.tags} {hasTheme} />
+		{/if}
+	</div>
+</ThemedCard>

packages/svelte-standard-site/src/lib/components/PublicationCard.svelte

···
+<script lang="ts">
+	import type { Publication, AtProtoRecord } from '../types.js';
+	import { ThemedCard, ThemedText } from './index.js';
+	import { ExternalLink } from '@lucide/svelte';
+
+	interface Props {
+		publication: AtProtoRecord<Publication>;
+		class?: string;
+		showExternalIcon?: boolean;
+	}
+
+	const { publication, class: className = '', showExternalIcon = true }: Props = $props();
+
+	const value = $derived(publication.value);
+	const hasTheme = $derived(!!value.basicTheme);
+</script>
+
+<ThemedCard theme={value.basicTheme} class="focus-within:shadow-lg hover:shadow-lg {className}">
+	<div class="mb-4 flex gap-4">
+		{#if value.icon}
+			<img
+				src={value.icon}
+				alt="{value.name} icon"
+				class="size-16 shrink-0 rounded-lg object-cover"
+			/>
+		{/if}
+		<div class="min-w-0 flex-1">
+			<ThemedText {hasTheme} element="h3" class="mb-2 text-xl font-semibold">
+				{value.name}
+			</ThemedText>
+			{#if value.description}
+				<ThemedText {hasTheme} opacity={70} element="p" class="text-sm">
+					{value.description}
+				</ThemedText>
+			{/if}
+		</div>
+	</div>
+	<a
+		href={value.url}
+		target="_blank"
+		rel="noopener noreferrer"
+		class="inline-flex items-center gap-2 font-medium transition-opacity hover:opacity-80 focus-visible:opacity-80 focus-visible:outline-2 focus-visible:outline-offset-2"
+		class:text-primary-600={!hasTheme}
+		class:dark:text-primary-400={!hasTheme}
+		class:focus-visible:outline-primary-600={!hasTheme}
+		style:color={hasTheme ? 'var(--theme-accent)' : undefined}
+		style:outline-color={hasTheme ? 'var(--theme-accent)' : undefined}
+	>
+		Visit Site
+		{#if showExternalIcon}
+			<ExternalLink class="size-4" aria-hidden="true" />
+		{/if}
+	</a>
+</ThemedCard>

packages/svelte-standard-site/src/lib/components/StandardSiteLayout.svelte

···
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import ThemeToggle from './ThemeToggle.svelte';
+
+	interface Props {
+		/** Site title */
+		title?: string;
+		/** Header slot for custom header content */
+		header?: Snippet;
+		/** Footer slot for custom footer content */
+		footer?: Snippet;
+		/** Main content */
+		children: Snippet;
+		/** Additional CSS classes for the main container */
+		class?: string;
+		/** Show theme toggle in default header */
+		showThemeToggle?: boolean;
+	}
+
+	let {
+		title = 'My Site',
+		header,
+		footer,
+		children,
+		class: className = '',
+		showThemeToggle = true
+	}: Props = $props();
+</script>
+
+<svelte:head>
+	<script>
+		// Prevent flash of unstyled content (FOUC) by applying theme before page renders
+		(function () {
+			const stored = localStorage.getItem('theme');
+			const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+			const isDark = stored === 'dark' || (!stored && prefersDark);
+			const htmlElement = document.documentElement;
+
+			if (isDark) {
+				htmlElement.classList.add('dark');
+				htmlElement.style.colorScheme = 'dark';
+			} else {
+				htmlElement.classList.remove('dark');
+				htmlElement.style.colorScheme = 'light';
+			}
+		})();
+	</script>
+</svelte:head>
+
+<div
+	class="bg-canvas-50 text-ink-900 dark:bg-canvas-950 dark:text-ink-50 flex min-h-screen flex-col overflow-x-hidden"
+>
+	{#if header}
+		{@render header()}
+	{:else}
+		<header
+			class="border-canvas-200 bg-canvas-50/90 dark:border-canvas-800 dark:bg-canvas-950/90 sticky top-0 z-50 w-full border-b backdrop-blur-md"
+		>
+			<nav
+				class="container mx-auto flex items-center justify-between px-4 py-4"
+				aria-label="Main navigation"
+			>
+				<a
+					href="/"
+					class="text-ink-900 hover:text-primary-600 focus-visible:text-primary-600 focus-visible:outline-primary-600 dark:text-ink-50 dark:hover:text-primary-400 dark:focus-visible:text-primary-400 text-xl font-bold transition-colors focus-visible:outline-2 focus-visible:outline-offset-2"
+				>
+					{title}
+				</a>
+
+				{#if showThemeToggle}
+					<ThemeToggle />
+				{/if}
+			</nav>
+		</header>
+	{/if}
+
+	<main id="main-content" class="container mx-auto grow px-4 py-8 {className}" tabindex="-1">
+		{@render children()}
+	</main>
+
+	{#if footer}
+		{@render footer()}
+	{:else}
+		<footer
+			class="border-canvas-200 bg-canvas-50 dark:border-canvas-800 dark:bg-canvas-950 mt-auto w-full border-t py-6"
+		>
+			<div class="text-ink-700 dark:text-ink-200 container mx-auto px-4 text-center text-sm">
+				<p>
+					&copy; {new Date().getFullYear()}
+					{title}. Powered by svelte-standard-site and the AT Protocol. Created by
+					<a
+						href="https://ewancroft.uk"
+						target="_blank"
+						rel="noopener noreferrer"
+						class="text-primary-600 hover:text-primary-700 focus-visible:outline-primary-600 dark:text-primary-400 dark:hover:text-primary-500 font-semibold transition focus-visible:outline-2 focus-visible:outline-offset-2"
+						>Ewan Croft</a
+					>.
+				</p>
+			</div>
+		</footer>
+	{/if}
+</div>

packages/svelte-standard-site/src/lib/components/ThemeToggle.svelte

···
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import { Sun, Moon } from '@lucide/svelte';
+	import { themeStore } from '../stores/index.js';
+
+	interface Props {
+		class?: string;
+	}
+
+	let { class: className = '' }: Props = $props();
+
+	let isDark = $state(false);
+	let mounted = $state(false);
+
+	onMount(() => {
+		themeStore.init();
+
+		const unsubscribe = themeStore.subscribe((state) => {
+			isDark = state.isDark;
+			mounted = state.mounted;
+		});
+
+		return unsubscribe;
+	});
+
+	function toggle() {
+		themeStore.toggle();
+	}
+</script>
+
+<button
+	onclick={toggle}
+	class="bg-canvas-200 text-ink-900 hover:bg-canvas-300 focus-visible:outline-primary-600 dark:bg-canvas-800 dark:text-ink-50 dark:hover:bg-canvas-700 relative flex h-10 w-10 items-center justify-center rounded-lg transition-all focus-visible:outline-2 focus-visible:outline-offset-2 {className}"
+	aria-label={isDark ? 'Switch to light mode' : 'Switch to dark mode'}
+	type="button"
+>
+	{#if mounted}
+		<div class="relative h-5 w-5">
+			<Sun
+				class="absolute inset-0 h-5 w-5 transition-all duration-300 {isDark
+					? 'scale-0 -rotate-90 opacity-0'
+					: 'scale-100 rotate-0 opacity-100'}"
+				aria-hidden="true"
+			/>
+			<Moon
+				class="absolute inset-0 h-5 w-5 transition-all duration-300 {isDark
+					? 'scale-100 rotate-0 opacity-100'
+					: 'scale-0 rotate-90 opacity-0'}"
+				aria-hidden="true"
+			/>
+		</div>
+	{:else}
+		<div class="bg-canvas-300 dark:bg-canvas-700 h-5 w-5 animate-pulse rounded"></div>
+	{/if}
+</button>

packages/svelte-standard-site/src/lib/components/common/DateDisplay.svelte

···
+<script lang="ts">
+	interface Props {
+		date: string;
+		label?: string;
+		class?: string;
+		showIcon?: boolean;
+		style?: string;
+		locale?: string;
+	}
+
+	let { date, label, class: className = '', showIcon = false, style, locale }: Props = $props();
+
+	function formatDate(dateString: string): string {
+		// Use browser's locale if not specified
+		const userLocale = locale || navigator.language || 'en-US';
+
+		return new Date(dateString).toLocaleDateString(userLocale, {
+			year: 'numeric',
+			month: 'long',
+			day: 'numeric'
+		});
+	}
+</script>
+
+<time datetime={date} class={className} {style}>
+	{#if showIcon}
+		<svg class="inline size-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+			<path
+				stroke-linecap="round"
+				stroke-linejoin="round"
+				stroke-width="2"
+				d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"
+			/>
+		</svg>
+	{/if}
+	{#if label}{label}{/if}
+	{formatDate(date)}
+</time>

packages/svelte-standard-site/src/lib/components/common/TagList.svelte

···
+<script lang="ts">
+	import { getThemedAccent } from '$lib/utils/theme-helpers.js';
+
+	interface Props {
+		tags: string[];
+		hasTheme?: boolean;
+		class?: string;
+	}
+
+	let { tags, hasTheme = false, class: className = '' }: Props = $props();
+
+	const accentStyles = $derived(getThemedAccent(hasTheme, 20));
+</script>
+
+{#if tags.length > 0}
+	<div class="flex flex-wrap gap-2 {className}">
+		{#each tags as tag}
+			<span
+				class="rounded-full px-4 py-2 text-sm font-medium transition-all hover:scale-105"
+				class:bg-primary-50={!hasTheme}
+				class:text-primary-700={!hasTheme}
+				class:dark:bg-primary-950={!hasTheme}
+				class:dark:text-primary-300={!hasTheme}
+				style:background-color={accentStyles.backgroundColor}
+				style:color={hasTheme ? accentStyles.color : undefined}
+			>
+				#{tag}
+			</span>
+		{/each}
+	</div>
+{/if}

packages/svelte-standard-site/src/lib/components/common/ThemedCard.svelte

···
+<script lang="ts">
+	import type { BasicTheme } from '$lib/types.js';
+	import { getThemeVars } from '$lib/utils/theme.js';
+	import { getThemedBorder } from '$lib/utils/theme-helpers.js';
+	import type { Snippet } from 'svelte';
+
+	interface Props {
+		theme?: BasicTheme;
+		children: Snippet;
+		class?: string;
+		href?: string;
+	}
+
+	let { theme, children, class: className = '', href }: Props = $props();
+
+	const themeVars = $derived(theme ? getThemeVars(theme) : {});
+	const hasTheme = $derived(!!theme);
+	const borderStyles = $derived(getThemedBorder(hasTheme));
+
+	const styles = $derived(
+		Object.entries(themeVars)
+			.map(([k, v]) => `${k}:${v}`)
+			.join(';')
+	);
+
+	const allStyles = $derived(() => {
+		const base = styles;
+		if (borderStyles.borderColor) {
+			return `${base};border-color:${borderStyles.borderColor}`;
+		}
+		return base;
+	});
+</script>
+
+{#if href}
+	<a {href} class="group block">
+		<article
+			class="rounded-lg border p-6 transition-all {className}"
+			class:bg-canvas-50={!hasTheme}
+			class:dark:bg-canvas-950={!hasTheme}
+			class:border-canvas-200={!hasTheme}
+			class:dark:border-canvas-800={!hasTheme}
+			class:hover:border-primary-300={!hasTheme}
+			class:dark:hover:border-primary-700={!hasTheme}
+			class:focus-within:border-primary-300={!hasTheme}
+			class:dark:focus-within:border-primary-700={!hasTheme}
+			style:background-color={hasTheme ? 'var(--theme-background)' : undefined}
+			style={allStyles()}
+		>
+			{@render children()}
+		</article>
+	</a>
+{:else}
+	<article
+		class="rounded-lg border p-6 transition-all {className}"
+		class:bg-canvas-50={!hasTheme}
+		class:dark:bg-canvas-950={!hasTheme}
+		class:border-canvas-200={!hasTheme}
+		class:dark:border-canvas-800={!hasTheme}
+		style:background-color={hasTheme ? 'var(--theme-background)' : undefined}
+		style={allStyles()}
+	>
+		{@render children()}
+	</article>
+{/if}

packages/svelte-standard-site/src/lib/components/common/ThemedContainer.svelte

···
+<script lang="ts">
+	import type { BasicTheme } from '$lib/types.js';
+	import { getThemeVars } from '$lib/utils/theme.js';
+	import type { Snippet } from 'svelte';
+
+	interface Props {
+		theme?: BasicTheme;
+		children: Snippet;
+		class?: string;
+		element?: 'div' | 'article' | 'section';
+	}
+
+	let { theme, children, class: className = '', element = 'div' }: Props = $props();
+
+	const themeVars = $derived(theme ? getThemeVars(theme) : {});
+	const hasTheme = $derived(!!theme);
+
+	const styles = $derived(
+		Object.entries(themeVars)
+			.map(([k, v]) => `${k}:${v}`)
+			.join(';')
+	);
+</script>
+
+{#if element === 'article'}
+	<article
+		class={className}
+		class:bg-canvas-50={!hasTheme}
+		class:dark:bg-canvas-950={!hasTheme}
+		style:background-color={hasTheme ? 'var(--theme-background)' : undefined}
+		style={styles}
+	>
+		{@render children()}
+	</article>
+{:else if element === 'section'}
+	<section
+		class={className}
+		class:bg-canvas-50={!hasTheme}
+		class:dark:bg-canvas-950={!hasTheme}
+		style:background-color={hasTheme ? 'var(--theme-background)' : undefined}
+		style={styles}
+	>
+		{@render children()}
+	</section>
+{:else}
+	<div
+		class={className}
+		class:bg-canvas-50={!hasTheme}
+		class:dark:bg-canvas-950={!hasTheme}
+		style:background-color={hasTheme ? 'var(--theme-background)' : undefined}
+		style={styles}
+	>
+		{@render children()}
+	</div>
+{/if}

packages/svelte-standard-site/src/lib/components/common/ThemedText.svelte

···
+<script lang="ts">
+	import { getThemedTextColor, getThemedAccent } from '$lib/utils/theme-helpers.js';
+
+	interface Props {
+		hasTheme?: boolean;
+		opacity?: number;
+		variant?: 'foreground' | 'accent';
+		element?: 'span' | 'p' | 'h1' | 'h2' | 'h3' | 'div';
+		class?: string;
+		children?: any;
+	}
+
+	let {
+		hasTheme = false,
+		opacity = 100,
+		variant = 'foreground',
+		element = 'span',
+		class: className = '',
+		children
+	}: Props = $props();
+
+	const colorStyles = $derived(
+		variant === 'accent' ? getThemedAccent(hasTheme) : getThemedTextColor(hasTheme, opacity)
+	);
+
+	// Default Tailwind classes when no theme
+	const defaultClasses = $derived(() => {
+		if (hasTheme) return '';
+
+		if (variant === 'accent') {
+			return 'text-primary-600 dark:text-primary-400';
+		}
+
+		switch (opacity) {
+			case 100:
+				return 'text-ink-900 dark:text-ink-50';
+			case 80:
+				return 'text-ink-800 dark:text-ink-100';
+			case 70:
+				return 'text-ink-700 dark:text-ink-200';
+			case 60:
+				return 'text-ink-600 dark:text-ink-400';
+			case 50:
+				return 'text-ink-500 dark:text-ink-500';
+			default:
+				return 'text-ink-700 dark:text-ink-200';
+		}
+	});
+</script>
+
+{#if element === 'p'}
+	<p class="{defaultClasses()} {className}" style:color={colorStyles.color}>
+		{@render children?.()}
+	</p>
+{:else if element === 'h1'}
+	<h1 class="{defaultClasses()} {className}" style:color={colorStyles.color}>
+		{@render children?.()}
+	</h1>
+{:else if element === 'h2'}
+	<h2 class="{defaultClasses()} {className}" style:color={colorStyles.color}>
+		{@render children?.()}
+	</h2>
+{:else if element === 'h3'}
+	<h3 class="{defaultClasses()} {className}" style:color={colorStyles.color}>
+		{@render children?.()}
+	</h3>
+{:else if element === 'div'}
+	<div class="{defaultClasses()} {className}" style:color={colorStyles.color}>
+		{@render children?.()}
+	</div>
+{:else}
+	<span class="{defaultClasses()} {className}" style:color={colorStyles.color}>
+		{@render children?.()}
+	</span>
+{/if}

packages/svelte-standard-site/src/lib/components/document/BlockRenderer.svelte

···
+<script lang="ts">
+	import TextBlock from './blocks/TextBlock.svelte';
+	import HeaderBlock from './blocks/HeaderBlock.svelte';
+	import BlockquoteBlock from './blocks/BlockquoteBlock.svelte';
+	import ImageBlock from './blocks/ImageBlock.svelte';
+	import CodeBlock from './blocks/CodeBlock.svelte';
+	import MathBlock from './blocks/MathBlock.svelte';
+	import UnorderedListBlock from './blocks/UnorderedListBlock.svelte';
+	import HorizontalRuleBlock from './blocks/HorizontalRuleBlock.svelte';
+	import IframeBlock from './blocks/IframeBlock.svelte';
+	import WebsiteBlock from './blocks/WebsiteBlock.svelte';
+	import ButtonBlock from './blocks/ButtonBlock.svelte';
+	import BskyPostBlock from './blocks/BskyPostBlock.svelte';
+	import PollBlock from './blocks/PollBlock.svelte';
+	import PageBlock from './blocks/PageBlock.svelte';
+
+	interface Props {
+		block: any;
+		hasTheme?: boolean;
+	}
+
+	const { block, hasTheme = false }: Props = $props();
+</script>
+
+{#if block.$type === 'pub.leaflet.blocks.text'}
+	<TextBlock {block} {hasTheme} />
+{:else if block.$type === 'pub.leaflet.blocks.header'}
+	<HeaderBlock {block} {hasTheme} />
+{:else if block.$type === 'pub.leaflet.blocks.blockquote'}
+	<BlockquoteBlock {block} {hasTheme} />
+{:else if block.$type === 'pub.leaflet.blocks.image'}
+	<ImageBlock {block} {hasTheme} />
+{:else if block.$type === 'pub.leaflet.blocks.code'}
+	<CodeBlock {block} {hasTheme} />
+{:else if block.$type === 'pub.leaflet.blocks.math'}
+	<MathBlock {block} {hasTheme} />
+{:else if block.$type === 'pub.leaflet.blocks.unorderedList'}
+	<UnorderedListBlock {block} {hasTheme} />
+{:else if block.$type === 'pub.leaflet.blocks.horizontalRule'}
+	<HorizontalRuleBlock {hasTheme} />
+{:else if block.$type === 'pub.leaflet.blocks.iframe'}
+	<IframeBlock {block} {hasTheme} />
+{:else if block.$type === 'pub.leaflet.blocks.website'}
+	<WebsiteBlock {block} {hasTheme} />
+{:else if block.$type === 'pub.leaflet.blocks.button'}
+	<ButtonBlock {block} {hasTheme} />
+{:else if block.$type === 'pub.leaflet.blocks.bskyPost'}
+	<BskyPostBlock {block} {hasTheme} />
+{:else if block.$type === 'pub.leaflet.blocks.poll'}
+	<PollBlock {block} {hasTheme} />
+{:else if block.$type === 'pub.leaflet.blocks.page'}
+	<PageBlock {block} {hasTheme} />
+{:else}
+	<!-- Unknown block type -->
+	<div class="my-2 rounded-lg border border-orange-500/20 bg-orange-500/5 p-3">
+		<p class="text-sm text-orange-600 dark:text-orange-400">
+			Unknown block type: <code class="font-mono text-xs">{block.$type}</code>
+		</p>
+		<details class="mt-2">
+			<summary class="cursor-pointer text-xs text-orange-600/70 dark:text-orange-400/70">
+				Show block data
+			</summary>
+			<pre class="mt-2 overflow-x-auto text-xs">{JSON.stringify(block, null, 2)}</pre>
+		</details>
+	</div>
+{/if}

packages/svelte-standard-site/src/lib/components/document/CanvasRenderer.svelte

···
+<script lang="ts">
+	import BlockRenderer from './BlockRenderer.svelte';
+
+	interface CanvasPage {
+		$type: 'pub.leaflet.pages.canvas';
+		id?: string;
+		blocks: Array<{
+			$type: 'pub.leaflet.pages.canvas#block';
+			block: any;
+			x: number;
+			y: number;
+			width: number;
+			height?: number;
+			rotation?: number;
+		}>;
+	}
+
+	interface Props {
+		page: CanvasPage;
+		hasTheme?: boolean;
+	}
+
+	const { page, hasTheme = false }: Props = $props();
+</script>
+
+<!-- Canvas layout uses absolute positioning -->
+<div class="relative min-h-screen w-full">
+	{#each page.blocks as blockWrapper, index}
+		<div
+			class="absolute"
+			style:left="{blockWrapper.x}px"
+			style:top="{blockWrapper.y}px"
+			style:width="{blockWrapper.width}px"
+			style:height={blockWrapper.height ? `${blockWrapper.height}px` : 'auto'}
+			style:transform={blockWrapper.rotation ? `rotate(${blockWrapper.rotation}deg)` : undefined}
+		>
+			<BlockRenderer block={blockWrapper.block} {hasTheme} />
+		</div>
+	{/each}
+</div>

packages/svelte-standard-site/src/lib/components/document/DocumentRenderer.svelte

···
+<script lang="ts">
+	import type { Document } from '$lib/types.js';
+	import LeafletContentRenderer from './LeafletContentRenderer.svelte';
+	import { mixThemeColor } from '$lib/utils/theme-helpers.js';
+
+	interface Props {
+		document: Document;
+		hasTheme?: boolean;
+	}
+
+	const { document, hasTheme = false }: Props = $props();
+
+	// Determine if we should render textContent or content
+	const shouldRenderTextContent = $derived(!!document.textContent);
+	const shouldRenderLeafletContent = $derived(
+		!document.textContent && document.content && document.content.$type === 'pub.leaflet.content'
+	);
+</script>
+
+<div
+	class="prose prose-lg max-w-none"
+	style:color={hasTheme ? 'var(--theme-foreground)' : undefined}
+>
+	{#if shouldRenderTextContent}
+		<!-- Simple text content with proper whitespace handling -->
+		<div class="leading-relaxed whitespace-pre-wrap">{document.textContent}</div>
+	{:else if shouldRenderLeafletContent}
+		<!-- Render the rich Leaflet content -->
+		<LeafletContentRenderer content={document.content} {hasTheme} />
+	{:else if document.content}
+		<!-- Fallback: show raw content for unknown types -->
+		<div
+			class="rounded-xl border p-6"
+			style:border-color={hasTheme ? mixThemeColor('--theme-foreground', 20) : undefined}
+			style:background-color={hasTheme ? mixThemeColor('--theme-foreground', 5) : undefined}
+		>
+			<p
+				class="mb-3 text-sm font-semibold tracking-wider uppercase"
+				style:color={hasTheme ? mixThemeColor('--theme-foreground', 60) : undefined}
+			>
+				Raw Content
+			</p>
+			<pre
+				class="overflow-x-auto text-xs leading-relaxed"
+				style:color={hasTheme ? 'var(--theme-foreground)' : undefined}>{JSON.stringify(
+					document.content,
+					null,
+					2
+				)}</pre>
+		</div>
+	{:else}
+		<!-- No content at all -->
+		<p class="italic opacity-50">No content available</p>
+	{/if}
+</div>

packages/svelte-standard-site/src/lib/components/document/InlineMath.svelte

···
+<script lang="ts">
+	import { onMount } from 'svelte';
+
+	interface Props {
+		tex: string;
+		hasTheme?: boolean;
+	}
+
+	const { tex, hasTheme = false }: Props = $props();
+
+	let mathContainer = $state<HTMLSpanElement>();
+	let renderError = $state<string | null>(null);
+
+	onMount(async () => {
+		try {
+			// Dynamically import KaTeX
+			const katex = await import('katex');
+			await import('katex/dist/katex.min.css');
+
+			if (mathContainer) {
+				katex.default.render(tex, mathContainer, {
+					displayMode: false, // Inline mode
+					throwOnError: false,
+					errorColor: '#ef4444',
+					trust: false
+				});
+			}
+		} catch (error) {
+			console.error('Failed to render inline LaTeX:', error);
+			renderError = error instanceof Error ? error.message : 'Failed to render LaTeX';
+		}
+	});
+</script>
+
+{#if renderError}
+	<span class="rounded bg-red-100 px-1 text-xs text-red-700 dark:bg-red-950/50 dark:text-red-400"
+		>Error: {tex}</span
+	>
+{:else}
+	<span bind:this={mathContainer} class="inline-block align-middle"></span>
+{/if}

packages/svelte-standard-site/src/lib/components/document/LeafletContentRenderer.svelte

···
+<script lang="ts">
+	import LinearDocumentRenderer from './LinearDocumentRenderer.svelte';
+	import CanvasRenderer from './CanvasRenderer.svelte';
+
+	interface LinearDocumentPage {
+		$type: 'pub.leaflet.pages.linearDocument';
+		id?: string;
+		blocks: Array<{
+			$type: 'pub.leaflet.pages.linearDocument#block';
+			block: any;
+			alignment?: string;
+		}>;
+	}
+
+	interface CanvasPage {
+		$type: 'pub.leaflet.pages.canvas';
+		id?: string;
+		blocks: Array<{
+			$type: 'pub.leaflet.pages.canvas#block';
+			block: any;
+			x: number;
+			y: number;
+			width: number;
+			height?: number;
+			rotation?: number;
+		}>;
+	}
+
+	type Page = LinearDocumentPage | CanvasPage;
+
+	interface LeafletContent {
+		$type: 'pub.leaflet.content';
+		pages: Page[];
+	}
+
+	interface Props {
+		content: LeafletContent;
+		hasTheme?: boolean;
+	}
+
+	const { content, hasTheme = false }: Props = $props();
+</script>
+
+{#if content.pages && content.pages.length > 0}
+	{#each content.pages as page, index}
+		{#if page.$type === 'pub.leaflet.pages.linearDocument'}
+			<LinearDocumentRenderer {page} {hasTheme} />
+		{:else if page.$type === 'pub.leaflet.pages.canvas'}
+			<CanvasRenderer {page} {hasTheme} />
+		{:else}
+			<!-- Unknown page type -->
+			<div class="my-4 rounded-lg border border-yellow-500/20 bg-yellow-500/5 p-4">
+				<p class="text-sm text-yellow-600 dark:text-yellow-400">
+					Unknown page type: <code class="font-mono text-xs"
+						>{(page as any).$type || 'unknown'}</code
+					>
+				</p>
+			</div>
+		{/if}
+	{/each}
+{:else}
+	<p class="italic opacity-50">No pages found in content</p>
+{/if}

packages/svelte-standard-site/src/lib/components/document/LinearDocumentRenderer.svelte

···
+<script lang="ts">
+	import BlockRenderer from './BlockRenderer.svelte';
+
+	interface LinearDocumentPage {
+		$type: 'pub.leaflet.pages.linearDocument';
+		id?: string;
+		blocks: Array<{
+			$type: 'pub.leaflet.pages.linearDocument#block';
+			block: any;
+			alignment?: string;
+		}>;
+	}
+
+	interface Props {
+		page: LinearDocumentPage;
+		hasTheme?: boolean;
+	}
+
+	const { page, hasTheme = false }: Props = $props();
+
+	function getAlignmentClass(alignment?: string): string {
+		if (!alignment) return '';
+		switch (alignment) {
+			case '#textAlignLeft':
+				return 'text-left';
+			case '#textAlignCenter':
+				return 'text-center';
+			case '#textAlignRight':
+				return 'text-right';
+			case '#textAlignJustify':
+				return 'text-justify';
+			default:
+				return '';
+		}
+	}
+</script>
+
+<div class="space-y-6">
+	{#each page.blocks as blockWrapper, index}
+		<div class={getAlignmentClass(blockWrapper.alignment)}>
+			<BlockRenderer block={blockWrapper.block} {hasTheme} />
+		</div>
+	{/each}
+</div>

packages/svelte-standard-site/src/lib/components/document/RichText.svelte

···
+<script lang="ts">
+	import InlineMath from './InlineMath.svelte';
+	import { UnicodeString } from '@atproto/api';
+
+	interface Facet {
+		index: {
+			byteStart: number;
+			byteEnd: number;
+		};
+		features: Array<{
+			$type: string;
+			[key: string]: any;
+		}>;
+	}
+
+	interface Props {
+		plaintext: string;
+		facets?: Facet[];
+		hasTheme?: boolean;
+	}
+
+	const { plaintext, facets = [], hasTheme = false }: Props = $props();
+
+	interface RichTextSegment {
+		text: string;
+		facet?: Array<{ $type: string; [key: string]: any }>;
+	}
+
+	class RichText {
+		unicodeText: UnicodeString;
+		facets: Facet[];
+
+		constructor(props: { text: string; facets: Facet[] }) {
+			this.unicodeText = new UnicodeString(props.text || '');
+			this.facets = props.facets || [];
+			if (this.facets) {
+				this.facets = this.facets
+					.filter((facet) => facet.index.byteStart <= facet.index.byteEnd)
+					.sort((a, b) => a.index.byteStart - b.index.byteStart);
+			}
+		}
+
+		*segments(): Generator<RichTextSegment, void, void> {
+			const facets = this.facets || [];
+			if (!facets.length) {
+				yield { text: this.unicodeText.utf16 || '' };
+				return;
+			}
+
+			let textCursor = 0;
+			let facetCursor = 0;
+			do {
+				const currFacet = facets[facetCursor];
+				if (textCursor < currFacet.index.byteStart) {
+					const sliced = this.unicodeText.slice(textCursor, currFacet.index.byteStart);
+					yield {
+						text: sliced || ''
+					};
+				} else if (textCursor > currFacet.index.byteStart) {
+					facetCursor++;
+					continue;
+				}
+				if (currFacet.index.byteStart < currFacet.index.byteEnd) {
+					const subtext = this.unicodeText.slice(
+						currFacet.index.byteStart,
+						currFacet.index.byteEnd
+					);
+					const subtextStr = subtext || '';
+					if (!subtextStr.trim()) {
+						// don't emit empty string entities
+						yield { text: subtextStr };
+					} else {
+						yield { text: subtextStr, facet: currFacet.features };
+					}
+				}
+				textCursor = currFacet.index.byteEnd;
+				facetCursor++;
+			} while (facetCursor < facets.length);
+			if (textCursor < this.unicodeText.length) {
+				const sliced = this.unicodeText.slice(textCursor, this.unicodeText.length);
+				yield {
+					text: sliced || ''
+				};
+			}
+		}
+	}
+
+	interface ProcessedSegment {
+		parts: Array<{ text: string; isBr: boolean }>;
+		isBold: boolean;
+		isItalic: boolean;
+		isUnderline: boolean;
+		isStrikethrough: boolean;
+		isCode: boolean;
+		isHighlighted: boolean;
+		isMath: boolean;
+		isDidMention: boolean;
+		isAtMention: boolean;
+		link?: string;
+		id?: string;
+		did?: string;
+		atURI?: string;
+	}
+
+	function processSegments(): ProcessedSegment[] {
+		// Handle undefined or empty plaintext
+		const text = plaintext || '';
+		const richText = new RichText({ text, facets });
+		const result: ProcessedSegment[] = [];
+
+		for (const segment of richText.segments()) {
+			const id = segment.facet?.find((f) => f.$type === 'pub.leaflet.richtext.facet#id');
+			const link = segment.facet?.find((f) => f.$type === 'pub.leaflet.richtext.facet#link');
+			const isBold = segment.facet?.some((f) => f.$type === 'pub.leaflet.richtext.facet#bold');
+			const isCode = segment.facet?.some((f) => f.$type === 'pub.leaflet.richtext.facet#code');
+			const isStrikethrough = segment.facet?.some(
+				(f) => f.$type === 'pub.leaflet.richtext.facet#strikethrough'
+			);
+			const isDidMention = segment.facet?.find(
+				(f) => f.$type === 'pub.leaflet.richtext.facet#didMention'
+			);
+			const isAtMention = segment.facet?.find(
+				(f) => f.$type === 'pub.leaflet.richtext.facet#atMention'
+			);
+			const isUnderline = segment.facet?.some(
+				(f) => f.$type === 'pub.leaflet.richtext.facet#underline'
+			);
+			const isItalic = segment.facet?.some((f) => f.$type === 'pub.leaflet.richtext.facet#italic');
+			const isHighlighted = segment.facet?.some(
+				(f) => f.$type === 'pub.leaflet.richtext.facet#highlight'
+			);
+			const isMath = segment.facet?.some((f) => f.$type === 'pub.leaflet.richtext.facet#math');
+
+			// Split text by newlines and mark br elements - handle undefined segment.text
+			const segmentText = segment.text || '';
+			const textParts = segmentText.split('\n');
+			const parts = textParts.flatMap((part, i) =>
+				i < textParts.length - 1
+					? [
+							{ text: part, isBr: false },
+							{ text: '', isBr: true }
+						]
+					: [{ text: part, isBr: false }]
+			);
+
+			result.push({
+				parts,
+				isBold: isBold || false,
+				isItalic: isItalic || false,
+				isUnderline: isUnderline || false,
+				isStrikethrough: isStrikethrough || false,
+				isCode: isCode || false,
+				isHighlighted: isHighlighted || false,
+				isMath: isMath || false,
+				isDidMention: !!isDidMention,
+				isAtMention: !!isAtMention,
+				link: link?.uri,
+				id: id?.id,
+				did: isDidMention?.did,
+				atURI: isAtMention?.atURI
+			});
+		}
+
+		return result;
+	}
+
+	const segments = $derived(processSegments());
+</script>
+
+{#each segments as segment, i}
+	{#each segment.parts as part, j}
+		{#if part.isBr}
+			<br />
+		{:else if segment.isMath}
+			<InlineMath tex={part.text} {hasTheme} />
+		{:else}
+			{@const classes = [
+				segment.isCode ? 'inline-code' : '',
+				segment.id ? 'scroll-mt-12 scroll-mb-10' : '',
+				segment.isBold ? 'font-bold' : '',
+				segment.isItalic ? 'italic' : '',
+				segment.isUnderline ? 'underline' : '',
+				segment.isStrikethrough ? 'line-through decoration-tertiary' : '',
+				segment.isHighlighted ? 'highlight' : ''
+			]
+				.filter(Boolean)
+				.join(' ')}
+
+			{#if segment.isCode}
+				<code class={classes} id={segment.id}>{part.text}</code>
+			{:else if segment.isDidMention}
+				<a
+					href={`https://leaflet.pub/p/${segment.did}`}
+					target="_blank"
+					rel="noopener noreferrer"
+					class="no-underline"
+				>
+					<span class="mention {classes}" class:themed={hasTheme}>{part.text}</span>
+				</a>
+			{:else if segment.isAtMention}
+				<a
+					href={segment.atURI}
+					target="_blank"
+					rel="noopener noreferrer"
+					class="hover:underline {classes}"
+					class:themed={hasTheme}
+				>
+					{part.text}
+				</a>
+			{:else if segment.link}
+				<a
+					href={segment.link.trim()}
+					class="hover:underline {classes}"
+					class:themed={hasTheme}
+					target="_blank"
+					rel="noopener noreferrer"
+				>
+					{part.text}
+				</a>
+			{:else}
+				<span class={classes} id={segment.id}>{part.text}</span>
+			{/if}
+		{/if}
+	{/each}
+{/each}
+
+<style>
+	.mention {
+		cursor: pointer;
+		color: rgb(0 0 225);
+		padding: 0 0.125rem;
+		border-radius: 0.25rem;
+		background-color: color-mix(in oklab, rgb(0 0 225), transparent 80%);
+		border: 1px solid transparent;
+		display: inline;
+		white-space: normal;
+	}
+
+	.mention.themed {
+		color: var(--theme-accent);
+		background-color: color-mix(in oklab, var(--theme-accent), transparent 80%);
+	}
+
+	a {
+		color: rgb(0 0 225);
+	}
+
+	a.themed {
+		color: var(--theme-accent);
+	}
+
+	.inline-code {
+		display: inline;
+		font-size: 1em;
+		background-color: color-mix(in oklab, currentColor, transparent 90%);
+		font-family: ui-monospace, monospace;
+		padding: 1px;
+		margin: -1px;
+		border-radius: 4px;
+		box-decoration-break: clone;
+		-webkit-box-decoration-break: clone;
+	}
+
+	.highlight {
+		padding: 1px;
+		margin: -1px;
+		border-radius: 4px;
+		box-decoration-break: clone;
+		-webkit-box-decoration-break: clone;
+		background-color: rgb(255, 177, 177);
+	}
+</style>

packages/svelte-standard-site/src/lib/components/document/blocks/BlockquoteBlock.svelte

···
+<script lang="ts">
+	import RichText from '../RichText.svelte';
+
+	interface Props {
+		block: {
+			plaintext: string;
+			facets?: any[];
+		};
+		hasTheme?: boolean;
+	}
+
+	const { block, hasTheme = false }: Props = $props();
+</script>
+
+<blockquote class="blockquote mt-1 mb-2" class:themed={hasTheme}>
+	<RichText plaintext={block.plaintext} facets={block.facets} {hasTheme} />
+</blockquote>
+
+<style>
+	.blockquote {
+		border-left: 2px solid rgb(107 114 128); /* Default gray color */
+		padding-left: 0.75rem;
+		margin-left: 0.5rem;
+	}
+
+	.blockquote.themed {
+		border-color: var(--theme-accent);
+	}
+</style>

packages/svelte-standard-site/src/lib/components/document/blocks/BskyPostBlock.svelte

···
+<script lang="ts">
+	import { onMount } from 'svelte';
+
+	interface Props {
+		block: {
+			postRef: {
+				uri: string;
+				cid: string;
+			};
+		};
+		hasTheme?: boolean;
+		postData?: any; // The full post data if already fetched
+	}
+
+	const { block, hasTheme = false, postData }: Props = $props();
+
+	let post = $state<any>(null);
+	let loading = $state(true);
+	let error = $state<string | null>(null);
+
+	// Extract post info from AT URI
+	function extractPostInfo(uri: string): { did: string; rkey: string } | null {
+		const match = uri.match(/^at:\/\/([^/]+)\/app\.bsky\.feed\.post\/(.+)$/);
+		if (!match) return null;
+		return { did: match[1], rkey: match[2] };
+	}
+
+	const postInfo = $derived(extractPostInfo(block.postRef.uri));
+	const postUrl = $derived(
+		postInfo ? `https://bsky.app/profile/${postInfo.did}/post/${postInfo.rkey}` : null
+	);
+
+	onMount(async () => {
+		// Use postData if provided
+		if (postData) {
+			post = postData;
+			loading = false;
+			return;
+		}
+
+		// You would fetch the post data here from your API or Bluesky API
+		// For now, we'll just show a simple link
+		loading = false;
+	});
+</script>
+
+{#if loading}
+	<div
+		class="relative my-2 flex w-full flex-col gap-2 overflow-hidden rounded-md border bg-white p-3 text-sm dark:bg-gray-900"
+		style:border-color={hasTheme ? 'var(--theme-accent)' : undefined}
+		class:border-gray-200={!hasTheme}
+		class:dark:border-gray-700={!hasTheme}
+	>
+		<div class="animate-pulse">
+			<div class="mb-2 h-8 w-8 rounded-full bg-gray-200 dark:bg-gray-700"></div>
+			<div class="mb-2 h-4 w-3/4 rounded bg-gray-200 dark:bg-gray-700"></div>
+			<div class="h-4 w-1/2 rounded bg-gray-200 dark:bg-gray-700"></div>
+		</div>
+	</div>
+{:else if error}
+	<div
+		class="relative my-2 flex w-full flex-col gap-2 overflow-hidden rounded-md border border-red-200 bg-red-50 p-3 text-sm dark:border-red-800 dark:bg-red-950"
+	>
+		<p class="text-red-600 dark:text-red-400">Failed to load Bluesky post: {error}</p>
+	</div>
+{:else if post && post.author && post.record}
+	<div
+		class="relative my-2 flex w-full flex-col gap-2 overflow-hidden rounded-md border bg-white p-3 text-sm dark:bg-gray-900"
+		style:border-color={hasTheme ? 'var(--theme-accent)' : undefined}
+		class:border-gray-200={!hasTheme}
+		class:dark:border-gray-700={!hasTheme}
+	>
+		<div class="flex w-full items-center gap-2">
+			{#if post.author.avatar}
+				<img
+					src={post.author.avatar}
+					alt="{post.author.displayName}'s avatar"
+					class="h-8 w-8 shrink-0 rounded-full border border-gray-200 dark:border-gray-700"
+				/>
+			{/if}
+			<div class="flex grow flex-col gap-0.5 leading-tight">
+				<div class="font-bold text-gray-900 dark:text-gray-100">
+					{post.author.displayName}
+				</div>
+				<a
+					href="https://bsky.app/profile/{post.author.handle}"
+					target="_blank"
+					rel="noopener noreferrer"
+					class="text-xs text-gray-600 hover:underline dark:text-gray-400"
+				>
+					@{post.author.handle}
+				</a>
+			</div>
+		</div>
+
+		<div class="flex flex-col gap-2">
+			{#if post.record.text}
+				<pre class="whitespace-pre-wrap text-gray-900 dark:text-gray-100">{post.record.text}</pre>
+			{/if}
+
+			{#if post.embed}
+				<div>
+					<!-- Embed rendering would go here -->
+					<div class="text-sm text-gray-600 italic dark:text-gray-400">[Embedded content]</div>
+				</div>
+			{/if}
+		</div>
+
+		<div class="flex w-full items-center justify-between gap-2 text-gray-600 dark:text-gray-400">
+			{#if post.record.createdAt}
+				<div class="text-xs">
+					{new Date(post.record.createdAt).toLocaleDateString('en-US', {
+						month: 'short',
+						day: 'numeric',
+						year: 'numeric',
+						hour: 'numeric',
+						minute: 'numeric',
+						hour12: true
+					})}
+				</div>
+			{/if}
+			<div class="flex items-center gap-2">
+				{#if post.replyCount != null && post.replyCount > 0}
+					<span class="flex items-center gap-1 text-xs">
+						<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+							<path
+								stroke-linecap="round"
+								stroke-linejoin="round"
+								stroke-width="2"
+								d="M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z"
+							/>
+						</svg>
+						{post.replyCount}
+					</span>
+				{/if}
+				{#if post.quoteCount != null && post.quoteCount > 0}
+					<span class="flex items-center gap-1 text-xs">
+						<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+							<path
+								stroke-linecap="round"
+								stroke-linejoin="round"
+								stroke-width="2"
+								d="M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z"
+							/>
+						</svg>
+						{post.quoteCount}
+					</span>
+				{/if}
+				<a
+					href={postUrl}
+					target="_blank"
+					rel="noopener noreferrer"
+					class="transition-opacity hover:opacity-70"
+					title="View on Bluesky"
+				>
+					<svg class="h-4 w-4" fill="currentColor" viewBox="0 0 24 24">
+						<path
+							d="M12 10.8c-1.087-2.114-4.046-6.053-6.798-7.995C2.566.944 1.561 1.266.902 1.565.139 1.908 0 3.08 0 3.768c0 .69.378 5.65.624 6.479.815 2.736 3.713 3.66 6.383 3.364.136-.02.275-.039.415-.056-.138.022-.276.04-.415.056-3.912.58-7.387 2.005-2.83 7.078 5.013 5.19 6.87-1.113 7.823-4.308.953 3.195 2.05 9.271 7.733 4.308 4.267-4.308 1.172-6.498-2.74-7.078a8.741 8.741 0 0 1-.415-.056c.14.017.279.036.415.056 2.67.297 5.568-.628 6.383-3.364.246-.828.624-5.79.624-6.478 0-.69-.139-1.861-.902-2.206-.659-.298-1.664-.62-4.3 1.24C16.046 4.748 13.087 8.687 12 10.8Z"
+						/>
+					</svg>
+				</a>
+			</div>
+		</div>
+	</div>
+{:else if postUrl}
+	<div
+		class="my-2 rounded-md border bg-white p-6 dark:bg-gray-900"
+		style:border-color={hasTheme ? 'var(--theme-accent)' : undefined}
+		class:border-gray-200={!hasTheme}
+		class:dark:border-gray-700={!hasTheme}
+	>
+		<div class="mb-3 flex items-center gap-2 text-sm font-medium">
+			<svg class="h-5 w-5" fill="currentColor" viewBox="0 0 24 24">
+				<path
+					d="M12 10.8c-1.087-2.114-4.046-6.053-6.798-7.995C2.566.944 1.561 1.266.902 1.565.139 1.908 0 3.08 0 3.768c0 .69.378 5.65.624 6.479.815 2.736 3.713 3.66 6.383 3.364.136-.02.275-.039.415-.056-.138.022-.276.04-.415.056-3.912.58-7.387 2.005-2.83 7.078 5.013 5.19 6.87-1.113 7.823-4.308.953 3.195 2.05 9.271 7.733 4.308 4.267-4.308 1.172-6.498-2.74-7.078a8.741 8.741 0 0 1-.415-.056c.14.017.279.036.415.056 2.67.297 5.568-.628 6.383-3.364.246-.828.624-5.79.624-6.478 0-.69-.139-1.861-.902-2.206-.659-.298-1.664-.62-4.3 1.24C16.046 4.748 13.087 8.687 12 10.8Z"
+				/>
+			</svg>
+			<span style:color={hasTheme ? 'var(--theme-accent)' : undefined}> Bluesky Post </span>
+		</div>
+		<a
+			href={postUrl}
+			target="_blank"
+			rel="noopener noreferrer"
+			class="inline-flex items-center gap-2 text-sm font-medium transition-all hover:gap-3"
+			style:color={hasTheme ? 'var(--theme-accent)' : undefined}
+		>
+			View on Bluesky
+			<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+				<path
+					stroke-linecap="round"
+					stroke-linejoin="round"
+					stroke-width="2"
+					d="M14 5l7 7m0 0l-7 7m7-7H3"
+				/>
+			</svg>
+		</a>
+	</div>
+{:else}
+	<div class="my-4 rounded-lg border border-yellow-500/20 bg-yellow-500/5 p-4">
+		<p class="text-sm text-yellow-600 dark:text-yellow-400">Invalid Bluesky post reference</p>
+	</div>
+{/if}

packages/svelte-standard-site/src/lib/components/document/blocks/ButtonBlock.svelte

···
+<script lang="ts">
+	interface Props {
+		block: {
+			text: string;
+			url: string;
+		};
+		hasTheme?: boolean;
+	}
+
+	const { block, hasTheme = false }: Props = $props();
+</script>
+
+<div class="my-2">
+	<a
+		href={block.url.trim()}
+		target="_blank"
+		rel="noopener noreferrer"
+		class="inline-block rounded-md px-6 py-3 font-semibold transition-all hover:opacity-90"
+		style:background-color={hasTheme ? 'var(--theme-accent)' : '#3b82f6'}
+		style:color="white"
+	>
+		{block.text}
+	</a>
+</div>

packages/svelte-standard-site/src/lib/components/document/blocks/CodeBlock.svelte

···
+<script lang="ts">
+	import { onMount } from 'svelte';
+
+	interface Props {
+		block: {
+			plaintext: string;
+			language?: string;
+			syntaxHighlightingTheme?: string;
+		};
+		hasTheme?: boolean;
+		prerenderedCode?: string;
+	}
+
+	const { block, hasTheme = false, prerenderedCode }: Props = $props();
+
+	let html = $state<string | null>(null);
+
+	onMount(async () => {
+		// Use prerendered code if available
+		if (prerenderedCode) {
+			html = prerenderedCode;
+			return;
+		}
+
+		try {
+			const { codeToHtml, bundledLanguagesInfo, bundledThemesInfo } = await import('shiki');
+
+			const lang =
+				bundledLanguagesInfo.find((l: any) => l.id === block.language)?.id || 'plaintext';
+			const theme =
+				bundledThemesInfo.find((t: any) => t.id === block.syntaxHighlightingTheme)?.id ||
+				'github-light';
+
+			html = await codeToHtml(block.plaintext, { lang, theme });
+		} catch (error) {
+			console.error('Failed to highlight code:', error);
+			// Fallback to plain text
+			html = `<pre><code>${block.plaintext}</code></pre>`;
+		}
+	});
+</script>
+
+{#if html}
+	<div
+		class="my-2 min-h-[42px] w-full rounded-md border"
+		style:border-color={hasTheme ? 'var(--theme-accent)' : undefined}
+		class:border-gray-200={!hasTheme}
+		class:dark:border-gray-700={!hasTheme}
+	>
+		{@html html}
+	</div>
+{:else}
+	<div
+		class="my-2 min-h-[42px] w-full rounded-md border"
+		style:border-color={hasTheme ? 'var(--theme-accent)' : undefined}
+		class:border-gray-200={!hasTheme}
+		class:dark:border-gray-700={!hasTheme}
+	>
+		<pre class="p-4"><code>{block.plaintext}</code></pre>
+	</div>
+{/if}
+
+<style>
+	:global(.shiki) {
+		padding: 1rem;
+		overflow-x: auto;
+	}
+</style>

packages/svelte-standard-site/src/lib/components/document/blocks/HeaderBlock.svelte

···
+<script lang="ts">
+	import RichText from '../RichText.svelte';
+
+	interface Props {
+		block: {
+			plaintext: string;
+			level?: number;
+			facets?: any[];
+		};
+		hasTheme?: boolean;
+	}
+
+	const { block, hasTheme = false }: Props = $props();
+
+	const level = $derived(block.level || 1);
+</script>
+
+{#if level === 1}
+	<h2 class="h1Block mt-1 mb-2">
+		<RichText plaintext={block.plaintext} facets={block.facets} {hasTheme} />
+	</h2>
+{:else if level === 2}
+	<h3 class="h2Block mt-1 mb-2">
+		<RichText plaintext={block.plaintext} facets={block.facets} {hasTheme} />
+	</h3>
+{:else if level === 3}
+	<h4 class="h3Block mt-1 mb-2">
+		<RichText plaintext={block.plaintext} facets={block.facets} {hasTheme} />
+	</h4>
+{:else}
+	<h6 class="h6Block mt-1 mb-2">
+		<RichText plaintext={block.plaintext} facets={block.facets} {hasTheme} />
+	</h6>
+{/if}
+
+<style>
+	.h1Block {
+		font-size: 2rem;
+		font-weight: bold;
+	}
+
+	.h2Block {
+		font-size: 1.625rem;
+		font-weight: bold;
+	}
+
+	.h3Block {
+		font-size: 1.125rem;
+		font-weight: bold;
+	}
+
+	.h6Block {
+		font-size: 1rem;
+		font-weight: bold;
+	}
+</style>

packages/svelte-standard-site/src/lib/components/document/blocks/HorizontalRuleBlock.svelte

···
+<script lang="ts">
+	interface Props {
+		hasTheme?: boolean;
+	}
+
+	const { hasTheme = false }: Props = $props();
+</script>
+
+<hr
+	class="my-2 border-t"
+	style:border-color={hasTheme ? 'var(--theme-accent)' : undefined}
+	class:border-gray-200={!hasTheme}
+	class:dark:border-gray-700={!hasTheme}
+/>

packages/svelte-standard-site/src/lib/components/document/blocks/IframeBlock.svelte

···
+<script lang="ts">
+	interface Props {
+		block: {
+			url: string;
+			height?: number;
+		};
+		hasTheme?: boolean;
+	}
+
+	const { block, hasTheme = false }: Props = $props();
+
+	const height = $derived(block.height || 360);
+</script>
+
+<div class="my-2 w-full">
+	<div
+		class="overflow-hidden rounded-md border"
+		style:border-color={hasTheme ? 'var(--theme-accent)' : undefined}
+		class:border-gray-200={!hasTheme}
+		class:dark:border-gray-700={!hasTheme}
+	>
+		<iframe
+			width="100%"
+			{height}
+			src={block.url}
+			allow="fullscreen"
+			loading="lazy"
+			title="Embedded content"
+			class="border-0"
+		></iframe>
+	</div>
+</div>

packages/svelte-standard-site/src/lib/components/document/blocks/ImageBlock.svelte

···
+<script lang="ts">
+	interface Props {
+		block: {
+			image: {
+				src: string;
+				height?: number;
+				width?: number;
+				fallback?: string;
+				local?: boolean;
+			};
+			alt?: string;
+		};
+		hasTheme?: boolean;
+	}
+
+	const { block, hasTheme = false }: Props = $props();
+
+	const imageSrc = $derived(block.image.fallback || block.image.src);
+	const altText = $derived(block.alt || '');
+</script>
+
+<div class="my-2 w-fit">
+	<img
+		src={imageSrc}
+		alt={altText}
+		loading="lazy"
+		decoding="async"
+		height={block.image.height}
+		width={block.image.width}
+		class="h-auto max-w-full"
+	/>
+	{#if altText}
+		<div class="mt-1 text-xs text-gray-600 italic dark:text-gray-400">
+			{altText}
+		</div>
+	{/if}
+</div>

packages/svelte-standard-site/src/lib/components/document/blocks/MathBlock.svelte

···
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import katex from 'katex';
+	import 'katex/dist/katex.min.css';
+
+	interface Props {
+		block: {
+			tex: string;
+		};
+		hasTheme?: boolean;
+	}
+
+	const { block, hasTheme = false }: Props = $props();
+
+	let html = $state('');
+
+	onMount(() => {
+		html = katex.renderToString(block.tex, {
+			displayMode: true,
+			output: 'html',
+			throwOnError: false
+		});
+	});
+</script>
+
+<div class="math-block my-2">
+	{@html html}
+</div>
+
+<style>
+	.math-block :global(.katex-display) {
+		margin: 0;
+	}
+</style>

packages/svelte-standard-site/src/lib/components/document/blocks/PageBlock.svelte

···
+<script lang="ts">
+	interface Props {
+		block: {
+			pageId: string;
+		};
+		hasTheme?: boolean;
+		pages?: any[]; // Array of page data if available
+	}
+
+	const { block, hasTheme = false, pages }: Props = $props();
+
+	// Find the referenced page
+	const referencedPage = $derived(pages?.find((p) => p.id === block.pageId));
+</script>
+
+{#if referencedPage}
+	<div
+		class="relative my-2 flex h-[104px] w-full overflow-clip rounded-md border bg-white dark:bg-gray-900"
+		style:border-color={hasTheme ? 'var(--theme-accent)' : undefined}
+		class:border-gray-200={!hasTheme}
+		class:dark:border-gray-700={!hasTheme}
+	>
+		<div class="flex h-full w-full overflow-clip">
+			<div class="my-2 ml-3 flex min-w-0 grow flex-col overflow-clip bg-transparent text-sm">
+				<div class="grow">
+					{#if referencedPage.title}
+						<div class="line-clamp-1 text-base font-bold">
+							{referencedPage.title}
+						</div>
+					{/if}
+					{#if referencedPage.description}
+						<div class="line-clamp-2 text-sm text-gray-600 dark:text-gray-400">
+							{referencedPage.description}
+						</div>
+					{/if}
+				</div>
+			</div>
+			<div
+				class="m-2 -mb-2 w-[120px] shrink-0 origin-center rotate-[4deg] rounded-t-md border border-gray-200 bg-gradient-to-br from-gray-50 to-gray-100 dark:border-gray-700 dark:from-gray-800 dark:to-gray-900"
+			></div>
+		</div>
+	</div>
+{:else}
+	<div
+		class="my-2 rounded-md border bg-white p-6 dark:bg-gray-900"
+		style:border-color={hasTheme ? 'var(--theme-accent)' : undefined}
+		class:border-gray-200={!hasTheme}
+		class:dark:border-gray-700={!hasTheme}
+	>
+		<div class="mb-3 flex items-center gap-2 text-sm font-medium">
+			<svg class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
+				<path
+					stroke-linecap="round"
+					stroke-linejoin="round"
+					d="M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z"
+				/>
+			</svg>
+			<span>Page Reference</span>
+		</div>
+		<p class="text-sm opacity-70">
+			Links to page: <code class="rounded bg-gray-100 px-1 py-0.5 text-xs dark:bg-gray-800"
+				>{block.pageId}</code
+			>
+		</p>
+	</div>
+{/if}

packages/svelte-standard-site/src/lib/components/document/blocks/PollBlock.svelte

···
+<script lang="ts">
+	interface PollOption {
+		text: string;
+	}
+
+	interface PollVote {
+		voter_did: string;
+		record: {
+			option: string[];
+		};
+	}
+
+	interface Props {
+		block: {
+			pollRef: {
+				uri: string;
+				cid: string;
+			};
+		};
+		pollData?: {
+			record: {
+				options: PollOption[];
+			};
+			atp_poll_votes: PollVote[];
+		};
+		hasTheme?: boolean;
+	}
+
+	const { block, pollData, hasTheme = false }: Props = $props();
+
+	const totalVotes = $derived(pollData?.atp_poll_votes.length || 0);
+
+	function getVoteOption(voteRecord: any): string | null {
+		try {
+			return voteRecord.option && voteRecord.option.length > 0 ? voteRecord.option[0] : null;
+		} catch {
+			return null;
+		}
+	}
+
+	function getVotesForOption(optionIndex: number): number {
+		if (!pollData) return 0;
+		return pollData.atp_poll_votes.filter((v) => getVoteOption(v.record) === optionIndex.toString())
+			.length;
+	}
+
+	function getHighestVotes(): number {
+		if (!pollData) return 0;
+		const options = pollData.record.options;
+		return Math.max(...options.map((_, i) => getVotesForOption(i)));
+	}
+</script>
+
+{#if !pollData}
+	<div
+		class="my-2 rounded-md border bg-white p-6 dark:bg-gray-900"
+		style:border-color={hasTheme ? 'var(--theme-accent)' : undefined}
+		class:border-gray-200={!hasTheme}
+		class:dark:border-gray-700={!hasTheme}
+	>
+		<div class="mb-3 flex items-center gap-2 text-sm font-medium">
+			<svg class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
+				<path
+					stroke-linecap="round"
+					stroke-linejoin="round"
+					d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01"
+				/>
+			</svg>
+			<span>Poll Reference</span>
+		</div>
+		<p class="text-sm opacity-70">
+			Poll: <code class="rounded bg-gray-100 px-1 py-0.5 text-xs dark:bg-gray-800"
+				>{block.pollRef.uri}</code
+			>
+		</p>
+	</div>
+{:else}
+	<div
+		class="poll my-2 flex w-full flex-col gap-2 rounded-md border p-3"
+		style:border-color={hasTheme ? 'var(--theme-accent)' : undefined}
+		style:background-color={hasTheme
+			? 'color-mix(in oklab, var(--theme-accent), white 85%)'
+			: '#f0f9ff'}
+		class:border-gray-200={!hasTheme}
+		class:dark:border-gray-700={!hasTheme}
+	>
+		<!-- Poll Results (Read-only) -->
+		{#each pollData.record.options as option, index}
+			{@const votes = getVotesForOption(index)}
+			{@const isWinner = totalVotes > 0 && votes === getHighestVotes()}
+			{@const percentage = totalVotes > 0 ? (votes / totalVotes) * 100 : 0}
+
+			<div
+				class="pollResult relative grow overflow-hidden rounded-md px-2 py-0.5 {isWinner
+					? 'border-2 border-blue-600 font-bold dark:border-blue-400'
+					: 'border border-blue-600 dark:border-blue-400'}"
+			>
+				<div
+					class="pollResultContent relative z-10 flex justify-between gap-2"
+					style="color: {hasTheme ? 'var(--theme-accent)' : '#1e40af'};"
+				>
+					<div class="max-w-full grow truncate">{option.text}</div>
+					<div class="tabular-nums">{votes}</div>
+				</div>
+				<div class="pollResultBG absolute top-0 right-0 bottom-0 left-0 z-0 flex w-full flex-row">
+					<div
+						class="m-0.5 rounded-[2px]"
+						style="background-color: {hasTheme
+							? 'var(--theme-accent)'
+							: '#3b82f6'}; width: {percentage}%; min-width: 4px;"
+					></div>
+					<div></div>
+				</div>
+			</div>
+		{/each}
+
+		<div class="pt-2 text-center text-sm text-gray-600 dark:text-gray-400">
+			{totalVotes}
+			{totalVotes === 1 ? 'vote' : 'votes'}
+		</div>
+	</div>
+{/if}

packages/svelte-standard-site/src/lib/components/document/blocks/TextBlock.svelte

···
+<script lang="ts">
+	import RichText from '../RichText.svelte';
+
+	interface Props {
+		block: {
+			plaintext: string;
+			facets?: any[];
+			textSize?: 'default' | 'small' | 'large';
+		};
+		hasTheme?: boolean;
+	}
+
+	const { block, hasTheme = false }: Props = $props();
+
+	const textSizeClass = $derived(
+		block.textSize === 'small'
+			? 'text-sm text-secondary'
+			: block.textSize === 'large'
+				? 'text-lg'
+				: ''
+	);
+</script>
+
+<p class="textBlock mt-1 mb-2 {textSizeClass}">
+	<RichText plaintext={block.plaintext} facets={block.facets} {hasTheme} />
+</p>

packages/svelte-standard-site/src/lib/components/document/blocks/UnorderedListBlock.svelte

···
+<script lang="ts">
+	import RichText from '../RichText.svelte';
+	import UnorderedListBlock from './UnorderedListBlock.svelte';
+
+	interface ListItem {
+		content?: {
+			plaintext: string;
+			facets?: any[];
+		};
+		children?: ListItem[];
+	}
+
+	interface Props {
+		block: {
+			children: ListItem[];
+		};
+		hasTheme?: boolean;
+	}
+
+	const { block, hasTheme = false }: Props = $props();
+</script>
+
+<ul class="unordered-list pb-2">
+	{#each block.children as item}
+		<li class="flex flex-row gap-2 pb-0">
+			<div
+				class="listMarker z-1 mx-2 mt-3.5 h-1.25 w-1.25 shrink-0"
+				class:has-content={item.content}
+				class:themed={hasTheme}
+			></div>
+
+			<div class="flex w-full flex-col">
+				{#if item.content}
+					<div class="textBlock mt-1 mb-2">
+						<RichText plaintext={item.content.plaintext} facets={item.content.facets} {hasTheme} />
+					</div>
+				{/if}
+				{#if item.children && item.children.length > 0}
+					<UnorderedListBlock block={{ children: item.children }} {hasTheme} />
+				{/if}
+			</div>
+		</li>
+	{/each}
+</ul>
+
+<style>
+	.unordered-list {
+		list-style: none;
+		padding-left: 0;
+		margin-left: -1px;
+	}
+
+	@media (min-width: 640px) {
+		.unordered-list {
+			margin-left: 9px;
+		}
+	}
+
+	.listMarker {
+		background-color: transparent;
+	}
+
+	.listMarker.has-content {
+		border-radius: 9999px;
+		background-color: rgb(107 114 128); /* Default gray color */
+	}
+
+	.listMarker.has-content.themed {
+		background-color: var(--theme-accent);
+	}
+</style>

packages/svelte-standard-site/src/lib/components/document/blocks/WebsiteBlock.svelte

···
+<script lang="ts">
+	interface Props {
+		block: {
+			url: string;
+			title?: string;
+			description?: string;
+			preview?: {
+				src: string;
+			};
+		};
+		hasTheme?: boolean;
+	}
+
+	const { block, hasTheme = false }: Props = $props();
+</script>
+
+<div
+	class="group/linkBlock relative my-2 flex h-[104px] overflow-hidden rounded-md border bg-white transition-colors dark:bg-gray-900"
+	style:border-color={hasTheme ? 'var(--theme-accent)' : undefined}
+	class:border-gray-200={!hasTheme}
+	class:hover:border-gray-300={!hasTheme}
+	class:dark:border-gray-700={!hasTheme}
+	class:dark:hover:border-gray-600={!hasTheme}
+>
+	<a
+		href={block.url}
+		target="_blank"
+		rel="noopener noreferrer"
+		class="flex h-full w-full text-inherit no-underline hover:no-underline"
+	>
+		<div class="min-w-0 grow px-3 pt-2 pb-2">
+			<div class="flex h-full w-full min-w-0 flex-col">
+				{#if block.title}
+					<div
+						class="mb-0.5 line-clamp-1 text-base font-bold"
+						style="overflow: hidden; text-overflow: ellipsis; word-break: break-all;"
+					>
+						{block.title}
+					</div>
+				{/if}
+
+				{#if block.description}
+					<div class="line-clamp-2 grow text-sm text-gray-600 dark:text-gray-400">
+						{block.description}
+					</div>
+				{/if}
+
+				<div
+					class="line-clamp-1 w-full min-w-0 text-xs text-gray-500 italic group-hover/linkBlock:text-blue-600 dark:text-gray-500 dark:group-hover/linkBlock:text-blue-400"
+					style="word-break: break-word;"
+					style:color={hasTheme ? 'var(--theme-accent)' : undefined}
+				>
+					{block.url}
+				</div>
+			</div>
+		</div>
+
+		{#if block.preview?.src}
+			<div
+				class="m-2 -mb-2 w-[120px] shrink-0 origin-center rotate-[4deg] rounded-t-md border border-gray-200 bg-cover dark:border-gray-700"
+				style:background-image="url({block.preview.src})"
+				style:background-position="center"
+			></div>
+		{/if}
+	</a>
+</div>

packages/svelte-standard-site/src/lib/components/index.ts

···
+export { default as DocumentCard } from './DocumentCard.svelte';
+export { default as PublicationCard } from './PublicationCard.svelte';
+export { default as ThemeToggle } from './ThemeToggle.svelte';
+export { default as StandardSiteLayout } from './StandardSiteLayout.svelte';
+
+// Common reusable components
+export { default as DateDisplay } from './common/DateDisplay.svelte';
+export { default as TagList } from './common/TagList.svelte';
+export { default as ThemedContainer } from './common/ThemedContainer.svelte';
+export { default as ThemedText } from './common/ThemedText.svelte';
+export { default as ThemedCard } from './common/ThemedCard.svelte';
+
+// Document rendering
+export { default as DocumentRenderer } from './document/DocumentRenderer.svelte';

packages/svelte-standard-site/src/lib/config/env.ts

···
+import { env } from '$env/dynamic/public';
+import type { SiteStandardConfig } from '../types.js';
+
+/**
+ * Get configuration from environment variables
+ * @returns Configuration object or null if required vars are missing
+ */
+export function getConfigFromEnv(): SiteStandardConfig | null {
+	const did = env.PUBLIC_ATPROTO_DID;
+
+	if (!did) {
+		console.error('Missing required environment variable: PUBLIC_ATPROTO_DID');
+		return null;
+	}
+
+	return {
+		did,
+		pds: env.PUBLIC_ATPROTO_PDS || undefined,
+		cacheTTL: env.PUBLIC_CACHE_TTL ? parseInt(env.PUBLIC_CACHE_TTL) : undefined
+	};
+}
+
+/**
+ * Validate that required environment variables are set
+ * @throws Error if required variables are missing
+ */
+export function validateEnv(): void {
+	if (!env.PUBLIC_ATPROTO_DID) {
+		throw new Error('Missing required environment variable: PUBLIC_ATPROTO_DID');
+	}
+}

packages/svelte-standard-site/src/lib/index.ts

···
+// Main exports
+export { SiteStandardClient, createClient } from './client.js';
+export { StandardSitePublisher } from './publisher.js';
+
+// Component exports
+export {
+	DocumentCard,
+	PublicationCard,
+	ThemeToggle,
+	StandardSiteLayout,
+	DateDisplay,
+	TagList,
+	ThemedContainer,
+	ThemedText,
+	ThemedCard
+} from './components/index.js';
+
+// Comments component
+export { default as Comments } from './components/Comments.svelte';
+
+// Store exports
+export { themeStore } from './stores/index.js';
+
+// Type exports
+export type {
+	AtProtoBlob,
+	StrongRef,
+	RGBColor,
+	BasicTheme,
+	PublicationPreferences,
+	Publication,
+	Document,
+	AtProtoRecord,
+	ResolvedIdentity,
+	SiteStandardConfig
+} from './types.js';
+
+// Schema exports
+export type {
+	PublisherConfig,
+	ReaderConfig,
+	LoaderConfig
+} from './schemas.js';
+
+export { COLLECTIONS } from './schemas.js';
+
+// Utility exports
+export { parseAtUri, atUriToHttps, buildAtUri, extractRkey, isAtUri } from './utils/at-uri.js';
+
+export { resolveIdentity, buildPdsBlobUrl } from './utils/agents.js';
+
+export { cache } from './utils/cache.js';
+
+export { rgbToCSS, rgbToHex, getThemeVars } from './utils/theme.js';
+
+export {
+	mixThemeColor,
+	getThemedTextColor,
+	getThemedBackground,
+	getThemedBorder,
+	getThemedAccent,
+	themeToCssVars
+} from './utils/theme-helpers.js';
+
+export {
+	getDocumentSlug,
+	getDocumentUrl,
+	extractRkey as extractRkeyFromUri
+} from './utils/document.js';
+
+// Content transformation exports
+export {
+	transformContent,
+	convertSidenotes,
+	convertComplexSidenotes,
+	resolveRelativeLinks,
+	stripToPlainText,
+	countWords,
+	calculateReadingTime
+} from './utils/content.js';
+
+export type { TransformOptions, TransformResult } from './utils/content.js';
+
+// Comments exports
+export { fetchComments, fetchMentionComments, formatRelativeTime } from './utils/comments.js';
+
+export type { Comment, CommentAuthor, FetchCommentsOptions } from './utils/comments.js';
+
+// Verification exports
+export {
+	generatePublicationWellKnown,
+	generateDocumentLinkTag,
+	generatePublicationLinkTag,
+	getDocumentAtUri,
+	getPublicationAtUri,
+	verifyPublicationWellKnown,
+	extractDocumentLinkFromHtml,
+	extractPublicationLinkFromHtml
+} from './utils/verification.js';
+
+// Publisher types
+export type { PublishDocumentInput, PublishPublicationInput, PublishResult } from './publisher.js';

packages/svelte-standard-site/src/lib/publisher.ts

···
+/**
+ * Publisher for standard.site documents
+ *
+ * Publishes documents to ATProto repositories using the standard.site lexicon,
+ * enabling your SvelteKit site to sync content to Leaflet, WhiteWind, or any
+ * compatible platform.
+ *
+ * The publisher automatically resolves the correct PDS from your DID document,
+ * so it works with any PDS (bsky.app, Blacksky, self-hosted, etc.).
+ *
+ * @example
+ * ```ts
+ * import { StandardSitePublisher } from 'svelte-standard-site/publisher';
+ *
+ * const publisher = new StandardSitePublisher({
+ *   identifier: 'your-handle.bsky.social',
+ *   password: process.env.ATPROTO_APP_PASSWORD!,
+ * });
+ *
+ * await publisher.login();
+ *
+ * await publisher.publishDocument({
+ *   site: 'https://myblog.com',
+ *   title: 'My Blog Post',
+ *   publishedAt: new Date().toISOString(),
+ * });
+ * ```
+ */
+
+import { AtpAgent } from '@atproto/api';
+import type { PublisherConfig, Document, Publication } from './schemas.js';
+import { PublisherConfigSchema, COLLECTIONS } from './schemas.js';
+
+/**
+ * Resolve a handle to a DID using the public API
+ */
+async function resolveHandle(handle: string): Promise<string> {
+	const res = await fetch(
+		`https://public.api.bsky.app/xrpc/com.atproto.identity.resolveHandle?handle=${encodeURIComponent(handle)}`
+	);
+	if (!res.ok) throw new Error(`Failed to resolve handle: ${handle}`);
+	const data = (await res.json()) as { did: string };
+	return data.did;
+}
+
+/**
+ * Get the PDS endpoint from a DID document
+ */
+async function getPdsFromDid(did: string): Promise<string> {
+	let didDoc: any;
+
+	if (did.startsWith('did:plc:')) {
+		// Resolve from plc.directory
+		const res = await fetch(`https://plc.directory/${did}`);
+		if (!res.ok) throw new Error(`Failed to resolve DID: ${did}`);
+		didDoc = await res.json();
+	} else if (did.startsWith('did:web:')) {
+		// Resolve from the domain
+		const domain = did.replace('did:web:', '');
+		const res = await fetch(`https://${domain}/.well-known/did.json`);
+		if (!res.ok) throw new Error(`Failed to resolve DID: ${did}`);
+		didDoc = await res.json();
+	} else {
+		throw new Error(`Unsupported DID method: ${did}`);
+	}
+
+	// Find the AtprotoPersonalDataServer service
+	const pdsService = didDoc.service?.find(
+		(s: any) => s.type === 'AtprotoPersonalDataServer' || s.id === '#atproto_pds'
+	);
+
+	if (!pdsService?.serviceEndpoint) {
+		throw new Error(`No PDS found in DID document for ${did}`);
+	}
+
+	return pdsService.serviceEndpoint;
+}
+
+/**
+ * Generate a TID (Timestamp Identifier) per ATProto spec
+ * @see https://atproto.com/specs/tid
+ *
+ * Structure:
+ * - 64-bit integer, big-endian
+ * - Top bit always 0
+ * - Next 53 bits: microseconds since UNIX epoch
+ * - Final 10 bits: random clock identifier
+ * - Encoded as base32-sortable (chars: 234567abcdefghijklmnopqrstuvwxyz)
+ * - Always 13 characters
+ */
+const BASE32_SORTABLE = '234567abcdefghijklmnopqrstuvwxyz';
+
+function generateTid(): string {
+	const now = Date.now() * 1000; // Convert to microseconds
+	const clockId = Math.floor(Math.random() * 1024); // 10 bits
+
+	// Combine: (timestamp << 10) | clockId
+	// Ensure top bit is 0 by masking with 0x7FFFFFFFFFFFFFFF
+	const tid = ((BigInt(now) << 10n) | BigInt(clockId)) & 0x7fffffffffffffffn;
+
+	// Encode as base32-sortable
+	let encoded = '';
+	let remaining = tid;
+	for (let i = 0; i < 13; i++) {
+		const index = Number(remaining & 31n);
+		encoded = BASE32_SORTABLE[index] + encoded;
+		remaining = remaining >> 5n;
+	}
+
+	return encoded;
+}
+
+export interface PublishDocumentInput {
+	/** Site/publication URI (https or at-uri) - REQUIRED */
+	site: string;
+	/** Document title - REQUIRED */
+	title: string;
+	/** When the document was published (ISO 8601) - REQUIRED */
+	publishedAt: string;
+	/** Path to combine with site URL */
+	path?: string;
+	/** Document description/excerpt */
+	description?: string;
+	/** When the document was last updated (ISO 8601) */
+	updatedAt?: string;
+	/** Tags/categories */
+	tags?: string[];
+	/** Plain text content for indexing */
+	textContent?: string;
+	/** Platform-specific content */
+	content?: unknown;
+	/** Reference to associated Bluesky post */
+	bskyPostRef?: { uri: string; cid: string };
+	/** Cover image blob */
+	coverImage?: {
+		$type: 'blob';
+		ref: { $link: string };
+		mimeType: string;
+		size: number;
+	};
+}
+
+export interface PublishPublicationInput {
+	/** Publication name */
+	name: string;
+	/** Base URL */
+	url: string;
+	/** Description */
+	description?: string;
+	/** Icon blob */
+	icon?: {
+		$type: 'blob';
+		ref: { $link: string };
+		mimeType: string;
+		size: number;
+	};
+	/** Basic theme colors */
+	basicTheme?: {
+		background: { r: number; g: number; b: number };
+		foreground: { r: number; g: number; b: number };
+		accent: { r: number; g: number; b: number };
+		accentForeground: { r: number; g: number; b: number };
+	};
+	/** Publication preferences */
+	preferences?: {
+		showInDiscover?: boolean;
+	};
+}
+
+export interface PublishResult {
+	uri: string;
+	cid: string;
+}
+
+/**
+ * Publisher for standard.site documents on ATProto
+ */
+export class StandardSitePublisher {
+	private agent: AtpAgent | null = null;
+	private config: PublisherConfig;
+	private did: string | null = null;
+	private pdsUrl: string | null = null;
+
+	constructor(config: Partial<PublisherConfig>) {
+		this.config = PublisherConfigSchema.parse(config);
+	}
+
+	/**
+	 * Authenticate with the PDS
+	 * Automatically resolves the correct PDS from the DID document
+	 */
+	async login(): Promise<void> {
+		// Resolve handle to DID if needed
+		let did = this.config.identifier;
+		if (!did.startsWith('did:')) {
+			did = await resolveHandle(this.config.identifier);
+		}
+		this.did = did;
+
+		// Get PDS URL from DID document (unless manually overridden)
+		if (this.config.service) {
+			this.pdsUrl = this.config.service;
+		} else {
+			this.pdsUrl = await getPdsFromDid(did);
+		}
+
+		// Create agent and login
+		this.agent = new AtpAgent({ service: this.pdsUrl });
+		await this.agent.login({
+			identifier: this.config.identifier,
+			password: this.config.password
+		});
+	}
+
+	/**
+	 * Get the authenticated DID
+	 */
+	getDid(): string {
+		if (!this.did) {
+			throw new Error('Not logged in. Call login() first.');
+		}
+		return this.did;
+	}
+
+	/**
+	 * Get the PDS URL being used
+	 */
+	getPdsUrl(): string {
+		if (!this.pdsUrl) {
+			throw new Error('Not logged in. Call login() first.');
+		}
+		return this.pdsUrl;
+	}
+
+	private getAgent(): AtpAgent {
+		if (!this.agent) {
+			throw new Error('Not logged in. Call login() first.');
+		}
+		return this.agent;
+	}
+
+	/**
+	 * Publish a document record
+	 */
+	async publishDocument(input: PublishDocumentInput): Promise<PublishResult> {
+		const did = this.getDid();
+		const agent = this.getAgent();
+
+		const record: Document = {
+			$type: 'site.standard.document',
+			site: input.site,
+			title: input.title,
+			publishedAt: input.publishedAt,
+			path: input.path,
+			description: input.description,
+			updatedAt: input.updatedAt,
+			tags: input.tags,
+			textContent: input.textContent,
+			content: input.content,
+			bskyPostRef: input.bskyPostRef,
+			coverImage: input.coverImage
+		};
+
+		// Remove undefined values
+		const cleanRecord = Object.fromEntries(
+			Object.entries(record).filter(([_, v]) => v !== undefined)
+		) as Document;
+
+		// Generate TID for record key per lexicon spec (key: "tid")
+		const rkey = generateTid();
+
+		const response = await agent.api.com.atproto.repo.createRecord({
+			repo: did,
+			collection: COLLECTIONS.DOCUMENT,
+			rkey,
+			record: cleanRecord
+		});
+
+		return {
+			uri: response.data.uri,
+			cid: response.data.cid
+		};
+	}
+
+	/**
+	 * Update an existing document
+	 */
+	async updateDocument(rkey: string, input: PublishDocumentInput): Promise<PublishResult> {
+		const did = this.getDid();
+		const agent = this.getAgent();
+
+		const record: Document = {
+			$type: 'site.standard.document',
+			site: input.site,
+			title: input.title,
+			publishedAt: input.publishedAt,
+			path: input.path,
+			description: input.description,
+			updatedAt: input.updatedAt ?? new Date().toISOString(),
+			tags: input.tags,
+			textContent: input.textContent,
+			content: input.content,
+			bskyPostRef: input.bskyPostRef,
+			coverImage: input.coverImage
+		};
+
+		const cleanRecord = Object.fromEntries(
+			Object.entries(record).filter(([_, v]) => v !== undefined)
+		) as Document;
+
+		const response = await agent.api.com.atproto.repo.putRecord({
+			repo: did,
+			collection: COLLECTIONS.DOCUMENT,
+			rkey,
+			record: cleanRecord
+		});
+
+		return {
+			uri: response.data.uri,
+			cid: response.data.cid
+		};
+	}
+
+	/**
+	 * Delete a document
+	 */
+	async deleteDocument(rkey: string): Promise<void> {
+		const did = this.getDid();
+		const agent = this.getAgent();
+
+		await agent.api.com.atproto.repo.deleteRecord({
+			repo: did,
+			collection: COLLECTIONS.DOCUMENT,
+			rkey
+		});
+	}
+
+	/**
+	 * Publish a publication record
+	 */
+	async publishPublication(input: PublishPublicationInput): Promise<PublishResult> {
+		const did = this.getDid();
+		const agent = this.getAgent();
+
+		const record: Publication = {
+			$type: 'site.standard.publication',
+			name: input.name,
+			url: input.url,
+			description: input.description,
+			icon: input.icon,
+			basicTheme: input.basicTheme,
+			preferences: input.preferences
+		};
+
+		const cleanRecord = Object.fromEntries(
+			Object.entries(record).filter(([_, v]) => v !== undefined)
+		) as Publication;
+
+		// Generate TID for record key per lexicon spec (key: "tid")
+		const rkey = generateTid();
+
+		const response = await agent.api.com.atproto.repo.createRecord({
+			repo: did,
+			collection: COLLECTIONS.PUBLICATION,
+			rkey,
+			record: cleanRecord
+		});
+
+		return {
+			uri: response.data.uri,
+			cid: response.data.cid
+		};
+	}
+
+	/**
+	 * Update an existing publication
+	 */
+	async updatePublication(rkey: string, input: PublishPublicationInput): Promise<PublishResult> {
+		const did = this.getDid();
+		const agent = this.getAgent();
+
+		const record: Publication = {
+			$type: 'site.standard.publication',
+			name: input.name,
+			url: input.url,
+			description: input.description,
+			icon: input.icon,
+			basicTheme: input.basicTheme,
+			preferences: input.preferences
+		};
+
+		const cleanRecord = Object.fromEntries(
+			Object.entries(record).filter(([_, v]) => v !== undefined)
+		) as Publication;
+
+		const response = await agent.api.com.atproto.repo.putRecord({
+			repo: did,
+			collection: COLLECTIONS.PUBLICATION,
+			rkey,
+			record: cleanRecord
+		});
+
+		return {
+			uri: response.data.uri,
+			cid: response.data.cid
+		};
+	}
+
+	/**
+	 * Delete a publication
+	 */
+	async deletePublication(rkey: string): Promise<void> {
+		const did = this.getDid();
+		const agent = this.getAgent();
+
+		await agent.api.com.atproto.repo.deleteRecord({
+			repo: did,
+			collection: COLLECTIONS.PUBLICATION,
+			rkey
+		});
+	}
+
+	/**
+	 * Get all documents for the current account
+	 */
+	async listDocuments(
+		limit = 100
+	): Promise<Array<{ uri: string; cid: string; value: Document }>> {
+		const did = this.getDid();
+		const agent = this.getAgent();
+
+		const response = await agent.api.com.atproto.repo.listRecords({
+			repo: did,
+			collection: COLLECTIONS.DOCUMENT,
+			limit
+		});
+
+		return response.data.records.map((r) => ({
+			uri: r.uri,
+			cid: r.cid,
+			value: r.value as Document
+		}));
+	}
+
+	/**
+	 * Get all publications for the current account
+	 */
+	async listPublications(
+		limit = 100
+	): Promise<Array<{ uri: string; cid: string; value: Publication }>> {
+		const did = this.getDid();
+		const agent = this.getAgent();
+
+		const response = await agent.api.com.atproto.repo.listRecords({
+			repo: did,
+			collection: COLLECTIONS.PUBLICATION,
+			limit
+		});
+
+		return response.data.records.map((r) => ({
+			uri: r.uri,
+			cid: r.cid,
+			value: r.value as Publication
+		}));
+	}
+
+	/**
+	 * Get the underlying ATP agent for advanced operations
+	 */
+	getAtpAgent(): AtpAgent {
+		return this.getAgent();
+	}
+}
+
+export type { PublisherConfig };

packages/svelte-standard-site/src/lib/schemas.ts

···
+/**
+ * Zod schemas for standard.site lexicons and configuration
+ */
+
+import { z } from 'zod';
+
+/**
+ * AT Protocol collections
+ */
+export const COLLECTIONS = {
+	DOCUMENT: 'site.standard.document',
+	PUBLICATION: 'site.standard.publication'
+} as const;
+
+/**
+ * RGB Color schema
+ */
+export const RGBColorSchema = z.object({
+	r: z.number().int().min(0).max(255),
+	g: z.number().int().min(0).max(255),
+	b: z.number().int().min(0).max(255)
+});
+
+/**
+ * Basic Theme schema
+ */
+export const BasicThemeSchema = z.object({
+	$type: z.literal('site.standard.theme.basic').optional(),
+	background: RGBColorSchema,
+	foreground: RGBColorSchema,
+	accent: RGBColorSchema,
+	accentForeground: RGBColorSchema
+});
+
+/**
+ * Publication Preferences schema
+ */
+export const PublicationPreferencesSchema = z.object({
+	showInDiscover: z.boolean().optional()
+});
+
+/**
+ * AT Protocol Blob schema
+ */
+export const AtProtoBlobSchema = z.object({
+	$type: z.literal('blob'),
+	ref: z.object({
+		$link: z.string()
+	}),
+	mimeType: z.string(),
+	size: z.number().int().positive()
+});
+
+/**
+ * Strong Reference schema
+ */
+export const StrongRefSchema = z.object({
+	uri: z.string(),
+	cid: z.string()
+});
+
+/**
+ * Publication schema
+ */
+export const PublicationSchema = z.object({
+	$type: z.literal('site.standard.publication'),
+	name: z.string(),
+	url: z.string().url(),
+	description: z.string().optional(),
+	icon: AtProtoBlobSchema.optional(),
+	basicTheme: BasicThemeSchema.optional(),
+	preferences: PublicationPreferencesSchema.optional()
+});
+
+/**
+ * Document schema
+ */
+export const DocumentSchema = z.object({
+	$type: z.literal('site.standard.document'),
+	site: z.string(),
+	title: z.string(),
+	publishedAt: z.string().datetime(),
+	path: z.string().optional(),
+	description: z.string().optional(),
+	updatedAt: z.string().datetime().optional(),
+	tags: z.array(z.string()).optional(),
+	coverImage: AtProtoBlobSchema.optional(),
+	textContent: z.string().optional(),
+	content: z.unknown().optional(),
+	bskyPostRef: StrongRefSchema.optional()
+});
+
+/**
+ * Publisher configuration schema
+ */
+export const PublisherConfigSchema = z.object({
+	identifier: z.string(), // handle or DID
+	password: z.string(),
+	service: z.string().url().optional()
+});
+
+/**
+ * Reader/Client configuration schema
+ */
+export const ReaderConfigSchema = z.object({
+	did: z.string(),
+	pds: z.string().url().optional(),
+	cacheTTL: z.number().int().positive().optional()
+});
+
+/**
+ * Loader configuration schema
+ */
+export const LoaderConfigSchema = z.object({
+	repo: z.string(),
+	excludeSite: z.string().url().optional(),
+	publication: z.string().optional(),
+	limit: z.number().int().positive().default(100),
+	service: z.string().url().default('https://public.api.bsky.app')
+});
+
+// Type exports
+export type RGBColor = z.infer<typeof RGBColorSchema>;
+export type BasicTheme = z.infer<typeof BasicThemeSchema>;
+export type PublicationPreferences = z.infer<typeof PublicationPreferencesSchema>;
+export type AtProtoBlob = z.infer<typeof AtProtoBlobSchema>;
+export type StrongRef = z.infer<typeof StrongRefSchema>;
+export type Publication = z.infer<typeof PublicationSchema>;
+export type Document = z.infer<typeof DocumentSchema>;
+export type PublisherConfig = z.infer<typeof PublisherConfigSchema>;
+export type ReaderConfig = z.infer<typeof ReaderConfigSchema>;
+export type LoaderConfig = z.infer<typeof LoaderConfigSchema>;

packages/svelte-standard-site/src/lib/stores/index.ts

···
+export { themeStore } from './theme.js';

packages/svelte-standard-site/src/lib/stores/theme.ts

···
+import { writable } from 'svelte/store';
+import { browser } from '$app/environment';
+
+interface ThemeState {
+	isDark: boolean;
+	mounted: boolean;
+}
+
+function createThemeStore() {
+	const { subscribe, set, update } = writable<ThemeState>({
+		isDark: false,
+		mounted: false
+	});
+
+	return {
+		subscribe,
+		init: () => {
+			if (!browser) return;
+
+			const stored = localStorage.getItem('theme');
+			const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+			const isDark = stored === 'dark' || (!stored && prefersDark);
+
+			update((state) => ({
+				...state,
+				isDark,
+				mounted: true
+			}));
+
+			applyTheme(isDark);
+
+			// Listen for system preference changes
+			const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
+			const handleChange = (e: MediaQueryListEvent) => {
+				if (!localStorage.getItem('theme')) {
+					update((state) => ({ ...state, isDark: e.matches }));
+					applyTheme(e.matches);
+				}
+			};
+			mediaQuery.addEventListener('change', handleChange);
+
+			return () => {
+				mediaQuery.removeEventListener('change', handleChange);
+			};
+		},
+		toggle: () => {
+			if (!browser) return;
+
+			update((state) => {
+				const newIsDark = !state.isDark;
+				localStorage.setItem('theme', newIsDark ? 'dark' : 'light');
+				applyTheme(newIsDark);
+				return { ...state, isDark: newIsDark };
+			});
+		},
+		setTheme: (isDark: boolean) => {
+			if (!browser) return;
+
+			localStorage.setItem('theme', isDark ? 'dark' : 'light');
+			applyTheme(isDark);
+			update((state) => ({ ...state, isDark }));
+		}
+	};
+}
+
+function applyTheme(isDark: boolean) {
+	if (!browser) return;
+
+	const htmlElement = document.documentElement;
+
+	if (isDark) {
+		htmlElement.classList.add('dark');
+		htmlElement.style.colorScheme = 'dark';
+	} else {
+		htmlElement.classList.remove('dark');
+		htmlElement.style.colorScheme = 'light';
+	}
+}
+
+export const themeStore = createThemeStore();

packages/svelte-standard-site/src/lib/styles/base.css

···
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
+@import 'tailwindcss';
+@import './themes.css';
+
+@theme {
+	/* Font Family */
+	--font-family-sans:
+		'Inter', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
+		'Segoe UI Symbol', 'Noto Color Emoji';
+
+	/* Ink - Slate-tinted text (230°) */
+	--color-ink-50: light-dark(oklch(17.5% 0.012 230), oklch(97.6% 0.008 230));
+	--color-ink-100: light-dark(oklch(25% 0.022 230), oklch(93.2% 0.017 230));
+	--color-ink-200: light-dark(oklch(38.5% 0.037 230), oklch(85.2% 0.032 230));
+	--color-ink-300: light-dark(oklch(50.5% 0.052 230), oklch(75.2% 0.048 230));
+	--color-ink-400: light-dark(oklch(62% 0.065 230), oklch(65.2% 0.062 230));
+	--color-ink-500: light-dark(oklch(73% 0.078 230), oklch(55.2% 0.078 230));
+	--color-ink-600: light-dark(oklch(78% 0.062 230), oklch(45.2% 0.065 230));
+	--color-ink-700: light-dark(oklch(83.5% 0.048 230), oklch(35.2% 0.052 230));
+	--color-ink-800: light-dark(oklch(89% 0.032 230), oklch(25.2% 0.037 230));
+	--color-ink-900: light-dark(oklch(94.5% 0.017 230), oklch(18.2% 0.022 230));
+	--color-ink-950: light-dark(oklch(97.6% 0.008 230), oklch(12.5% 0.012 230));
+
+	/* Canvas - Slate-tinted backgrounds (230°) */
+	--color-canvas-50: light-dark(oklch(17.8% 0.014 230), oklch(98.6% 0.005 230));
+	--color-canvas-100: light-dark(oklch(25.8% 0.025 230), oklch(96.6% 0.011 230));
+	--color-canvas-200: light-dark(oklch(39.5% 0.042 230), oklch(92.5% 0.024 230));
+	--color-canvas-300: light-dark(oklch(52% 0.058 230), oklch(86.5% 0.038 230));
+	--color-canvas-400: light-dark(oklch(64% 0.072 230), oklch(80.5% 0.055 230));
+	--color-canvas-500: light-dark(oklch(75.5% 0.085 230), oklch(75.5% 0.068 230));
+	--color-canvas-600: light-dark(oklch(80.5% 0.055 230), oklch(64% 0.072 230));
+	--color-canvas-700: light-dark(oklch(86.5% 0.038 230), oklch(52% 0.058 230));
+	--color-canvas-800: light-dark(oklch(92.5% 0.024 230), oklch(39.5% 0.042 230));
+	--color-canvas-900: light-dark(oklch(96.6% 0.011 230), oklch(25.8% 0.025 230));
+	--color-canvas-950: light-dark(oklch(98.6% 0.005 230), oklch(17.8% 0.014 230));
+
+	/* Slate - Primary colors (230°) */
+	--color-primary-50: light-dark(oklch(18.2% 0.018 230), oklch(97.8% 0.012 230));
+	--color-primary-100: light-dark(oklch(26.5% 0.03 230), oklch(94.8% 0.022 230));
+	--color-primary-200: light-dark(oklch(40.5% 0.048 230), oklch(89.5% 0.042 230));
+	--color-primary-300: light-dark(oklch(54% 0.065 230), oklch(79.5% 0.062 230));
+	--color-primary-400: light-dark(oklch(66.5% 0.08 230), oklch(69.5% 0.078 230));
+	--color-primary-500: light-dark(oklch(78.5% 0.095 230), oklch(59.5% 0.095 230));
+	--color-primary-600: light-dark(oklch(82.2% 0.078 230), oklch(49.5% 0.08 230));
+	--color-primary-700: light-dark(oklch(86.5% 0.062 230), oklch(39.5% 0.065 230));
+	--color-primary-800: light-dark(oklch(91% 0.042 230), oklch(29.5% 0.048 230));
+	--color-primary-900: light-dark(oklch(95.8% 0.022 230), oklch(21.5% 0.03 230));
+	--color-primary-950: light-dark(oklch(98% 0.012 230), oklch(15.2% 0.018 230));
+
+	/* Steel Grey - Secondary colors (215°) */
+	--color-secondary-50: light-dark(oklch(18.5% 0.02 215), oklch(97.9% 0.013 215));
+	--color-secondary-100: light-dark(oklch(26.8% 0.033 215), oklch(95% 0.024 215));
+	--color-secondary-200: light-dark(oklch(41% 0.052 215), oklch(89.8% 0.045 215));
+	--color-secondary-300: light-dark(oklch(54.5% 0.07 215), oklch(80.2% 0.065 215));
+	--color-secondary-400: light-dark(oklch(67% 0.087 215), oklch(70.2% 0.082 215));
+	--color-secondary-500: light-dark(oklch(79% 0.103 215), oklch(60.2% 0.103 215));
+	--color-secondary-600: light-dark(oklch(82.8% 0.082 215), oklch(50.2% 0.087 215));
+	--color-secondary-700: light-dark(oklch(87% 0.065 215), oklch(40.2% 0.07 215));
+	--color-secondary-800: light-dark(oklch(91.5% 0.045 215), oklch(30.5% 0.052 215));
+	--color-secondary-900: light-dark(oklch(96% 0.024 215), oklch(22.2% 0.033 215));
+	--color-secondary-950: light-dark(oklch(98.2% 0.013 215), oklch(15.8% 0.02 215));
+
+	/* Charcoal - Accent colors (240°) */
+	--color-accent-50: light-dark(oklch(18.5% 0.022 240), oklch(98% 0.014 240));
+	--color-accent-100: light-dark(oklch(26.8% 0.036 240), oklch(95.2% 0.026 240));
+	--color-accent-200: light-dark(oklch(41% 0.058 240), oklch(90% 0.048 240));
+	--color-accent-300: light-dark(oklch(54.5% 0.078 240), oklch(80.8% 0.072 240));
+	--color-accent-400: light-dark(oklch(67% 0.097 240), oklch(71% 0.092 240));
+	--color-accent-500: light-dark(oklch(79% 0.115 240), oklch(61% 0.115 240));
+	--color-accent-600: light-dark(oklch(82.8% 0.092 240), oklch(51% 0.097 240));
+	--color-accent-700: light-dark(oklch(87% 0.072 240), oklch(41% 0.078 240));
+	--color-accent-800: light-dark(oklch(91.5% 0.048 240), oklch(31% 0.058 240));
+	--color-accent-900: light-dark(oklch(96% 0.026 240), oklch(22.5% 0.036 240));
+	--color-accent-950: light-dark(oklch(98.2% 0.014 240), oklch(16.2% 0.022 240));
+}
+
+@layer base {
+	/* Base styles for consistent typography and accessibility */
+	html {
+		scroll-behavior: smooth;
+		overflow-x: hidden;
+		width: 100%;
+	}
+
+	@media (prefers-reduced-motion: reduce) {
+		html {
+			scroll-behavior: auto;
+		}
+
+		*,
+		*::before,
+		*::after {
+			animation-duration: 0.01ms !important;
+			animation-iteration-count: 1 !important;
+			transition-duration: 0.01ms !important;
+		}
+	}
+
+	body {
+		font-family: var(--font-family-sans);
+		text-rendering: optimizeLegibility;
+		-webkit-font-smoothing: antialiased;
+		-moz-osx-font-smoothing: grayscale;
+		overflow-x: hidden;
+		width: 100%;
+		max-width: 100vw;
+		background-color: var(--color-canvas-50);
+	}
+
+	@media (prefers-color-scheme: dark) {
+		body {
+			background-color: var(--color-canvas-950);
+		}
+	}
+
+	/* Skip to content link for keyboard navigation */
+	.skip-to-content {
+		position: absolute;
+		left: -9999px;
+		z-index: 999;
+		padding: 1rem 1.5rem;
+		background-color: var(--color-primary-600);
+		color: white;
+		font-weight: 600;
+		text-decoration: none;
+		border-radius: 0.5rem;
+	}
+
+	.skip-to-content:focus {
+		left: 1rem;
+		top: 1rem;
+		outline: 2px solid var(--color-primary-800);
+		outline-offset: 2px;
+	}
+
+	/* Focus visible styles for accessibility - Enhanced for better visibility */
+	*:focus-visible {
+		outline: 3px solid var(--color-primary-600);
+		outline-offset: 2px;
+		border-radius: 0.25rem;
+	}
+
+	/* High contrast mode support */
+	@media (prefers-contrast: high) {
+		*:focus-visible {
+			outline-width: 4px;
+		}
+	}
+
+	/* Ensure all elements stay within viewport */
+	* {
+		min-width: 0;
+	}
+
+	img,
+	video,
+	iframe,
+	embed,
+	object {
+		max-width: 100%;
+		height: auto;
+	}
+
+	/* Improve link accessibility */
+	a {
+		text-decoration-skip-ink: auto;
+	}
+
+	/* Better button accessibility */
+	button:disabled {
+		cursor: not-allowed;
+	}
+
+	/* Screen reader only utility */
+	.sr-only {
+		position: absolute;
+		width: 1px;
+		height: 1px;
+		padding: 0;
+		margin: -1px;
+		overflow: hidden;
+		clip: rect(0, 0, 0, 0);
+		white-space: nowrap;
+		border-width: 0;
+	}
+}
+
+@plugin '@tailwindcss/typography';

packages/svelte-standard-site/src/lib/styles/themes.css

···
+/* Color Theme System - Modular Theme Imports */
+/* Slate theme is the default and included in base.css */
+/* Add additional themes here as needed */
+
+/* Default theme is Slate (230°) defined in base.css */

packages/svelte-standard-site/src/lib/types.ts

···
+/**
+ * Core types for site.standard.* lexicons
+ */
+
+/**
+ * AT Protocol blob reference
+ */
+export interface AtProtoBlob {
+	$type: 'blob';
+	ref: {
+		$link: string;
+	};
+	mimeType: string;
+	size: number;
+}
+
+/**
+ * Strong reference to another AT Protocol record
+ */
+export interface StrongRef {
+	uri: string;
+	cid: string;
+}
+
+/**
+ * RGB Color
+ */
+export interface RGBColor {
+	r: number; // 0-255
+	g: number; // 0-255
+	b: number; // 0-255
+}
+
+/**
+ * Basic theme for publications
+ */
+export interface BasicTheme {
+	$type?: 'site.standard.theme.basic';
+	background: RGBColor;
+	foreground: RGBColor;
+	accent: RGBColor;
+	accentForeground: RGBColor;
+}
+
+/**
+ * Publication preferences
+ */
+export interface PublicationPreferences {
+	showInDiscover?: boolean;
+}
+
+/**
+ * Site Standard Publication record
+ */
+export interface Publication {
+	$type: 'site.standard.publication';
+	url: string;
+	name: string;
+	icon?: string; // Blob URL converted to string
+	description?: string;
+	basicTheme?: BasicTheme;
+	preferences?: PublicationPreferences;
+}
+
+/**
+ * Site Standard Document record
+ */
+export interface Document {
+	$type: 'site.standard.document';
+	site: string; // AT URI or HTTPS URL
+	title: string;
+	path?: string;
+	description?: string;
+	coverImage?: string; // Blob URL converted to string
+	content?: any; // Open union
+	textContent?: string;
+	bskyPostRef?: StrongRef;
+	tags?: string[];
+	publishedAt: string;
+	updatedAt?: string;
+}
+
+/**
+ * AT Protocol record response
+ */
+export interface AtProtoRecord<T = any> {
+	uri: string;
+	cid: string;
+	value: T;
+}
+
+/**
+ * Resolved identity from PDS resolution
+ */
+export interface ResolvedIdentity {
+	did: string;
+	pds: string;
+	handle?: string;
+}
+
+/**
+ * Configuration for the library
+ */
+export interface SiteStandardConfig {
+	/** The DID to fetch records from */
+	did: string;
+	/** Optional custom PDS endpoint */
+	pds?: string;
+	/** Cache TTL in milliseconds (default: 5 minutes) */
+	cacheTTL?: number;
+}

packages/svelte-standard-site/src/lib/utils/agents.ts

···
+import { AtpAgent } from '@atproto/api';
+import type { ResolvedIdentity } from '../types.js';
+import { cache } from './cache.js';
+
+/**
+ * Creates an AtpAgent with optional fetch function injection
+ */
+export function createAgent(service: string, fetchFn?: typeof fetch): AtpAgent {
+	const wrappedFetch = fetchFn
+		? async (url: URL | RequestInfo, init?: RequestInit) => {
+				const urlStr = url instanceof URL ? url.toString() : url;
+				const response = await fetchFn(urlStr, init);
+
+				const headers = new Headers(response.headers);
+				if (!headers.has('content-type')) {
+					headers.set('content-type', 'application/json');
+				}
+
+				return new Response(response.body, {
+					status: response.status,
+					statusText: response.statusText,
+					headers
+				});
+			}
+		: undefined;
+
+	return new AtpAgent({
+		service,
+		...(wrappedFetch && { fetch: wrappedFetch })
+	});
+}
+
+/**
+ * Resolves a DID to find its PDS endpoint using Slingshot
+ * @param did - DID to resolve
+ * @param fetchFn - Optional fetch function for SSR
+ * @returns Resolved identity with PDS endpoint
+ */
+export async function resolveIdentity(
+	did: string,
+	fetchFn?: typeof fetch
+): Promise<ResolvedIdentity> {
+	const cacheKey = `identity:${did}`;
+	const cached = cache.get<ResolvedIdentity>(cacheKey);
+	if (cached) return cached;
+
+	const _fetch = fetchFn ?? globalThis.fetch;
+
+	const response = await _fetch(
+		`https://slingshot.microcosm.blue/xrpc/com.bad-example.identity.resolveMiniDoc?identifier=${encodeURIComponent(did)}`
+	);
+
+	if (!response.ok) {
+		throw new Error(`Failed to resolve DID: ${response.status} ${response.statusText}`);
+	}
+
+	const rawText = await response.text();
+	const data = JSON.parse(rawText);
+
+	if (!data.did || !data.pds) {
+		throw new Error('Invalid response from identity resolver');
+	}
+
+	cache.set(cacheKey, data);
+	return data;
+}
+
+/**
+ * Gets or creates a PDS-specific agent
+ * @param did - DID to resolve PDS for
+ * @param fetchFn - Optional fetch function for SSR
+ * @returns AtpAgent configured for the user's PDS
+ */
+export async function getPDSAgent(did: string, fetchFn?: typeof fetch): Promise<AtpAgent> {
+	const resolved = await resolveIdentity(did, fetchFn);
+	return createAgent(resolved.pds, fetchFn);
+}
+
+/**
+ * Executes a function with automatic fallback
+ * @param did - The DID to resolve
+ * @param operation - The operation to execute
+ * @param fetchFn - Optional fetch function for SSR
+ */
+export async function withFallback<T>(
+	did: string,
+	operation: (agent: AtpAgent) => Promise<T>,
+	fetchFn?: typeof fetch
+): Promise<T> {
+	const agents = [
+		() => getPDSAgent(did, fetchFn),
+		() =>
+			Promise.resolve(
+				fetchFn
+					? createAgent('https://public.api.bsky.app', fetchFn)
+					: createAgent('https://public.api.bsky.app')
+			)
+	];
+
+	let lastError: any;
+
+	for (const getAgent of agents) {
+		try {
+			const agent = await getAgent();
+			return await operation(agent);
+		} catch (error) {
+			lastError = error;
+		}
+	}
+
+	throw lastError;
+}
+
+/**
+ * Build a PDS blob URL
+ * @param pds - PDS endpoint
+ * @param did - Repository DID
+ * @param cid - Blob CID
+ * @returns Full blob URL
+ */
+export function buildPdsBlobUrl(pds: string, did: string, cid: string): string {
+	const pdsBase = pds.replace(/\/$/, '');
+	return `${pdsBase}/xrpc/com.atproto.sync.getBlob?did=${encodeURIComponent(did)}&cid=${encodeURIComponent(cid)}`;
+}

packages/svelte-standard-site/src/lib/utils/at-uri.ts

···
+/**
+ * AT URI parsing and conversion utilities
+ */
+
+/**
+ * Parsed AT URI components
+ */
+export interface ParsedAtUri {
+	did: string;
+	collection: string;
+	rkey: string;
+}
+
+/**
+ * Parse an AT URI into its components
+ * @param atUri - AT URI in format: at://did:plc:xxx/collection/rkey
+ * @returns Parsed components or null if invalid
+ */
+export function parseAtUri(atUri: string): ParsedAtUri | null {
+	if (!atUri.startsWith('at://')) return null;
+
+	const withoutProtocol = atUri.slice(5); // Remove "at://"
+	const parts = withoutProtocol.split('/');
+
+	if (parts.length !== 3) return null;
+
+	const [did, collection, rkey] = parts;
+
+	if (!did.startsWith('did:') || !collection || !rkey) return null;
+
+	return { did, collection, rkey };
+}
+
+/**
+ * Convert AT URI to HTTPS URL for com.atproto.repo.getRecord
+ * @param atUri - AT URI in format: at://did:plc:xxx/collection/rkey
+ * @param pdsEndpoint - PDS endpoint (e.g., "https://cortinarius.us-west.host.bsky.network")
+ * @returns HTTPS URL for getRecord XRPC call
+ */
+export function atUriToHttps(atUri: string, pdsEndpoint: string): string | null {
+	const parsed = parseAtUri(atUri);
+	if (!parsed) return null;
+
+	// Ensure PDS endpoint doesn't have trailing slash
+	const pds = pdsEndpoint.replace(/\/$/, '');
+
+	return `${pds}/xrpc/com.atproto.repo.getRecord?repo=${encodeURIComponent(parsed.did)}&collection=${encodeURIComponent(parsed.collection)}&rkey=${encodeURIComponent(parsed.rkey)}`;
+}
+
+/**
+ * Construct an AT URI from components
+ * @param did - DID of the repository
+ * @param collection - Collection name
+ * @param rkey - Record key
+ * @returns AT URI string
+ */
+export function buildAtUri(did: string, collection: string, rkey: string): string {
+	return `at://${did}/${collection}/${rkey}`;
+}
+
+/**
+ * Extract rkey from an AT URI
+ * @param atUri - AT URI
+ * @returns rkey or null if invalid
+ */
+export function extractRkey(atUri: string): string | null {
+	const parsed = parseAtUri(atUri);
+	return parsed?.rkey ?? null;
+}
+
+/**
+ * Validate if string is a valid AT URI
+ * @param uri - String to validate
+ * @returns true if valid AT URI
+ */
+export function isAtUri(uri: string): boolean {
+	return parseAtUri(uri) !== null;
+}
+
+/**
+ * Convert DID to PDS hostname format
+ * @param did - DID to convert
+ * @returns PDS hostname or null if unable to derive
+ */
+export function didToPdsHostname(did: string): string | null {
+	// This is a simplified version - real implementation should use DID resolution
+	// For now, we'll return null and rely on explicit PDS configuration
+	return null;
+}

packages/svelte-standard-site/src/lib/utils/cache.ts

···
+/**
+ * Simple in-memory cache with TTL support
+ */
+
+interface CacheEntry<T> {
+	value: T;
+	expires: number;
+}
+
+class Cache {
+	private store = new Map<string, CacheEntry<any>>();
+	private defaultTTL = 5 * 60 * 1000; // 5 minutes
+
+	get<T>(key: string): T | null {
+		const entry = this.store.get(key);
+		if (!entry) return null;
+
+		if (Date.now() > entry.expires) {
+			this.store.delete(key);
+			return null;
+		}
+
+		return entry.value;
+	}
+
+	set<T>(key: string, value: T, ttl?: number): void {
+		this.store.set(key, {
+			value,
+			expires: Date.now() + (ttl ?? this.defaultTTL)
+		});
+	}
+
+	delete(key: string): void {
+		this.store.delete(key);
+	}
+
+	clear(): void {
+		this.store.clear();
+	}
+
+	setDefaultTTL(ttl: number): void {
+		this.defaultTTL = ttl;
+	}
+}
+
+export const cache = new Cache();

packages/svelte-standard-site/src/lib/utils/comments.ts

···
+/**
+ * Comments utilities for fetching Bluesky replies
+ *
+ * Fetches threaded replies from Bluesky to display as comments on your blog.
+ *
+ * @example
+ * ```ts
+ * import { fetchComments } from 'svelte-standard-site/comments';
+ *
+ * const comments = await fetchComments({
+ *   bskyPostUri: 'at://did:plc:xxx/app.bsky.feed.post/abc123',
+ *   canonicalUrl: 'https://yourblog.com/posts/my-post',
+ *   maxDepth: 3,
+ * });
+ * ```
+ */
+
+import { AtpAgent } from '@atproto/api';
+
+export interface CommentAuthor {
+	did: string;
+	handle: string;
+	displayName?: string;
+	avatar?: string;
+}
+
+export interface Comment {
+	uri: string;
+	cid: string;
+	author: CommentAuthor;
+	text: string;
+	createdAt: string;
+	likeCount: number;
+	replyCount: number;
+	replies?: Comment[];
+	depth: number;
+}
+
+export interface FetchCommentsOptions {
+	/** AT-URI of the announcement post (e.g., at://did:plc:xxx/app.bsky.feed.post/abc123) */
+	bskyPostUri: string;
+	/** Optional canonical URL to search for mentions */
+	canonicalUrl?: string;
+	/** Maximum depth for nested replies (default: 3) */
+	maxDepth?: number;
+	/** Optional fetch function for SSR */
+	fetchFn?: typeof fetch;
+}
+
+/**
+ * Parse an AT-URI to extract components
+ */
+function parseAtUri(uri: string): { did: string; collection: string; rkey: string } | null {
+	const match = uri.match(/^at:\/\/([^/]+)\/([^/]+)\/(.+)$/);
+	if (!match) return null;
+	return {
+		did: match[1],
+		collection: match[2],
+		rkey: match[3]
+	};
+}
+
+/**
+ * Fetch a single thread of replies
+ */
+async function fetchThread(
+	agent: AtpAgent,
+	uri: string,
+	maxDepth: number,
+	currentDepth = 0
+): Promise<Comment | null> {
+	try {
+		const response = await agent.getPostThread({
+			uri,
+			depth: maxDepth - currentDepth,
+			parentHeight: 0
+		});
+
+		const thread = response.data.thread;
+
+		if (thread.$type !== 'app.bsky.feed.defs#threadViewPost') {
+			return null;
+		}
+
+		const post = thread.post;
+
+		// Build comment object
+		const comment: Comment = {
+			uri: post.uri,
+			cid: post.cid,
+			author: {
+				did: post.author.did,
+				handle: post.author.handle,
+				displayName: post.author.displayName,
+				avatar: post.author.avatar
+			},
+			text: (post.record as any)?.text || '',
+			createdAt: post.indexedAt,
+			likeCount: post.likeCount || 0,
+			replyCount: post.replyCount || 0,
+			depth: currentDepth,
+			replies: []
+		};
+
+		// Process replies if within depth limit
+		if (thread.replies && currentDepth < maxDepth) {
+			for (const reply of thread.replies) {
+				if (reply.$type === 'app.bsky.feed.defs#threadViewPost') {
+					const replyComment = await fetchThread(
+						agent,
+						reply.post.uri,
+						maxDepth,
+						currentDepth + 1
+					);
+					if (replyComment) {
+						comment.replies!.push(replyComment);
+					}
+				}
+			}
+		}
+
+		return comment;
+	} catch (error) {
+		console.error(`Failed to fetch thread for ${uri}:`, error);
+		return null;
+	}
+}
+
+/**
+ * Fetch comments for a blog post
+ *
+ * @param options - Configuration options
+ * @returns Array of top-level comments with nested replies
+ */
+export async function fetchComments(options: FetchCommentsOptions): Promise<Comment[]> {
+	const { bskyPostUri, canonicalUrl, maxDepth = 3 } = options;
+
+	// Parse the post URI
+	const parsed = parseAtUri(bskyPostUri);
+	if (!parsed) {
+		console.error('Invalid AT-URI:', bskyPostUri);
+		return [];
+	}
+
+	try {
+		// Create agent
+		const agent = new AtpAgent({ service: 'https://public.api.bsky.app' });
+
+		// Fetch the main thread
+		const mainComment = await fetchThread(agent, bskyPostUri, maxDepth, 0);
+
+		if (!mainComment || !mainComment.replies) {
+			return [];
+		}
+
+		// Return only the replies (not the original post)
+		return mainComment.replies;
+	} catch (error) {
+		console.error('Failed to fetch comments:', error);
+		return [];
+	}
+}
+
+/**
+ * Search for mentions of a URL and fetch those threads as comments
+ *
+ * This is useful if people share your blog post on Bluesky without
+ * replying to a specific announcement post.
+ */
+export async function fetchMentionComments(
+	canonicalUrl: string,
+	maxDepth = 3
+): Promise<Comment[]> {
+	try {
+		const agent = new AtpAgent({ service: 'https://public.api.bsky.app' });
+
+		// Search for posts mentioning the URL
+		const searchResponse = await agent.app.bsky.feed.searchPosts({
+			q: canonicalUrl,
+			limit: 25
+		});
+
+		const comments: Comment[] = [];
+
+		for (const post of searchResponse.data.posts) {
+			const comment = await fetchThread(agent, post.uri, maxDepth, 0);
+			if (comment) {
+				comments.push(comment);
+			}
+		}
+
+		return comments;
+	} catch (error) {
+		console.error('Failed to fetch mention comments:', error);
+		return [];
+	}
+}
+
+/**
+ * Format a relative time string (e.g., "2 hours ago")
+ */
+export function formatRelativeTime(dateString: string): string {
+	const date = new Date(dateString);
+	const now = new Date();
+	const diffMs = now.getTime() - date.getTime();
+	const diffSecs = Math.floor(diffMs / 1000);
+	const diffMins = Math.floor(diffSecs / 60);
+	const diffHours = Math.floor(diffMins / 60);
+	const diffDays = Math.floor(diffHours / 24);
+
+	if (diffSecs < 60) return 'just now';
+	if (diffMins < 60) return `${diffMins} minute${diffMins === 1 ? '' : 's'} ago`;
+	if (diffHours < 24) return `${diffHours} hour${diffHours === 1 ? '' : 's'} ago`;
+	if (diffDays < 7) return `${diffDays} day${diffDays === 1 ? '' : 's'} ago`;
+
+	return date.toLocaleDateString();
+}

packages/svelte-standard-site/src/lib/utils/content.ts

···
+/**
+ * Content transformation utilities for standard.site
+ *
+ * Converts blog post content into formats suitable for ATProto:
+ * - Strips markdown to plain text for `textContent` (search/indexing)
+ * - Converts custom sidenotes to standard markdown
+ * - Resolves relative links to absolute URLs
+ *
+ * @example
+ * ```ts
+ * import { transformContent, stripToPlainText } from 'svelte-standard-site/content';
+ *
+ * const result = transformContent(markdown, {
+ *   baseUrl: 'https://yourblog.com',
+ * });
+ *
+ * // result.markdown - cleaned markdown for ATProto
+ * // result.textContent - plain text for search
+ * ```
+ */
+
+export interface TransformOptions {
+	/** Base URL of your site (e.g., 'https://yourblog.com') */
+	baseUrl: string;
+	/** Optional path to the current post (e.g., '/blog/my-post') */
+	postPath?: string;
+}
+
+export interface TransformResult {
+	/** Transformed markdown suitable for ATProto */
+	markdown: string;
+	/** Plain text version for textContent field */
+	textContent: string;
+	/** Word count */
+	wordCount: number;
+	/** Estimated reading time in minutes */
+	readingTime: number;
+}
+
+/**
+ * Convert HTML sidenotes to markdown blockquotes
+ *
+ * Transforms:
+ * ```html
+ * <div class="sidenote sidenote--tip">
+ *   <span class="sidenote-label">Tip</span>
+ *   <p>Content here</p>
+ * </div>
+ * ```
+ *
+ * Into:
+ * ```markdown
+ * > **Tip:** Content here
+ * ```
+ */
+export function convertSidenotes(markdown: string): string {
+	// Match sidenote divs with various formats
+	const sidenoteRegex =
+		/<div\s+class="sidenote(?:\s+sidenote--(warning|tip))?">\s*<span\s+class="sidenote-label">([^<]+)<\/span>\s*<p>([^<]+)<\/p>\s*<\/div>/gi;
+
+	return markdown.replace(sidenoteRegex, (_, type, label, content) => {
+		// Clean up the content
+		const cleanContent = content.trim();
+		const cleanLabel = label.trim();
+
+		// Convert to blockquote with label
+		return `\n> **${cleanLabel}:** ${cleanContent}\n`;
+	});
+}
+
+/**
+ * Convert HTML sidenotes (multi-paragraph) to markdown
+ * Handles more complex sidenote structures
+ */
+export function convertComplexSidenotes(markdown: string): string {
+	// First pass: simple sidenotes
+	let result = convertSidenotes(markdown);
+
+	// Second pass: sidenotes with multiple paragraphs or nested content
+	const complexSidenoteRegex = /<div\s+class="sidenote[^"]*">([\s\S]*?)<\/div>/gi;
+
+	result = result.replace(complexSidenoteRegex, (match, innerContent) => {
+		// Extract label if present
+		const labelMatch = innerContent.match(/<span\s+class="sidenote-label">([^<]+)<\/span>/i);
+		const label = labelMatch ? labelMatch[1].trim() : 'Note';
+
+		// Remove the label span
+		let content = innerContent.replace(/<span\s+class="sidenote-label">[^<]+<\/span>/gi, '');
+
+		// Convert remaining HTML to plain text with basic formatting
+		content = content
+			.replace(/<p>/gi, '')
+			.replace(/<\/p>/gi, '\n')
+			.replace(/<strong>/gi, '**')
+			.replace(/<\/strong>/gi, '**')
+			.replace(/<em>/gi, '*')
+			.replace(/<\/em>/gi, '*')
+			.replace(/<a\s+href="([^"]+)"[^>]*>([^<]+)<\/a>/gi, '[$2]($1)')
+			.replace(/<[^>]+>/g, '') // Remove any remaining HTML tags
+			.trim();
+
+		// Format as blockquote
+		const lines = content.split('\n').filter((line: string) => line.trim());
+		const quotedLines = lines.map((line: string, i: number) =>
+			i === 0 ? `> **${label}:** ${line}` : `> ${line}`
+		);
+
+		return '\n' + quotedLines.join('\n') + '\n';
+	});
+
+	return result;
+}
+
+/**
+ * Resolve relative URLs to absolute URLs
+ *
+ * Converts:
+ * - `[Link](/page)` → `[Link](https://example.com/page)`
+ * - `![Image](/img.png)` → `![Image](https://example.com/img.png)`
+ */
+export function resolveRelativeLinks(markdown: string, baseUrl: string): string {
+	const cleanBaseUrl = baseUrl.replace(/\/$/, '');
+
+	// Match markdown links and images with relative URLs
+	// [text](/path) or ![alt](/path)
+	const linkRegex = /(!?\[[^\]]*\])\((?!https?:\/\/|mailto:|#)([^)]+)\)/g;
+
+	return markdown.replace(linkRegex, (_, prefix, path) => {
+		// Ensure path starts with /
+		const absolutePath = path.startsWith('/') ? path : `/${path}`;
+		return `${prefix}(${cleanBaseUrl}${absolutePath})`;
+	});
+}
+
+/**
+ * Strip markdown to plain text for indexing/search
+ *
+ * Removes:
+ * - Markdown formatting (**, *, #, etc.)
+ * - Links (keeps link text)
+ * - Images
+ * - Code blocks
+ * - HTML tags
+ */
+export function stripToPlainText(markdown: string): string {
+	let text = markdown;
+
+	// Remove code blocks first (preserve nothing)
+	text = text.replace(/```[\s\S]*?```/g, '');
+	text = text.replace(/`[^`]+`/g, '');
+
+	// Remove images
+	text = text.replace(/!\[[^\]]*\]\([^)]+\)/g, '');
+
+	// Convert links to just their text
+	text = text.replace(/\[([^\]]+)\]\([^)]+\)/g, '$1');
+
+	// Remove HTML tags
+	text = text.replace(/<[^>]+>/g, '');
+
+	// Remove heading markers
+	text = text.replace(/^#{1,6}\s+/gm, '');
+
+	// Remove bold/italic markers
+	text = text.replace(/\*\*([^*]+)\*\*/g, '$1');
+	text = text.replace(/\*([^*]+)\*/g, '$1');
+	text = text.replace(/__([^_]+)__/g, '$1');
+	text = text.replace(/_([^_]+)_/g, '$1');
+
+	// Remove blockquote markers
+	text = text.replace(/^>\s*/gm, '');
+
+	// Remove list markers
+	text = text.replace(/^[\s]*[-*+]\s+/gm, '');
+	text = text.replace(/^[\s]*\d+\.\s+/gm, '');
+
+	// Remove horizontal rules
+	text = text.replace(/^[-*_]{3,}$/gm, '');
+
+	// Collapse multiple newlines
+	text = text.replace(/\n{3,}/g, '\n\n');
+
+	// Trim whitespace
+	text = text.trim();
+
+	return text;
+}
+
+/**
+ * Calculate word count from text
+ */
+export function countWords(text: string): number {
+	return text.split(/\s+/).filter((word) => word.length > 0).length;
+}
+
+/**
+ * Calculate reading time in minutes (assuming 200 words per minute)
+ */
+export function calculateReadingTime(wordCount: number, wordsPerMinute = 200): number {
+	return Math.max(1, Math.ceil(wordCount / wordsPerMinute));
+}
+
+/**
+ * Full content transformation pipeline
+ *
+ * Takes raw markdown (with HTML sidenotes) and produces:
+ * - Clean markdown suitable for ATProto platforms
+ * - Plain text for search/indexing
+ * - Metadata (word count, reading time)
+ */
+export function transformContent(rawMarkdown: string, options: TransformOptions): TransformResult {
+	// Step 1: Convert sidenotes from HTML to markdown blockquotes
+	let markdown = convertComplexSidenotes(rawMarkdown);
+
+	// Step 2: Resolve relative links to absolute URLs
+	markdown = resolveRelativeLinks(markdown, options.baseUrl);
+
+	// Step 3: Clean up extra whitespace
+	markdown = markdown.replace(/\n{3,}/g, '\n\n').trim();
+
+	// Step 4: Generate plain text version
+	const textContent = stripToPlainText(markdown);
+
+	// Step 5: Calculate metadata
+	const wordCount = countWords(textContent);
+	const readingTime = calculateReadingTime(wordCount);
+
+	return {
+		markdown,
+		textContent,
+		wordCount,
+		readingTime
+	};
+}

packages/svelte-standard-site/src/lib/utils/document.ts

···
+/**
+ * Extract rkey from AT URI
+ */
+export function extractRkey(uri: string): string | null {
+	const match = uri.match(/at:\/\/[^\/]+\/[^\/]+\/(.+)$/);
+	return match ? match[1] : null;
+}
+
+/**
+ * Get document slug (uses path if available, otherwise rkey)
+ */
+export function getDocumentSlug(document: { uri: string; value: { path?: string } }): string {
+	if (document.value.path) {
+		// Remove leading slash if present
+		return document.value.path.replace(/^\//, '');
+	}
+	return extractRkey(document.uri) || '';
+}
+
+/**
+ * Get document canonical URL
+ */
+export function getDocumentUrl(document: {
+	value: { site: string; path?: string };
+	uri: string;
+}): string {
+	const { site, path } = document.value;
+
+	// If site is an AT URI, we'll use our local route
+	if (site.startsWith('at://')) {
+		return `/documents/${getDocumentSlug(document as any)}`;
+	}
+
+	// If site is HTTPS and we have a path, combine them
+	if (path) {
+		return `${site.replace(/\/$/, '')}/${path.replace(/^\//, '')}`;
+	}
+
+	// Fallback to local route
+	return `/documents/${extractRkey(document.uri)}`;
+}

packages/svelte-standard-site/src/lib/utils/theme-helpers.ts

···
+import type { BasicTheme } from '../types.js';
+import { rgbToCSS } from './theme.js';
+
+/**
+ * Generate color-mix CSS for theme colors with transparency
+ */
+export function mixThemeColor(variable: string, opacity: number, fallback = 'transparent'): string {
+	return `color-mix(in srgb, var(${variable}) ${opacity}%, ${fallback})`;
+}
+
+/**
+ * Get theme-aware color styles for text
+ */
+export function getThemedTextColor(
+	hasTheme: boolean,
+	opacity = 100
+): {
+	color?: string;
+} {
+	if (!hasTheme) return {};
+	return opacity === 100
+		? { color: 'var(--theme-foreground)' }
+		: { color: mixThemeColor('--theme-foreground', opacity) };
+}
+
+/**
+ * Get theme-aware background color
+ */
+export function getThemedBackground(
+	hasTheme: boolean,
+	opacity?: number
+): {
+	backgroundColor?: string;
+} {
+	if (!hasTheme) return {};
+	if (opacity === undefined) {
+		return { backgroundColor: 'var(--theme-background)' };
+	}
+	return { backgroundColor: mixThemeColor('--theme-background', opacity) };
+}
+
+/**
+ * Get theme-aware border color
+ */
+export function getThemedBorder(
+	hasTheme: boolean,
+	opacity = 20
+): {
+	borderColor?: string;
+} {
+	if (!hasTheme) return {};
+	return { borderColor: mixThemeColor('--theme-foreground', opacity) };
+}
+
+/**
+ * Get theme-aware accent color
+ */
+export function getThemedAccent(
+	hasTheme: boolean,
+	opacity?: number
+): {
+	color?: string;
+	backgroundColor?: string;
+} {
+	if (!hasTheme) return {};
+	if (opacity === undefined) {
+		return { color: 'var(--theme-accent)' };
+	}
+	return {
+		backgroundColor: mixThemeColor('--theme-accent', opacity),
+		color: 'var(--theme-accent)'
+	};
+}
+
+/**
+ * Convert BasicTheme to CSS custom properties
+ */
+export function themeToCssVars(theme?: BasicTheme): Record<string, string> {
+	if (!theme) return {};
+
+	return {
+		'--theme-background': rgbToCSS(theme.background),
+		'--theme-foreground': rgbToCSS(theme.foreground),
+		'--theme-accent': rgbToCSS(theme.accent),
+		'--theme-accent-foreground': rgbToCSS(theme.accentForeground)
+	};
+}

packages/svelte-standard-site/src/lib/utils/theme.ts

···
+import type { RGBColor } from '../types.js';
+
+/**
+ * Convert RGB color object to CSS rgb() string
+ */
+export function rgbToCSS(color: RGBColor): string {
+	return `rgb(${color.r}, ${color.g}, ${color.b})`;
+}
+
+/**
+ * Convert RGB color object to hex string
+ */
+export function rgbToHex(color: RGBColor): string {
+	const toHex = (n: number) => n.toString(16).padStart(2, '0');
+	return `#${toHex(color.r)}${toHex(color.g)}${toHex(color.b)}`;
+}
+
+/**
+ * Get theme CSS variables from BasicTheme
+ */
+export function getThemeVars(theme: {
+	background: RGBColor;
+	foreground: RGBColor;
+	accent: RGBColor;
+	accentForeground: RGBColor;
+}): Record<string, string> {
+	return {
+		'--theme-background': rgbToCSS(theme.background),
+		'--theme-foreground': rgbToCSS(theme.foreground),
+		'--theme-accent': rgbToCSS(theme.accent),
+		'--theme-accent-foreground': rgbToCSS(theme.accentForeground)
+	};
+}

packages/svelte-standard-site/src/lib/utils/verification.ts

···
+/**
+ * Verification utilities for proving content ownership
+ *
+ * Creates `.well-known` endpoints and `<link>` tags to verify that
+ * you own the content published to ATProto.
+ *
+ * @example
+ * ```ts
+ * // SvelteKit endpoint: src/routes/.well-known/site.standard.publication/+server.ts
+ * import { generatePublicationWellKnown } from 'svelte-standard-site/verification';
+ * import { text } from '@sveltejs/kit';
+ *
+ * export function GET() {
+ *   return text(
+ *     generatePublicationWellKnown({
+ *       did: 'did:plc:xxx',
+ *       publicationRkey: '3abc123xyz',
+ *     })
+ *   );
+ * }
+ * ```
+ */
+
+/**
+ * Parse an AT-URI to extract its components
+ */
+export function parseAtUri(uri: string): { did: string; collection: string; rkey: string } | null {
+	const match = uri.match(/^at:\/\/([^/]+)\/([^/]+)\/(.+)$/);
+	if (!match) return null;
+	return {
+		did: match[1],
+		collection: match[2],
+		rkey: match[3]
+	};
+}
+
+/**
+ * Build an AT-URI for a document
+ */
+export function getDocumentAtUri(did: string, rkey: string): string {
+	return `at://${did}/site.standard.document/${rkey}`;
+}
+
+/**
+ * Build an AT-URI for a publication
+ */
+export function getPublicationAtUri(did: string, rkey: string): string {
+	return `at://${did}/site.standard.publication/${rkey}`;
+}
+
+/**
+ * Generate content for /.well-known/site.standard.publication endpoint
+ *
+ * This endpoint proves you own your publication record on ATProto.
+ *
+ * @example
+ * ```ts
+ * // src/routes/.well-known/site.standard.publication/+server.ts
+ * import { generatePublicationWellKnown } from 'svelte-standard-site/verification';
+ * import { text } from '@sveltejs/kit';
+ *
+ * export function GET() {
+ *   return text(
+ *     generatePublicationWellKnown({
+ *       did: 'did:plc:xxx',
+ *       publicationRkey: '3abc123xyz',
+ *     })
+ *   );
+ * }
+ * ```
+ */
+export function generatePublicationWellKnown(options: {
+	did: string;
+	publicationRkey: string;
+}): string {
+	return getPublicationAtUri(options.did, options.publicationRkey);
+}
+
+/**
+ * Generate a <link> tag for document verification
+ *
+ * Add this to your document's <head> to verify ownership.
+ *
+ * @example
+ * ```svelte
+ * <svelte:head>
+ *   {@html generateDocumentLinkTag({
+ *     did: 'did:plc:xxx',
+ *     documentRkey: '3xyz789abc',
+ *   })}
+ * </svelte:head>
+ * ```
+ */
+export function generateDocumentLinkTag(options: { did: string; documentRkey: string }): string {
+	const atUri = getDocumentAtUri(options.did, options.documentRkey);
+	return `<link rel="site.standard.document" href="${atUri}">`;
+}
+
+/**
+ * Generate a <link> tag for publication verification
+ *
+ * Add this to your site's <head> to verify publication ownership.
+ *
+ * @example
+ * ```svelte
+ * <svelte:head>
+ *   {@html generatePublicationLinkTag({
+ *     did: 'did:plc:xxx',
+ *     publicationRkey: '3abc123xyz',
+ *   })}
+ * </svelte:head>
+ * ```
+ */
+export function generatePublicationLinkTag(options: {
+	did: string;
+	publicationRkey: string;
+}): string {
+	const atUri = getPublicationAtUri(options.did, options.publicationRkey);
+	return `<link rel="site.standard.publication" href="${atUri}">`;
+}
+
+/**
+ * Verify that a well-known endpoint returns the expected AT-URI
+ *
+ * @example
+ * ```ts
+ * const isValid = await verifyPublicationWellKnown(
+ *   'https://yourblog.com',
+ *   'did:plc:xxx',
+ *   '3abc123xyz'
+ * );
+ * ```
+ */
+export async function verifyPublicationWellKnown(
+	siteUrl: string,
+	did: string,
+	publicationRkey: string
+): Promise<boolean> {
+	try {
+		const cleanUrl = siteUrl.replace(/\/$/, '');
+		const response = await fetch(`${cleanUrl}/.well-known/site.standard.publication`);
+
+		if (!response.ok) return false;
+
+		const content = await response.text();
+		const expectedUri = getPublicationAtUri(did, publicationRkey);
+
+		return content.trim() === expectedUri;
+	} catch (error) {
+		console.error('Failed to verify publication well-known:', error);
+		return false;
+	}
+}
+
+/**
+ * Extract AT-URI from a <link> tag in HTML
+ *
+ * @example
+ * ```ts
+ * const html = '<link rel="site.standard.document" href="at://did:plc:xxx/site.standard.document/3xyz">';
+ * const uri = extractDocumentLinkFromHtml(html);
+ * // => 'at://did:plc:xxx/site.standard.document/3xyz'
+ * ```
+ */
+export function extractDocumentLinkFromHtml(html: string): string | null {
+	const match = html.match(
+		/<link\s+rel="site\.standard\.document"\s+href="(at:\/\/[^"]+)"\s*\/?>/i
+	);
+	return match ? match[1] : null;
+}
+
+/**
+ * Extract publication AT-URI from a <link> tag in HTML
+ */
+export function extractPublicationLinkFromHtml(html: string): string | null {
+	const match = html.match(
+		/<link\s+rel="site\.standard\.publication"\s+href="(at:\/\/[^"]+)"\s*\/?>/i
+	);
+	return match ? match[1] : null;
+}

packages/svelte-standard-site/src/routes/+layout.svelte

···
+<script lang="ts">
+	import '../lib/styles/base.css';
+	import type { Snippet } from 'svelte';
+
+	interface Props {
+		children: Snippet;
+	}
+
+	let { children }: Props = $props();
+</script>
+
+{@render children()}

packages/svelte-standard-site/src/routes/+page.server.ts

···
+import { createClient } from '$lib/index.js';
+import { getConfigFromEnv } from '$lib/config/env.js';
+import type { PageServerLoad } from './$types.js';
+
+export const load: PageServerLoad = async ({ fetch }) => {
+	const config = getConfigFromEnv();
+
+	if (!config) {
+		return {
+			error: 'Missing configuration. Please set PUBLIC_ATPROTO_DID in your .env file.',
+			publications: [],
+			documents: []
+		};
+	}
+
+	const client = createClient(config);
+
+	try {
+		const [publications, documents] = await Promise.all([
+			client.fetchAllPublications(fetch),
+			client.fetchAllDocuments(fetch)
+		]);
+
+		const pds = await client.getPDS(fetch);
+
+		return {
+			config,
+			publications: JSON.parse(JSON.stringify(publications)),
+			documents: JSON.parse(JSON.stringify(documents)),
+			pds
+		};
+	} catch (error) {
+		console.error('Failed to load data:', error);
+		return {
+			error: error instanceof Error ? error.message : 'Failed to load data',
+			publications: [],
+			documents: []
+		};
+	}
+};

packages/svelte-standard-site/src/routes/+page.svelte

···
+<script lang="ts">
+	import type { PageData } from './$types.js';
+	import { PublicationCard, DocumentCard, StandardSiteLayout } from '$lib/components/index.js';
+
+	const { data }: { data: PageData } = $props();
+</script>
+
+<svelte:head>
+	<title>svelte-standard-site - Showcase</title>
+	<meta
+		name="description"
+		content="A SvelteKit library for fetching site.standard.* records from AT Protocol"
+	/>
+</svelte:head>
+
+<StandardSiteLayout title="svelte-standard-site" showThemeToggle={true}>
+	<div class="mx-auto max-w-7xl">
+		<!-- Hero Section -->
+		<header class="mb-16 text-center">
+			<h1 class="text-ink-900 dark:text-ink-50 mb-4 text-5xl font-bold tracking-tight">
+				svelte-standard-site
+			</h1>
+			<p class="text-ink-700 dark:text-ink-200 mx-auto mb-6 max-w-2xl text-xl">
+				A powerful SvelteKit library for fetching <code
+					class="bg-canvas-200 dark:bg-canvas-800 rounded px-2 py-1 text-base">site.standard.*</code
+				> records from the AT Protocol ecosystem
+			</p>
+			<div class="flex items-center justify-center gap-4">
+				<a
+					href="https://github.com/ewanc26/svelte-standard-site"
+					target="_blank"
+					rel="noopener noreferrer"
+					class="bg-primary-600 hover:bg-primary-700 focus-visible:outline-primary-600 dark:bg-primary-500 dark:hover:bg-primary-600 rounded-lg px-6 py-3 font-semibold text-white transition focus-visible:outline-2 focus-visible:outline-offset-2"
+				>
+					View on GitHub
+				</a>
+			</div>
+		</header>
+
+		{#if data.error}
+			<!-- Error State -->
+			<div
+				class="border-accent-300 bg-accent-50 dark:border-accent-700 dark:bg-accent-950 mb-12 rounded-xl border-2 p-8"
+			>
+				<div class="flex items-start gap-4">
+					<svg
+						class="text-accent-600 dark:text-accent-400 size-6 shrink-0"
+						fill="none"
+						viewBox="0 0 24 24"
+						stroke="currentColor"
+					>
+						<path
+							stroke-linecap="round"
+							stroke-linejoin="round"
+							stroke-width="2"
+							d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
+						/>
+					</svg>
+					<div class="flex-1">
+						<h2 class="text-accent-900 dark:text-accent-50 mb-2 text-xl font-bold">
+							Configuration Error
+						</h2>
+						<p class="text-accent-800 dark:text-accent-200 mb-4">{data.error}</p>
+						<div class="bg-canvas-50 dark:bg-canvas-950 rounded-lg p-4">
+							<p class="text-ink-900 dark:text-ink-50 mb-2 font-semibold">Quick Fix:</p>
+							<ol class="text-ink-700 dark:text-ink-200 list-inside list-decimal space-y-2 text-sm">
+								<li>
+									Create a <code class="bg-canvas-200 dark:bg-canvas-800 rounded px-2 py-1"
+										>.env</code
+									> file in your project root
+								</li>
+								<li>
+									Add: <code class="bg-canvas-200 dark:bg-canvas-800 rounded px-2 py-1"
+										>PUBLIC_ATPROTO_DID=your-did-here</code
+									>
+								</li>
+								<li>Restart your dev server</li>
+							</ol>
+						</div>
+					</div>
+				</div>
+			</div>
+		{:else}
+			<!-- Configuration Info -->
+			<section class="bg-primary-50 dark:bg-primary-950 mb-16 rounded-xl p-8">
+				<h2 class="text-ink-900 dark:text-ink-50 mb-6 text-2xl font-bold">Active Configuration</h2>
+				<div class="grid gap-6 md:grid-cols-2">
+					<div class="bg-canvas-50 dark:bg-canvas-950 rounded-lg p-6 shadow-sm">
+						<dt class="text-ink-700 dark:text-ink-200 mb-2 text-sm font-medium">DID</dt>
+						<dd class="text-ink-900 dark:text-ink-50 font-mono text-sm break-all">
+							{data.config?.did}
+						</dd>
+					</div>
+					<div class="bg-canvas-50 dark:bg-canvas-950 rounded-lg p-6 shadow-sm">
+						<dt class="text-ink-700 dark:text-ink-200 mb-2 text-sm font-medium">PDS Endpoint</dt>
+						<dd class="text-ink-900 dark:text-ink-50 font-mono text-sm break-all">
+							{data.pds || 'Auto-resolved'}
+						</dd>
+					</div>
+				</div>
+			</section>
+
+			<!-- Publications Section -->
+			<section class="mb-16">
+				<div class="mb-8 flex items-end justify-between gap-4">
+					<div class="min-w-0 flex-1">
+						<h2 class="text-ink-900 dark:text-ink-50 text-3xl font-bold">Publications</h2>
+						<p class="text-ink-700 dark:text-ink-200 mt-2">
+							site.standard.publication records from the configured repository
+						</p>
+					</div>
+					<div
+						class="bg-primary-100 text-primary-800 dark:bg-primary-900 dark:text-primary-100 rounded-full px-4 py-2 text-sm font-semibold whitespace-nowrap"
+					>
+						{data.publications.length} found
+					</div>
+				</div>
+				{#if data.publications.length === 0}
+					<div
+						class="border-canvas-300 dark:border-canvas-700 rounded-xl border-2 border-dashed p-12 text-center"
+					>
+						<svg
+							class="text-ink-500 dark:text-ink-400 mx-auto mb-4 size-12"
+							fill="none"
+							viewBox="0 0 24 24"
+							stroke="currentColor"
+						>
+							<path
+								stroke-linecap="round"
+								stroke-linejoin="round"
+								stroke-width="2"
+								d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
+							/>
+						</svg>
+						<h3 class="text-ink-900 dark:text-ink-50 mb-2 text-lg font-semibold">
+							No Publications Found
+						</h3>
+						<p class="text-ink-700 dark:text-ink-200">
+							This repository doesn't have any <code
+								class="bg-canvas-200 dark:bg-canvas-800 rounded px-2 py-1"
+								>site.standard.publication</code
+							> records yet.
+						</p>
+					</div>
+				{:else}
+					<div class="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
+						{#each data.publications as publication}
+							<PublicationCard {publication} />
+						{/each}
+					</div>
+				{/if}
+			</section>
+
+			<!-- Documents Section -->
+			<section>
+				<div class="mb-8 flex items-end justify-between gap-4">
+					<div class="min-w-0 flex-1">
+						<h2 class="text-ink-900 dark:text-ink-50 text-3xl font-bold">Documents</h2>
+						<p class="text-ink-700 dark:text-ink-200 mt-2">
+							<code class="bg-canvas-200 dark:bg-canvas-800 rounded px-2 py-1"
+								>site.standard.document</code
+							> records, sorted by publication date
+						</p>
+					</div>
+					<div
+						class="bg-secondary-100 text-secondary-800 dark:bg-secondary-900 dark:text-secondary-100 rounded-full px-4 py-2 text-sm font-semibold whitespace-nowrap"
+					>
+						{data.documents.length} found
+					</div>
+				</div>
+				{#if data.documents.length === 0}
+					<div
+						class="border-canvas-300 dark:border-canvas-700 rounded-xl border-2 border-dashed p-12 text-center"
+					>
+						<svg
+							class="text-ink-500 dark:text-ink-400 mx-auto mb-4 size-12"
+							fill="none"
+							viewBox="0 0 24 24"
+							stroke="currentColor"
+						>
+							<path
+								stroke-linecap="round"
+								stroke-linejoin="round"
+								stroke-width="2"
+								d="M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z"
+							/>
+						</svg>
+						<h3 class="text-ink-900 dark:text-ink-50 mb-2 text-lg font-semibold">
+							No Documents Found
+						</h3>
+						<p class="text-ink-700 dark:text-ink-200">
+							This repository doesn't have any <code
+								class="bg-canvas-200 dark:bg-canvas-800 rounded px-2 py-1"
+								>site.standard.document</code
+							> records yet.
+						</p>
+					</div>
+				{:else}
+					<div class="space-y-6">
+						{#each data.documents as document}
+							{@const publication =
+								data.publications.find((pub: { uri: any }) => pub.uri === document.value.site) ??
+								undefined}
+							<DocumentCard {document} {publication} />
+						{/each}
+					</div>
+				{/if}
+			</section>
+		{/if}
+	</div>
+</StandardSiteLayout>

packages/svelte-standard-site/src/routes/[pub_rkey]/[doc_rkey]/+page.server.ts

···
+import { createClient } from '$lib/index.js';
+import { getConfigFromEnv } from '$lib/config/env.js';
+import { extractRkey } from '$lib/utils/document.js';
+import { error } from '@sveltejs/kit';
+import type { PageServerLoad } from './$types.js';
+
+export const load: PageServerLoad = async ({ params, fetch }) => {
+	const config = getConfigFromEnv();
+
+	if (!config) {
+		throw error(500, 'Missing configuration. Please set PUBLIC_ATPROTO_DID in your .env file.');
+	}
+
+	const client = createClient(config);
+	const { pub_rkey, doc_rkey } = params;
+
+	try {
+		// 1. Fetch the specific document by its rkey
+		// Assuming client.fetchDocument exists; if not, use fetchAllDocuments and find
+		const documents = await client.fetchAllDocuments(fetch);
+
+		const document = documents.find((doc) => {
+			const rkey = extractRkey(doc.uri);
+			const parentPubRkey = extractRkey(doc.value.site);
+			// Validate both the document rkey AND that it belongs to the publication in the URL
+			return rkey === doc_rkey && parentPubRkey === pub_rkey;
+		});
+
+		if (!document) {
+			throw error(404, 'Document not found under this publication');
+		}
+
+		// 2. Fetch the publication metadata
+		const publication = await client.fetchPublication(pub_rkey, fetch);
+
+		if (!publication) {
+			throw error(404, 'Publication not found');
+		}
+
+		// 3. Return sanitized data to prevent "non-POJO" serialization errors
+		return {
+			document: JSON.parse(JSON.stringify(document)),
+			publication: JSON.parse(JSON.stringify(publication)),
+			config
+		};
+	} catch (err) {
+		console.error('Failed to load document:', err);
+		if (err && typeof err === 'object' && 'status' in err) {
+			throw err;
+		}
+		throw error(500, 'Failed to load document');
+	}
+};

packages/svelte-standard-site/src/routes/[pub_rkey]/[doc_rkey]/+page.svelte

···
+<script lang="ts">
+	import type { PageData } from './$types.js';
+	import { getThemeVars } from '$lib/utils/theme.js';
+	import { extractRkey } from '$lib/utils/document.js';
+	import { ThemedContainer, ThemedText, DateDisplay, TagList } from '$lib/components/index.js';
+	import { mixThemeColor } from '$lib/utils/theme-helpers.js';
+	import DocumentRenderer from '$lib/components/document/DocumentRenderer.svelte';
+
+	const { data }: { data: PageData } = $props();
+
+	const themeVars = $derived(
+		data.publication?.value.basicTheme ? getThemeVars(data.publication.value.basicTheme) : {}
+	);
+	const hasTheme = $derived(!!data.publication?.value.basicTheme);
+</script>
+
+<svelte:head>
+	<title>{data.document.value.title}</title>
+	{#if data.document.value.description}
+		<meta name="description" content={data.document.value.description} />
+	{/if}
+	{#if hasTheme}
+		<!-- prettier-ignore -->
+		<style>
+			body {{
+				background-color: {themeVars['--theme-background'] || 'var(--color-canvas-50)'} !important;
+			}}
+		</style>
+	{/if}
+</svelte:head>
+
+<ThemedContainer theme={data.publication?.value.basicTheme} class="flex flex-col">
+	<!-- Header Bar -->
+	<header
+		class="sticky top-0 z-10 border-b backdrop-blur-sm"
+		style:border-color={hasTheme ? mixThemeColor('--theme-foreground', 15) : undefined}
+		style:background-color={hasTheme ? mixThemeColor('--theme-background', 80) : undefined}
+	>
+		<nav class="mx-auto flex max-w-4xl items-center justify-between px-6 py-4">
+			<a
+				href="/"
+				class="group flex items-center gap-2 text-sm font-medium transition-all hover:gap-3"
+				style:color={hasTheme ? 'var(--theme-accent)' : undefined}
+			>
+				<svg
+					class="size-4 transition-transform group-hover:-translate-x-0.5"
+					fill="none"
+					viewBox="0 0 24 24"
+					stroke="currentColor"
+					stroke-width="2.5"
+				>
+					<path stroke-linecap="round" stroke-linejoin="round" d="M10 19l-7-7m0 0l7-7m-7 7h18" />
+				</svg>
+				Back to Home
+			</a>
+
+			{#if data.publication}
+				<a
+					href={data.publication.value.url || '/'}
+					target={data.publication.value.url ? '_blank' : undefined}
+					rel={data.publication.value.url ? 'noopener noreferrer' : undefined}
+					class="flex items-center gap-2 transition-opacity hover:opacity-70"
+				>
+					{#if data.publication.value.icon}
+						<img
+							src={data.publication.value.icon}
+							alt="{data.publication.value.name} icon"
+							class="size-6 rounded object-cover"
+						/>
+					{/if}
+					<ThemedText {hasTheme} element="span" class="text-sm font-semibold">
+						{data.publication.value.name}
+					</ThemedText>
+				</a>
+			{/if}
+		</nav>
+	</header>
+
+	<!-- Main Content -->
+	<article class="mx-auto max-w-3xl px-6 py-12">
+		<!-- Title Section -->
+		<header class="mb-12">
+			<ThemedText {hasTheme} element="h1" class="mb-6 text-5xl font-bold leading-tight tracking-tight">
+				{data.document.value.title}
+			</ThemedText>
+
+			<div
+				class="flex flex-wrap items-center gap-4 text-sm"
+				style:color={hasTheme ? mixThemeColor('--theme-foreground', 60) : undefined}
+			>
+				<DateDisplay date={data.document.value.publishedAt} />
+				{#if data.document.value.updatedAt}
+					<span
+						class="flex items-center gap-1.5"
+						style:color={hasTheme ? mixThemeColor('--theme-foreground', 50) : undefined}
+					>
+						<svg class="size-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+							<path
+								stroke-linecap="round"
+								stroke-linejoin="round"
+								stroke-width="2"
+								d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"
+							/>
+						</svg>
+						Updated <DateDisplay date={data.document.value.updatedAt} />
+					</span>
+				{/if}
+			</div>
+		</header>
+
+		<!-- Cover Image -->
+		{#if data.document.value.coverImage}
+			<div class="-mx-6 mb-12 sm:mx-0">
+				<img
+					src={data.document.value.coverImage}
+					alt="{data.document.value.title} cover"
+					class="w-full rounded-none object-cover sm:rounded-2xl"
+					style="max-height: 28rem; object-position: center;"
+				/>
+			</div>
+		{/if}
+
+		<!-- Document Content -->
+		<DocumentRenderer document={data.document.value} {hasTheme} />
+
+		<!-- Tags -->
+		{#if data.document.value.tags && data.document.value.tags.length > 0}
+			<div class="mt-16 pt-8">
+				<TagList tags={data.document.value.tags} {hasTheme} />
+			</div>
+		{/if}
+
+		<!-- Bluesky Reference -->
+		{#if data.document.value.bskyPostRef}
+			<div
+				class="mt-12 rounded-2xl border p-6"
+				style:border-color={hasTheme ? mixThemeColor('--theme-accent', 30) : undefined}
+				style:background-color={hasTheme ? mixThemeColor('--theme-accent', 10) : undefined}
+			>
+				<a
+					href="https://bsky.app/profile/{data.config?.did}/post/{extractRkey(
+						data.document.value.bskyPostRef.uri
+					)}"
+					target="_blank"
+					rel="noopener noreferrer"
+					class="flex items-center gap-3 font-medium transition-all hover:gap-4"
+					style:color={hasTheme ? 'var(--theme-accent)' : undefined}
+				>
+					<svg class="size-5 shrink-0" fill="currentColor" viewBox="0 0 24 24">
+						<path
+							d="M12 10.8c-1.087-2.114-4.046-6.053-6.798-7.995C2.566.944 1.561 1.266.902 1.565.139 1.908 0 3.08 0 3.768c0 .69.378 5.65.624 6.479.815 2.736 3.713 3.66 6.383 3.364.136-.02.275-.039.415-.056-.138.022-.276.04-.415.056-3.912.58-7.387 2.005-2.83 7.078 5.013 5.19 6.87-1.113 7.823-4.308.953 3.195 2.05 9.271 7.733 4.308 4.267-4.308 1.172-6.498-2.74-7.078a8.741 8.741 0 0 1-.415-.056c.14.017.279.036.415.056 2.67.297 5.568-.628 6.383-3.364.246-.828.624-5.79.624-6.478 0-.69-.139-1.861-.902-2.206-.659-.298-1.664-.62-4.3 1.24C16.046 4.748 13.087 8.687 12 10.8Z"
+						/>
+					</svg>
+					<span>Continue the conversation on Bluesky</span>
+					<svg class="size-4 shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+						<path
+							stroke-linecap="round"
+							stroke-linejoin="round"
+							stroke-width="2"
+							d="M14 5l7 7m0 0l-7 7m7-7H3"
+						/>
+					</svg>
+				</a>
+			</div>
+		{/if}
+	</article>
+
+	<!-- Footer -->
+	<footer
+		class="mt-auto border-t py-8"
+		style:border-color={hasTheme ? mixThemeColor('--theme-foreground', 15) : undefined}
+	>
+		<div class="mx-auto max-w-3xl px-6 text-center">
+			<p
+				class="text-sm"
+				style:color={hasTheme ? mixThemeColor('--theme-foreground', 50) : undefined}
+			>
+				Powered by
+				<a
+					href="https://atproto.com"
+					target="_blank"
+					rel="noopener noreferrer"
+					class="font-medium underline decoration-1 underline-offset-2 transition-all hover:decoration-2"
+					style:color={hasTheme ? 'var(--theme-accent)' : undefined}
+				>
+					AT Protocol
+				</a>
+			</p>
+		</div>
+	</footer>
+</ThemedContainer>

packages/svelte-standard-site/src/routes/layout.css

···
+@import 'tailwindcss';
+@plugin '@tailwindcss/typography';

packages/svelte-standard-site/static/favicon.svg

···
+<svg xmlns="http://www.w3.org/2000/svg" width="107" height="128" viewBox="0 0 107 128"><title>svelte-logo</title><path d="M94.157 22.819c-10.4-14.885-30.94-19.297-45.792-9.835L22.282 29.608A29.92 29.92 0 0 0 8.764 49.65a31.5 31.5 0 0 0 3.108 20.231 30 30 0 0 0-4.477 11.183 31.9 31.9 0 0 0 5.448 24.116c10.402 14.887 30.942 19.297 45.791 9.835l26.083-16.624A29.92 29.92 0 0 0 98.235 78.35a31.53 31.53 0 0 0-3.105-20.232 30 30 0 0 0 4.474-11.182 31.88 31.88 0 0 0-5.447-24.116" style="fill:#ff3e00"/><path d="M45.817 106.582a20.72 20.72 0 0 1-22.237-8.243 19.17 19.17 0 0 1-3.277-14.503 18 18 0 0 1 .624-2.435l.49-1.498 1.337.981a33.6 33.6 0 0 0 10.203 5.098l.97.294-.09.968a5.85 5.85 0 0 0 1.052 3.878 6.24 6.24 0 0 0 6.695 2.485 5.8 5.8 0 0 0 1.603-.704L69.27 76.28a5.43 5.43 0 0 0 2.45-3.631 5.8 5.8 0 0 0-.987-4.371 6.24 6.24 0 0 0-6.698-2.487 5.7 5.7 0 0 0-1.6.704l-9.953 6.345a19 19 0 0 1-5.296 2.326 20.72 20.72 0 0 1-22.237-8.243 19.17 19.17 0 0 1-3.277-14.502 17.99 17.99 0 0 1 8.13-12.052l26.081-16.623a19 19 0 0 1 5.3-2.329 20.72 20.72 0 0 1 22.237 8.243 19.17 19.17 0 0 1 3.277 14.503 18 18 0 0 1-.624 2.435l-.49 1.498-1.337-.98a33.6 33.6 0 0 0-10.203-5.1l-.97-.294.09-.968a5.86 5.86 0 0 0-1.052-3.878 6.24 6.24 0 0 0-6.696-2.485 5.8 5.8 0 0 0-1.602.704L37.73 51.72a5.42 5.42 0 0 0-2.449 3.63 5.79 5.79 0 0 0 .986 4.372 6.24 6.24 0 0 0 6.698 2.486 5.8 5.8 0 0 0 1.602-.704l9.952-6.342a19 19 0 0 1 5.295-2.328 20.72 20.72 0 0 1 22.237 8.242 19.17 19.17 0 0 1 3.277 14.503 18 18 0 0 1-8.13 12.053l-26.081 16.622a19 19 0 0 1-5.3 2.328" style="fill:#fff"/></svg>

packages/svelte-standard-site/svelte.config.js

···
+import adapter from '@sveltejs/adapter-auto';
+import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
+
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
+	// Consult https://svelte.dev/docs/kit/integrations
+	// for more information about preprocessors
+	preprocess: vitePreprocess(),
+
+	kit: {
+		// adapter-auto only supports some environments, see https://svelte.dev/docs/kit/adapter-auto for a list.
+		// If your environment is not supported, or you settled on a specific environment, switch out the adapter.
+		// See https://svelte.dev/docs/kit/adapters for more information about adapters.
+		adapter: adapter()
+	}
+};
+
+export default config;

packages/svelte-standard-site/tsconfig.json

···
+{
+	"extends": "./.svelte-kit/tsconfig.json",
+	"compilerOptions": {
+		"rewriteRelativeImportExtensions": true,
+		"allowJs": true,
+		"checkJs": true,
+		"forceConsistentCasingInFileNames": true,
+		"resolveJsonModule": true,
+		"skipLibCheck": true,
+		"sourceMap": true,
+		"strict": true,
+		"module": "NodeNext",
+		"moduleResolution": "NodeNext"
+	}
+}

packages/svelte-standard-site/vite.config.ts

···
+import tailwindcss from '@tailwindcss/vite';
+import { sveltekit } from '@sveltejs/kit/vite';
+import { defineConfig } from 'vite';
+
+export default defineConfig({ plugins: [tailwindcss(), sveltekit()] });

packages/svelte-standard-site/vitest.config.ts

···
+import { defineConfig } from 'vitest/config';
+import { svelte } from '@sveltejs/vite-plugin-svelte';
+
+export default defineConfig({
+	plugins: [svelte()],
+	test: {
+		globals: true,
+		environment: 'jsdom'
+	}
+});