diff --git a/TODO.md b/TODO.md
new file mode 100644
index 0000000..7ac2fdb
--- /dev/null
+++ b/TODO.md
@@ -0,0 +1,83 @@
+# TODO
+
+## Lexicon Publisher
+
+Remaining issues from code review (2025-12-23).
+
+### Important
+
+#### CSP `unsafe-inline` vulnerability
+**lexicon-publisher.html:7-9**
+
+The CSP includes `'unsafe-inline'` for both scripts and styles, which defeats much of the purpose of having a CSP. Requires major refactor to move inline scripts/styles to external files or use nonces.
+
+#### Pin quickslice to specific version
+**lexicon-publisher.html:777**
+
+Currently using `@main` branch which can change at any time. Pin to a specific commit or tag and add SRI integrity attribute.
+
+#### Validate DNS lookup inputs
+**lexicon-publisher.html:1802-1812**
+
+The `resolveDNS()` function directly uses user-controlled domain names without validation. Should validate domain names against RFC standards before DNS lookup.
+
+#### Full re-render performance
+**lexicon-publisher.html**
+
+`renderAllSteps()` rebuilds the entire UI on every state change, losing focus/scroll position. Consider targeted updates for specific UI sections.
+
+#### Accessibility improvements
+**lexicon-publisher.html**
+
+- Add `role="progressbar"` or `role="tablist"` for wizard
+- Add `aria-label` to buttons with only icons
+- Add `aria-live` regions for status messages
+- Add `aria-expanded` for collapsible sections
+- Make step headers keyboard navigable
+- Add escape key handler for dialogs
+
+### Medium
+
+#### `escapeAttr()` missing single quote escape
+**lexicon-publisher.html:940**
+
+Add `.replace(/'/g, "'")` to prevent attribute injection with single quotes.
+
+#### Domain extraction edge cases
+**lexicon-publisher.html:1672-1698**
+
+`getUserDomain()` assumes all domains are TLD + SLD (e.g., `example.com`). Fails for country-code TLDs like `.co.uk`. Consider using a public suffix list.
+
+#### No file count limit in ZIP
+**lexicon-publisher.html:2044-2051**
+
+While there's a check for zero files, there's no upper limit. A ZIP with thousands of files could freeze the browser. Add reasonable limit (e.g., 100 files).
+
+#### Clipboard API fallback
+**lexicon-publisher.html:1836-1840**
+
+No user feedback on success/failure and no fallback for older browsers. Add toast notification and `document.execCommand('copy')` fallback.
+
+#### OAuth callback race condition
+**lexicon-publisher.html:2130-2146**
+
+If `handleRedirectCallback()` fails, the URL still has `?code=...` but history is only replaced on success. Move `window.history.replaceState()` to a `finally` block.
+
+### Low Priority
+
+#### Split into multiple files
+**lexicon-publisher.html (2200+ lines)**
+
+Consider splitting into separate HTML, CSS, and JS files for maintainability. This would also help solve the CSP `unsafe-inline` issue.
+
+#### Add lexicon preview
+Users can't see what a lexicon defines without reading JSON. Add human-readable schema preview.
+
+#### Add export functionality
+Users can upload ZIPs but can't download their lexicons. Add "Export as ZIP" feature.
+
+#### Add schema templates
+Provide multiple templates: record, query, procedure, subscription.
+
+#### Real-time validation
+Add debounced validation as users type instead of only on "Continue to Publish".
diff --git a/docs/plans/2025-12-23-external-dependency-validation.md b/docs/plans/2025-12-23-external-dependency-validation.md
new file mode 100644
index 0000000..76e6a95
--- /dev/null
+++ b/docs/plans/2025-12-23-external-dependency-validation.md
@@ -0,0 +1,265 @@
+# External Dependency Validation Implementation Plan
+
+> **For Claude:** REQUIRED SUB-SKILL: Use superpowers:executing-plans to implement this plan task-by-task.
+
+**Goal:** Warn users when their lexicons reference external dependencies that aren't published.
+
+**Architecture:** After honk validation passes, extract all `ref` properties pointing to external NSIDs, batch-query the lexicons quickslice to check which exist, show yellow warnings for missing ones.
+
+**Tech Stack:** JavaScript, GraphQL (lexicons quickslice)
+
+---
+
+### Task 1: Add missingDependencies to state
+
+**Files:**
+- Modify: `lexicon-publisher.html:642-644`
+
+**Step 1: Add the new state property**
+
+Find this block:
+```javascript
+        // New: DNS instructions
+        dnsInstructions: [], // [{ domain, record, lexicons }]
+      };
+```
+
+Change to:
+```javascript
+        // New: DNS instructions
+        dnsInstructions: [], // [{ domain, record, lexicons }]
+
+        // New: External dependency check
+        missingDependencies: [], // [nsid, ...]
+      };
+```
+
+**Step 2: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat(lexicon-publisher): add missingDependencies state"
+```
+
+---
+
+### Task 2: Add extractExternalRefs function
+
+**Files:**
+- Modify: `lexicon-publisher.html` (after `getPublishableLexicons` function, around line 1097)
+
+**Step 1: Add the function**
+
+After the `getPublishableLexicons` function closing brace, add:
+
+```javascript
+      function extractExternalRefs(lexicons, userDomain) {
+        const refs = new Set();
+
+        function walk(obj) {
+          if (!obj || typeof obj !== 'object') return;
+          if (obj.ref && typeof obj.ref === 'string') {
+            const nsid = obj.ref.split('#')[0];
+            const domain = getDomainAuthority(nsid);
+            if (domain !== userDomain && !domain.endsWith('.' + userDomain)) {
+              refs.add(nsid);
+            }
+          }
+          for (const val of Object.values(obj)) walk(val);
+        }
+
+        for (const lex of lexicons) walk(lex);
+        return [...refs];
+      }
+```
+
+**Step 2: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat(lexicon-publisher): add extractExternalRefs function"
+```
+
+---
+
+### Task 3: Add checkExternalDependencies function
+
+**Files:**
+- Modify: `lexicon-publisher.html` (after `extractExternalRefs`)
+
+**Step 1: Add the function**
+
+After `extractExternalRefs`, add:
+
+```javascript
+      async function checkExternalDependencies(externalNsids) {
+        if (externalNsids.length === 0) return { found: [], missing: [] };
+
+        try {
+          const result = await state.client.query(`
+            query CheckDeps($nsids: [String!]!) {
+              comAtprotoLexiconSchema(
+                first: 100,
+                where: { id: { in: $nsids } }
+              ) {
+                edges {
+                  node { id }
+                }
+              }
+            }
+          `, { nsids: externalNsids });
+
+          const foundIds = (result?.comAtprotoLexiconSchema?.edges || [])
+            .map(e => e.node.id);
+
+          return {
+            found: externalNsids.filter(n => foundIds.includes(n)),
+            missing: externalNsids.filter(n => !foundIds.includes(n)),
+          };
+        } catch (err) {
+          console.error("External dependency check failed:", err);
+          return { found: [], missing: [] };
+        }
+      }
+```
+
+**Step 2: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat(lexicon-publisher): add checkExternalDependencies function"
+```
+
+---
+
+### Task 4: Integrate into validateLexicons
+
+**Files:**
+- Modify: `lexicon-publisher.html:1396-1440` (validateLexicons function)
+
+**Step 1: Reset missingDependencies at start**
+
+Find:
+```javascript
+        state.result = null;
+        state.validationPassed = false;
+        state.conflicts = [];
+```
+
+Change to:
+```javascript
+        state.result = null;
+        state.validationPassed = false;
+        state.conflicts = [];
+        state.missingDependencies = [];
+```
+
+**Step 2: Add external dependency check after honk passes**
+
+Find:
+```javascript
+            // Check for conflicts if authenticated
+            if (state.viewer) {
+              await checkConflicts();
+            }
+```
+
+Change to:
+```javascript
+            // Check for external dependencies and conflicts if authenticated
+            if (state.viewer) {
+              const userDomain = getUserDomain(state.viewer.handle);
+              const externalRefs = extractExternalRefs(parseResult.lexicons, userDomain);
+              const { missing } = await checkExternalDependencies(externalRefs);
+              state.missingDependencies = missing;
+
+              await checkConflicts();
+            }
+```
+
+**Step 3: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat(lexicon-publisher): check external deps during validation"
+```
+
+---
+
+### Task 5: Update renderResult to show warnings
+
+**Files:**
+- Modify: `lexicon-publisher.html:1251-1266` (renderResult function)
+
+**Step 1: Add warning display after success message**
+
+Find:
+```javascript
+        section.innerHTML = `
+    <div class="result ${cls}" style="margin-top: 0.75rem;">${icon} ${esc(state.result.message)}</div>
+  `;
+      }
+```
+
+Change to:
+```javascript
+        let html = `<div class="result ${cls}" style="margin-top: 0.75rem;">${icon} ${esc(state.result.message)}</div>`;
+
+        if (state.missingDependencies.length > 0) {
+          html += `
+            <div class="warning-box" style="margin-top: 0.75rem;">
+              <strong>Missing external dependencies:</strong>
+              <ul style="margin: 0.5rem 0 0 1.25rem;">
+                ${state.missingDependencies.map(d => `<li>${esc(d)}</li>`).join('')}
+              </ul>
+            </div>
+          `;
+        }
+
+        section.innerHTML = html;
+      }
+```
+
+**Step 2: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat(lexicon-publisher): display missing dependency warnings"
+```
+
+---
+
+### Task 6: Manual test
+
+**Step 1: Test with external refs**
+
+1. Open lexicon-publisher in browser
+2. Sign in
+3. Upload or paste a lexicon that references an external type, e.g.:
+   ```json
+   {
+     "lexicon": 1,
+     "id": "slices.network.test",
+     "defs": {
+       "main": {
+         "type": "record",
+         "record": {
+           "type": "object",
+           "properties": {
+             "actor": { "type": "ref", "ref": "app.bsky.actor.defs#profileViewBasic" },
+             "fake": { "type": "ref", "ref": "com.fake.nonexistent#thing" }
+           }
+         }
+       }
+     }
+   }
+   ```
+4. Click Validate
+5. Verify: Success message appears, plus yellow warning box showing `com.fake.nonexistent` as missing (but not `app.bsky.actor.defs` if it's published)
+
+**Step 2: Final commit if needed**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat(lexicon-publisher): complete external dependency validation"
+```
diff --git a/docs/plans/2025-12-23-lexicon-publisher-wizard.md b/docs/plans/2025-12-23-lexicon-publisher-wizard.md
new file mode 100644
index 0000000..d132a1a
--- /dev/null
+++ b/docs/plans/2025-12-23-lexicon-publisher-wizard.md
@@ -0,0 +1,1193 @@
+# Lexicon Publisher Wizard Flow Implementation Plan
+
+> **For Claude:** REQUIRED SUB-SKILL: Use superpowers:executing-plans to implement this plan task-by-task.
+
+**Goal:** Transform lexicon-publisher into a 5-step wizard that guides first-time users through sign-in, lexicon definition, publishing, DNS verification, and viewing published lexicons.
+
+**Architecture:** Single-file HTML app refactored from section-based layout to step-based wizard. Each step renders as a collapsible container with visual states (current/completed/future). Step state machine controls progression and reset-on-edit behavior.
+
+**Tech Stack:** HTML/CSS/JS (inline), QuicksliceClient (OAuth/GraphQL), honk (validation), JSZip
+
+---
+
+## Task 1: Add Step State Management
+
+**Files:**
+- Modify: `lexicon-publisher.html:624-650` (state object)
+
+**Step 1: Add step state properties to state object**
+
+Find the state object and add these properties after `publishResult`:
+
+```javascript
+// Step wizard state
+currentStep: 1, // 1=SignIn, 2=Define, 3=Publish, 4=DNS, 5=Published
+stepCompleted: {
+  1: false, // Sign In
+  2: false, // Define Lexicons
+  3: false, // Publish
+  4: false, // Verify DNS (non-blocking)
+},
+```
+
+**Step 2: Verify change**
+
+Open `lexicon-publisher.html` in browser, open console, type `state.currentStep` - should return `1`.
+
+**Step 3: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "$(cat <<'EOF'
+feat(lexicon-publisher): add step wizard state management
+
+Add currentStep and stepCompleted to track wizard progression.
+EOF
+)"
+```
+
+---
+
+## Task 2: Add Step Navigation Helper Functions
+
+**Files:**
+- Modify: `lexicon-publisher.html` (after state object, ~line 651)
+
+**Step 1: Add step navigation functions**
+
+Add these functions after the state object:
+
+```javascript
+// =============================================================================
+// STEP NAVIGATION
+// =============================================================================
+
+function goToStep(stepNumber) {
+  if (stepNumber < 1 || stepNumber > 5) return;
+
+  // Can only go to completed steps or the next available step
+  const maxAllowedStep = getMaxAllowedStep();
+  if (stepNumber > maxAllowedStep) return;
+
+  state.currentStep = stepNumber;
+  renderAllSteps();
+}
+
+function getMaxAllowedStep() {
+  // Can go to step N+1 if step N is completed
+  for (let i = 1; i <= 4; i++) {
+    if (!state.stepCompleted[i]) return i;
+  }
+  return 5;
+}
+
+function completeStep(stepNumber) {
+  state.stepCompleted[stepNumber] = true;
+  state.currentStep = Math.min(stepNumber + 1, 5);
+  renderAllSteps();
+}
+
+function resetStepsFrom(stepNumber) {
+  // Reset this step and all downstream steps
+  for (let i = stepNumber; i <= 4; i++) {
+    state.stepCompleted[i] = false;
+  }
+  // Clear downstream state
+  if (stepNumber <= 2) {
+    state.validationPassed = false;
+    state.conflicts = [];
+    state.missingDependencies = [];
+    state.result = null;
+  }
+  if (stepNumber <= 3) {
+    state.publishResult = null;
+    state.publishResults = [];
+  }
+}
+
+function getStepSummary(stepNumber) {
+  switch (stepNumber) {
+    case 1:
+      return state.viewer ? `@${state.viewer.handle}` : '';
+    case 2:
+      const validCount = state.lexicons.filter(l => l.value.trim()).length;
+      return `${validCount} lexicon${validCount !== 1 ? 's' : ''} ready`;
+    case 3:
+      const publishedCount = state.publishResults.filter(r => r.success).length;
+      return `Published ${publishedCount} lexicon${publishedCount !== 1 ? 's' : ''}`;
+    case 4:
+      const verifiedCount = state.dnsInstructions.filter(d => d.verified === true).length;
+      const totalDns = state.dnsInstructions.length;
+      if (totalDns === 0) return 'No DNS needed';
+      if (verifiedCount === totalDns) return 'DNS verified';
+      return `${verifiedCount}/${totalDns} domains verified`;
+    default:
+      return '';
+  }
+}
+```
+
+**Step 2: Verify change**
+
+Open console, type `getMaxAllowedStep()` - should return `1`.
+
+**Step 3: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "$(cat <<'EOF'
+feat(lexicon-publisher): add step navigation helper functions
+
+Add goToStep, completeStep, resetStepsFrom, getStepSummary for wizard flow control.
+EOF
+)"
+```
+
+---
+
+## Task 3: Add Step Container CSS
+
+**Files:**
+- Modify: `lexicon-publisher.html:11-585` (style section)
+
+**Step 1: Add step container styles**
+
+Add before the closing `</style>` tag (~line 585):
+
+```css
+/* Step wizard styles */
+.step {
+  background: var(--bg-card);
+  border-radius: 0.5rem;
+  margin-bottom: 0.75rem;
+  border: 1px solid var(--border);
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
+  overflow: hidden;
+}
+
+.step-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 1rem;
+  cursor: pointer;
+  user-select: none;
+}
+
+.step-header:hover {
+  background: var(--bg-input);
+}
+
+.step-header-left {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+}
+
+.step-number {
+  width: 1.75rem;
+  height: 1.75rem;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 0.875rem;
+  font-weight: 600;
+  background: var(--border);
+  color: var(--text-secondary);
+}
+
+.step-title {
+  font-weight: 600;
+  font-size: 0.9375rem;
+}
+
+.step-summary {
+  font-size: 0.875rem;
+  color: var(--text-secondary);
+}
+
+.step-content {
+  padding: 0 1rem 1rem 1rem;
+  border-top: 1px solid var(--border);
+}
+
+/* Step states */
+.step.step-current .step-number {
+  background: var(--accent);
+  color: #ffffff;
+}
+
+.step.step-current .step-header {
+  cursor: default;
+}
+
+.step.step-current .step-header:hover {
+  background: transparent;
+}
+
+.step.step-completed .step-number {
+  background: var(--success-text);
+  color: #ffffff;
+}
+
+.step.step-completed .step-number::after {
+  content: '✓';
+}
+
+.step.step-completed .step-number span {
+  display: none;
+}
+
+.step.step-future {
+  opacity: 0.5;
+}
+
+.step.step-future .step-header {
+  cursor: not-allowed;
+}
+
+.step.step-future .step-header:hover {
+  background: transparent;
+}
+
+.step.step-collapsed .step-content {
+  display: none;
+}
+
+.step.step-collapsed .step-header {
+  border-bottom: none;
+}
+```
+
+**Step 2: Verify change**
+
+Reload page, check that styles are loaded (no CSS errors in console).
+
+**Step 3: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "$(cat <<'EOF'
+feat(lexicon-publisher): add step container CSS styles
+
+Add visual states for current, completed, future, and collapsed steps.
+EOF
+)"
+```
+
+---
+
+## Task 4: Create Step Container Render Function
+
+**Files:**
+- Modify: `lexicon-publisher.html` (in rendering section, ~line 816)
+
+**Step 1: Add renderStep helper function**
+
+Add before `renderAuthStatus()`:
+
+```javascript
+function renderStep(stepNumber, title, contentHtml) {
+  const isCompleted = state.stepCompleted[stepNumber];
+  const isCurrent = state.currentStep === stepNumber;
+  const isFuture = stepNumber > getMaxAllowedStep();
+  const isCollapsed = !isCurrent;
+
+  const classes = ['step'];
+  if (isCompleted) classes.push('step-completed');
+  if (isCurrent) classes.push('step-current');
+  if (isFuture) classes.push('step-future');
+  if (isCollapsed) classes.push('step-collapsed');
+
+  const summary = isCompleted ? getStepSummary(stepNumber) : '';
+  const clickHandler = !isCurrent && !isFuture ? `onclick="goToStep(${stepNumber})"` : '';
+
+  return `
+    <div class="${classes.join(' ')}" data-step="${stepNumber}">
+      <div class="step-header" ${clickHandler}>
+        <div class="step-header-left">
+          <div class="step-number"><span>${stepNumber}</span></div>
+          <span class="step-title">${esc(title)}</span>
+        </div>
+        ${summary ? `<span class="step-summary">${esc(summary)}</span>` : ''}
+      </div>
+      <div class="step-content">
+        ${contentHtml}
+      </div>
+    </div>
+  `;
+}
+```
+
+**Step 2: Verify change**
+
+Console: `renderStep(1, 'Test', '<p>Content</p>')` should return HTML string.
+
+**Step 3: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "$(cat <<'EOF'
+feat(lexicon-publisher): add renderStep helper function
+
+Creates step container HTML with proper state classes and click handlers.
+EOF
+)"
+```
+
+---
+
+## Task 5: Refactor to Step-Based Main Render
+
+**Files:**
+- Modify: `lexicon-publisher.html:601-606` (main element)
+- Modify: `lexicon-publisher.html` (add renderAllSteps function)
+
+**Step 1: Update main element HTML**
+
+Replace the main element content with a single container:
+
+```html
+<main id="steps-container">
+</main>
+```
+
+**Step 2: Add renderAllSteps function**
+
+Add after `renderStep` function:
+
+```javascript
+function renderAllSteps() {
+  const container = document.getElementById('steps-container');
+  if (!container) return;
+
+  container.innerHTML = [
+    renderStep(1, 'Sign In', renderSignInContent()),
+    renderStep(2, 'Define Lexicons', renderDefineLexiconsContent()),
+    renderStep(3, 'Publish', renderPublishContent()),
+    renderStep(4, 'Verify DNS', renderDnsContent()),
+    renderStep(5, 'Your Published Lexicons', renderPublishedLexiconsContent()),
+  ].join('');
+}
+```
+
+**Step 3: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "$(cat <<'EOF'
+feat(lexicon-publisher): add step-based main render structure
+
+Replace section-based layout with single steps container and renderAllSteps function.
+EOF
+)"
+```
+
+---
+
+## Task 6: Implement Step 1 - Sign In
+
+**Files:**
+- Modify: `lexicon-publisher.html` (add renderSignInContent function)
+
+**Step 1: Add renderSignInContent function**
+
+Add after `renderAllSteps`:
+
+```javascript
+function renderSignInContent() {
+  if (state.viewer) {
+    // Already signed in - show minimal confirmation
+    return `
+      <p style="color: var(--text-secondary);">
+        Signed in as <strong>@${esc(state.viewer.handle)}</strong>
+      </p>
+      <div class="button-row">
+        <button class="btn btn-secondary" onclick="handleLogout()">Sign Out</button>
+      </div>
+    `;
+  }
+
+  return `
+    <p style="color: var(--text-secondary); margin-bottom: 1rem;">
+      Sign in with your Bluesky handle to publish lexicons to your PDS.
+    </p>
+    <form onsubmit="handleStepLogin(event)" style="display: flex; gap: 0.5rem; align-items: flex-start;">
+      <div style="flex: 1;">
+        <input type="text" id="step-login-handle" placeholder="you.bsky.social" required style="width: 100%;" />
+      </div>
+      <button type="submit" class="btn btn-primary">Sign In</button>
+    </form>
+  `;
+}
+
+async function handleStepLogin(event) {
+  event.preventDefault();
+  const handle = document.getElementById('step-login-handle').value.trim();
+  if (!handle) return;
+
+  try {
+    await initClient();
+    await state.client.loginWithRedirect({ handle });
+  } catch (err) {
+    console.error('Login error:', err);
+    state.result = { success: false, message: 'Login failed: ' + err.message };
+    renderAllSteps();
+  }
+}
+```
+
+**Step 2: Update init() to complete step 1 if signed in**
+
+In the init function, after setting `state.viewer`, add:
+
+```javascript
+// Complete step 1 if already signed in
+if (state.viewer) {
+  state.stepCompleted[1] = true;
+  state.currentStep = 2;
+}
+```
+
+**Step 3: Update OAuth callback handling**
+
+After successful OAuth callback in init(), add same step completion logic.
+
+**Step 4: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "$(cat <<'EOF'
+feat(lexicon-publisher): implement Step 1 - Sign In
+
+Add inline sign-in form in step wizard, complete step on successful auth.
+EOF
+)"
+```
+
+---
+
+## Task 7: Implement Step 2 - Define Lexicons
+
+**Files:**
+- Modify: `lexicon-publisher.html` (add renderDefineLexiconsContent function)
+
+**Step 1: Add renderDefineLexiconsContent function**
+
+```javascript
+function renderDefineLexiconsContent() {
+  const getLexiconLabel = (lex, idx) => {
+    try {
+      const obj = JSON.parse(lex.value);
+      if (obj.id) return obj.id;
+    } catch (e) {}
+    return `Lexicon ${idx + 1}`;
+  };
+
+  const editorsHtml = state.lexicons
+    .map(
+      (lex, idx) => `
+  <div class="editor-card ${lex.collapsed ? "collapsed" : ""}" data-lexicon-id="${lex.id}">
+    <div class="editor-header">
+      <div style="display: flex; align-items: center; gap: 0.5rem;">
+        <button class="collapse-toggle" onclick="toggleLexicon(${lex.id})">
+          ${lex.collapsed ? "▶" : "▼"}
+        </button>
+        <span class="editor-label">${esc(getLexiconLabel(lex, idx))}</span>
+      </div>
+      <button
+        class="btn btn-danger btn-small"
+        onclick="removeLexicon(${lex.id})"
+        ${state.lexicons.length === 1 ? "disabled" : ""}
+      >Remove</button>
+    </div>
+    <textarea
+      placeholder="${escapeAttr(LEXICON_PLACEHOLDER)}"
+      onchange="handleLexiconChange(${lex.id}, this.value)"
+      oninput="handleLexiconChange(${lex.id}, this.value)"
+    >${esc(lex.value)}</textarea>
+  </div>
+`,
+    )
+    .join("");
+
+  const hasMultiple = state.lexicons.length > 1;
+  const allCollapsed = state.lexicons.every((l) => l.collapsed);
+  const collapseAllRow = hasMultiple
+    ? `<div class="collapse-all-row">
+        <button class="btn btn-secondary btn-small" onclick="toggleAllLexicons(${allCollapsed ? "false" : "true"})">
+          ${allCollapsed ? "Expand All" : "Collapse All"}
+        </button>
+      </div>`
+    : "";
+
+  const resultHtml = state.result && state.currentStep === 2 ? `
+    <div class="result ${state.result.success ? 'result-success' : 'result-error'}" style="margin-top: 0.75rem;">
+      ${state.result.success ? '✓' : '✗'} ${esc(state.result.message)}
+    </div>
+    ${state.missingDependencies.length > 0 ? `
+      <div class="warning-box" style="margin-top: 0.75rem;">
+        <strong>Missing external dependencies:</strong>
+        <ul style="margin: 0.5rem 0 0 1.25rem;">
+          ${state.missingDependencies.map(d => `<li>${esc(d)}</li>`).join('')}
+        </ul>
+      </div>
+    ` : ''}
+  ` : '';
+
+  return `
+    <div
+      class="drop-zone"
+      id="drop-zone"
+      ondragover="handleDragOver(event)"
+      ondragleave="handleDragLeave(event)"
+      ondrop="handleDrop(event)"
+      onclick="triggerFileInput()"
+    >
+      <div class="drop-zone-icon">📦</div>
+      <div class="drop-zone-text">
+        <strong>Drop a .zip file</strong> or click to browse
+      </div>
+      <div class="drop-zone-hint">Supports nested folders with .json lexicon files</div>
+    </div>
+    <input type="file" id="file-input" accept=".zip" onchange="handleFileSelect(event)" style="display: none;" />
+    ${collapseAllRow}
+    ${editorsHtml}
+    <div class="button-row">
+      <button class="btn btn-secondary" onclick="addLexicon()">+ Add Lexicon</button>
+      <button class="btn btn-primary" onclick="continueToPublish()">Continue to Publish</button>
+    </div>
+    ${resultHtml}
+  `;
+}
+
+function handleLexiconChange(id, value) {
+  const lex = state.lexicons.find((l) => l.id === id);
+  if (lex) {
+    lex.value = value;
+    // Reset downstream steps when editing
+    if (state.stepCompleted[2]) {
+      resetStepsFrom(2);
+    }
+  }
+}
+
+async function continueToPublish() {
+  // Validate lexicons first
+  state.result = null;
+  state.validationPassed = false;
+  state.conflicts = [];
+  state.missingDependencies = [];
+
+  const parseResult = parseLexicons();
+  if (parseResult.error) {
+    state.result = { success: false, message: parseResult.error };
+    renderAllSteps();
+    return;
+  }
+
+  try {
+    const lexiconList = honk.toList(parseResult.lexicons);
+    const result = honk.validate(lexiconList);
+    const unwrapped = unwrapHonkResult(result);
+
+    if (!unwrapped.ok) {
+      state.result = {
+        success: false,
+        message: `Validation failed: ${formatHonkError(unwrapped.value)}`,
+      };
+      renderAllSteps();
+      return;
+    }
+
+    const count = parseResult.lexicons.length;
+    state.result = { success: true, message: `${count} lexicon${count !== 1 ? 's' : ''} valid` };
+    state.validationPassed = true;
+
+    // Check external dependencies and conflicts
+    if (state.viewer) {
+      const userDomain = getUserDomain(state.viewer.handle);
+      const externalRefs = extractExternalRefs(parseResult.lexicons, userDomain);
+      const { missing } = await checkExternalDependencies(externalRefs);
+      state.missingDependencies = missing;
+      await checkConflicts();
+    }
+
+    // Complete step 2 and move to step 3
+    completeStep(2);
+  } catch (e) {
+    state.result = {
+      success: false,
+      message: `Validation error: ${e.message}`,
+    };
+    renderAllSteps();
+  }
+}
+```
+
+**Step 2: Update addLexicon and removeLexicon to re-render**
+
+Modify `addLexicon()` and `removeLexicon()` to call `renderAllSteps()` instead of `renderLexiconsSection()`.
+
+**Step 3: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "$(cat <<'EOF'
+feat(lexicon-publisher): implement Step 2 - Define Lexicons
+
+Add lexicon editors with Continue to Publish button that validates and advances.
+EOF
+)"
+```
+
+---
+
+## Task 8: Implement Step 3 - Publish
+
+**Files:**
+- Modify: `lexicon-publisher.html` (add renderPublishContent function)
+
+**Step 1: Add renderPublishContent function**
+
+```javascript
+function renderPublishContent() {
+  const { publishable, excluded } = getPublishableLexicons();
+  const userDomain = state.viewer ? getUserDomain(state.viewer.handle) : '';
+
+  const excludedWarning = excluded.length > 0 ? `
+    <div class="warning-box" style="margin-bottom: 0.75rem;">
+      <strong>Excluded (not on ${esc(userDomain)}):</strong>
+      <ul style="margin: 0.5rem 0 0 1.25rem;">
+        ${excluded.map(e => `<li>${esc(e.nsid)} <span style="opacity: 0.7">(${esc(e.domain)})</span></li>`).join('')}
+      </ul>
+    </div>
+  ` : '';
+
+  const conflictWarnings = state.conflicts.length > 0 ? `
+    <div class="warning-box" style="margin-bottom: 0.75rem;">
+      <strong>Conflicts detected:</strong>
+      <ul style="margin: 0.5rem 0 0 1.25rem;">
+        ${state.conflicts.map(c => `
+          <li>${esc(c.nsid)} - published by @${esc(c.existingOwner)}
+            ${c.isSameOwner ? '(you - will update)' : '(different owner)'}
+          </li>
+        `).join('')}
+      </ul>
+    </div>
+  ` : '';
+
+  const publishCount = publishable.length;
+  const canPublish = publishCount > 0;
+
+  const resultHtml = state.publishResult ? `
+    <div class="result ${state.publishResult.success ? 'result-success' : 'result-error'}" style="margin-top: 0.75rem;">
+      ${state.publishResult.success ? '✓' : '✗'} ${esc(state.publishResult.message)}
+    </div>
+  ` : '';
+
+  // Show list of lexicons to be published
+  const lexiconList = publishable.length > 0 ? `
+    <div style="margin-bottom: 0.75rem;">
+      <strong>Ready to publish:</strong>
+      <ul style="margin: 0.5rem 0 0 1.25rem; font-family: ui-monospace, SFMono-Regular, monospace; font-size: 0.875rem;">
+        ${publishable.map(p => `<li>${esc(p.nsid)}</li>`).join('')}
+      </ul>
+    </div>
+  ` : '';
+
+  return `
+    <p style="color: var(--text-secondary); margin-bottom: 0.75rem;">
+      ${canPublish
+        ? `Publish ${publishCount} lexicon${publishCount !== 1 ? 's' : ''} to @${esc(state.viewer?.handle || '')}'s PDS.`
+        : `No lexicons to publish for ${esc(userDomain)}.`}
+    </p>
+    ${lexiconList}
+    ${excludedWarning}
+    ${conflictWarnings}
+    <div class="button-row">
+      <button class="btn btn-primary" onclick="publishAndContinue()" ${canPublish ? '' : 'disabled'}>
+        Publish to PDS
+      </button>
+    </div>
+    ${resultHtml}
+  `;
+}
+
+async function publishAndContinue() {
+  if (!state.viewer || !state.client) return;
+
+  state.publishResults = [];
+  state.publishResult = null;
+
+  const { publishable: lexiconsToPublish } = getPublishableLexicons();
+
+  if (lexiconsToPublish.length === 0) {
+    state.publishResult = { success: false, message: "No valid lexicons to publish" };
+    renderAllSteps();
+    return;
+  }
+
+  // Publish each lexicon
+  for (const { nsid, schema } of lexiconsToPublish) {
+    try {
+      const ownedConflict = state.conflicts.find(c => c.nsid === nsid && c.isSameOwner);
+      const input = {
+        id: nsid,
+        defs: schema.defs,
+        lexicon: schema.lexicon || 1,
+      };
+
+      if (ownedConflict) {
+        await state.client.mutate(`
+          mutation UpdateSchema($input: ComAtprotoLexiconSchemaInput!, $rkey: String!) {
+            updateComAtprotoLexiconSchema(input: $input, rkey: $rkey) {
+              uri
+            }
+          }
+        `, { rkey: nsid, input });
+        state.publishResults.push({ nsid, success: true, updated: true });
+      } else {
+        await state.client.mutate(`
+          mutation CreateSchema($input: ComAtprotoLexiconSchemaInput!, $rkey: String!) {
+            createComAtprotoLexiconSchema(input: $input, rkey: $rkey) {
+              uri
+            }
+          }
+        `, { rkey: nsid, input });
+        state.publishResults.push({ nsid, success: true });
+      }
+    } catch (err) {
+      state.publishResults.push({ nsid, success: false, error: err.message });
+    }
+  }
+
+  // Generate DNS instructions
+  generateDnsInstructions(lexiconsToPublish.map(l => l.nsid));
+
+  // Refresh published lexicons list
+  await fetchPublishedLexicons();
+
+  // Show results
+  const successCount = state.publishResults.filter(r => r.success).length;
+  const failCount = state.publishResults.filter(r => !r.success).length;
+
+  if (failCount === 0) {
+    state.publishResult = { success: true, message: `Published ${successCount} lexicon${successCount !== 1 ? 's' : ''}` };
+    // Complete step 3 and move forward
+    completeStep(3);
+  } else {
+    const errors = state.publishResults.filter(r => !r.success).map(r => `${r.nsid}: ${r.error}`).join('\n');
+    state.publishResult = { success: false, message: `Published ${successCount}, failed ${failCount}:\n${errors}` };
+    renderAllSteps();
+  }
+}
+```
+
+**Step 2: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "$(cat <<'EOF'
+feat(lexicon-publisher): implement Step 3 - Publish
+
+Show publishable lexicons, warnings, and publish button that advances to DNS step.
+EOF
+)"
+```
+
+---
+
+## Task 9: Implement Step 4 - Verify DNS
+
+**Files:**
+- Modify: `lexicon-publisher.html` (add renderDnsContent function)
+
+**Step 1: Add renderDnsContent function**
+
+```javascript
+function renderDnsContent() {
+  if (state.dnsInstructions.length === 0) {
+    return `
+      <p style="color: var(--text-secondary);">
+        No DNS records required. Your lexicons are published!
+      </p>
+      <div class="button-row">
+        <button class="btn btn-primary" onclick="skipDnsAndContinue()">View Published Lexicons</button>
+      </div>
+    `;
+  }
+
+  const cards = state.dnsInstructions.map(instr => {
+    let statusIcon = '';
+    if (instr.verified === true) {
+      statusIcon = '<span class="dns-status dns-verified" title="Verified">✓</span>';
+    } else if (instr.verified === false) {
+      statusIcon = '<span class="dns-status dns-not-found" title="Not found">✗</span>';
+    }
+
+    return `
+      <div class="dns-card ${instr.verified === true ? 'dns-card-verified' : ''}">
+        <div class="dns-domain">${esc(instr.domain)} ${statusIcon}</div>
+        <div class="dns-record">
+          <div class="dns-row">
+            <span class="dns-label">Type:</span>
+            <span class="dns-value">TXT</span>
+          </div>
+          <div class="dns-row">
+            <span class="dns-label">Name:</span>
+            <span class="dns-value">${esc(instr.recordName)}</span>
+            <button class="btn btn-secondary btn-small" onclick="copyToClipboard('${escapeAttr(instr.recordName)}')">Copy</button>
+          </div>
+          <div class="dns-row">
+            <span class="dns-label">Value:</span>
+            <span class="dns-value">${esc(instr.recordValue)}</span>
+            <button class="btn btn-secondary btn-small" onclick="copyToClipboard('${escapeAttr(instr.recordValue)}')">Copy</button>
+          </div>
+        </div>
+        <div class="dns-lexicons">
+          <strong>Lexicons:</strong>
+          <ul>
+            ${instr.lexicons.map(l => `<li>${esc(l)}</li>`).join('')}
+          </ul>
+        </div>
+      </div>
+    `;
+  }).join('');
+
+  const allVerified = state.dnsInstructions.every(d => d.verified === true);
+
+  return `
+    ${cards}
+    <div class="dns-note" style="margin-bottom: 0.75rem;">
+      Add these TXT records to your DNS provider. You must control these domains to complete lexicon resolution.
+    </div>
+    <div class="button-row">
+      <button class="btn btn-secondary" onclick="verifyDnsAndRender()">Verify DNS</button>
+      <button class="btn btn-primary" onclick="continueToDone()">
+        ${allVerified ? 'Continue' : 'Skip for Now'}
+      </button>
+    </div>
+  `;
+}
+
+async function verifyDnsAndRender() {
+  await verifyDnsRecords();
+  renderAllSteps();
+}
+
+function skipDnsAndContinue() {
+  // Mark DNS step as complete (non-blocking) and continue
+  state.stepCompleted[4] = true;
+  state.currentStep = 5;
+  renderAllSteps();
+}
+
+function continueToDone() {
+  // Mark DNS step as complete and move to final step
+  state.stepCompleted[4] = true;
+  state.currentStep = 5;
+  renderAllSteps();
+}
+```
+
+**Step 2: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "$(cat <<'EOF'
+feat(lexicon-publisher): implement Step 4 - Verify DNS
+
+Show DNS records with verify button and skip/continue options.
+EOF
+)"
+```
+
+---
+
+## Task 10: Implement Step 5 - Your Published Lexicons
+
+**Files:**
+- Modify: `lexicon-publisher.html` (add renderPublishedLexiconsContent function)
+
+**Step 1: Add renderPublishedLexiconsContent function**
+
+```javascript
+function renderPublishedLexiconsContent() {
+  if (state.publishedLexicons.length === 0) {
+    return `
+      <p style="color: var(--text-secondary);">
+        You haven't published any lexicons yet.
+      </p>
+    `;
+  }
+
+  const lexiconCards = state.publishedLexicons.map(lex => `
+    <div class="published-card">
+      <div class="published-header">
+        <span class="published-nsid">${esc(lex.rkey)}</span>
+        <button class="btn btn-danger btn-small" onclick="deleteLexiconAndRender('${escapeAttr(lex.rkey)}')">
+          Delete
+        </button>
+      </div>
+      <div class="published-meta">
+        Published ${new Date(lex.indexedAt).toLocaleDateString()}
+      </div>
+    </div>
+  `).join('');
+
+  return `
+    <p style="color: var(--text-secondary); margin-bottom: 0.75rem;">
+      You have ${state.publishedLexicons.length} published lexicon${state.publishedLexicons.length !== 1 ? 's' : ''}.
+    </p>
+    ${lexiconCards}
+  `;
+}
+
+async function deleteLexiconAndRender(rkey) {
+  if (!confirm(`Delete lexicon ${rkey}?`)) return;
+
+  try {
+    await state.client.mutate(`
+      mutation DeleteSchema($rkey: String!) {
+        deleteComAtprotoLexiconSchema(rkey: $rkey) {
+          uri
+        }
+      }
+    `, { rkey });
+
+    state.publishedLexicons = state.publishedLexicons.filter(l => l.rkey !== rkey);
+
+    // Update DNS instructions if needed
+    if (state.publishedLexicons.length > 0) {
+      generateDnsInstructions(state.publishedLexicons.map(l => l.rkey));
+    } else {
+      state.dnsInstructions = [];
+    }
+
+    renderAllSteps();
+  } catch (err) {
+    alert(`Failed to delete: ${err.message}`);
+  }
+}
+```
+
+**Step 2: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "$(cat <<'EOF'
+feat(lexicon-publisher): implement Step 5 - Your Published Lexicons
+
+Show all published lexicons with delete functionality.
+EOF
+)"
+```
+
+---
+
+## Task 11: Update init() and Remove Old Render Functions
+
+**Files:**
+- Modify: `lexicon-publisher.html` (init function and cleanup)
+
+**Step 1: Update init() to use renderAllSteps**
+
+Replace the render calls at the end of `init()`:
+
+```javascript
+// Old:
+// renderLexiconsSection();
+// renderAuthStatus();
+// renderPublishedLexiconsSection();
+// renderDnsSection();
+
+// New:
+renderAllSteps();
+```
+
+**Step 2: Remove old render functions that are no longer used**
+
+Remove these functions (they're replaced by step content renderers):
+- `renderLexiconsSection()`
+- `renderPublishSection()`
+- `renderPublishResult()`
+- `renderPublishedLexiconsSection()`
+- `renderDnsSection()`
+- `renderResult()`
+
+Also remove the `renderAuthStatus()` function since auth is now in Step 1.
+
+**Step 3: Update header to remove auth-status div**
+
+Change header to just show title (no auth status):
+
+```html
+<header>
+  <div>
+    <h1>
+      <span style="color: var(--accent)">{</span> Lexicon Publisher
+      <span style="color: var(--accent)">}</span>
+    </h1>
+    <p class="tagline">
+      Publish lexicons to your PDS
+    </p>
+  </div>
+</header>
+```
+
+**Step 4: Remove old section divs from HTML**
+
+Remove these from the main element since we now use steps-container:
+- `<div id="lexicons-section" class="section"></div>`
+- `<div id="publish-section" class="section hidden"></div>`
+- `<div id="published-lexicons-section" class="section hidden"></div>`
+- `<div id="dns-section" class="section hidden"></div>`
+
+**Step 5: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "$(cat <<'EOF'
+refactor(lexicon-publisher): remove old section-based render functions
+
+Clean up deprecated render functions and update init to use wizard steps.
+EOF
+)"
+```
+
+---
+
+## Task 12: Fix updateLexicon to Use New Handler
+
+**Files:**
+- Modify: `lexicon-publisher.html`
+
+**Step 1: Remove old updateLexicon function**
+
+The old `updateLexicon(id, value)` function should be removed since we now use `handleLexiconChange(id, value)` which also handles resetting downstream steps.
+
+**Step 2: Update any remaining references**
+
+Search for any remaining calls to old functions and update them.
+
+**Step 3: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "$(cat <<'EOF'
+refactor(lexicon-publisher): consolidate lexicon update handlers
+
+Remove duplicate updateLexicon in favor of handleLexiconChange.
+EOF
+)"
+```
+
+---
+
+## Task 13: Handle Returning Users with Published Lexicons
+
+**Files:**
+- Modify: `lexicon-publisher.html` (init function)
+
+**Step 1: Update init to show step 5 preview for returning users**
+
+After fetching published lexicons, if the user has lexicons and comes back with session, generate DNS instructions:
+
+```javascript
+// In init(), after setting publishedLexicons:
+if (state.publishedLexicons.length > 0) {
+  generateDnsInstructions(state.publishedLexicons.map(l => l.rkey));
+}
+```
+
+This is already there, but ensure the step summary for step 5 shows the count even when collapsed.
+
+**Step 2: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "$(cat <<'EOF'
+feat(lexicon-publisher): show published lexicon count for returning users
+
+Step 5 preview shows count when user has existing published lexicons.
+EOF
+)"
+```
+
+---
+
+## Task 14: Add File Drop Handler Updates
+
+**Files:**
+- Modify: `lexicon-publisher.html`
+
+**Step 1: Update processZipFile to call renderAllSteps**
+
+Replace calls to `renderLexiconsSection()` and `renderResult()` with `renderAllSteps()`.
+
+**Step 2: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "$(cat <<'EOF'
+fix(lexicon-publisher): update ZIP file handler to use wizard renderer
+
+Replace old section renders with renderAllSteps.
+EOF
+)"
+```
+
+---
+
+## Task 15: Final Testing and Polish
+
+**Files:**
+- Modify: `lexicon-publisher.html`
+
+**Step 1: Manual test the full flow**
+
+1. Open page - Step 1 (Sign In) should be active, steps 2-5 grayed out
+2. Enter handle and sign in - after OAuth, Step 1 collapses, Step 2 expands
+3. Add/edit lexicons - content edits don't reset steps (until validated)
+4. Click "Continue to Publish" - validates, shows errors OR moves to Step 3
+5. Click collapsed Step 2 - should expand and reset Step 3+
+6. Re-validate and continue to Step 3
+7. Click "Publish to PDS" - publishes, moves to Step 4
+8. Verify DNS or skip - moves to Step 5
+9. View published lexicons, delete works
+10. Click earlier steps - can go back and edit
+
+**Step 2: Fix any issues found during testing**
+
+**Step 3: Final commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "$(cat <<'EOF'
+feat(lexicon-publisher): complete wizard flow implementation
+
+Tested full 5-step flow: Sign In → Define → Publish → DNS → Published.
+EOF
+)"
+```
+
+---
+
+## Summary
+
+This plan transforms the lexicon-publisher from a section-based layout to a 5-step wizard:
+
+1. **Sign In** - OAuth flow, must complete first
+2. **Define Lexicons** - Upload/edit, "Continue to Publish" validates
+3. **Publish** - Review warnings, publish to PDS
+4. **Verify DNS** - TXT records, non-blocking
+5. **Your Published Lexicons** - View all, delete
+
+Key behaviors implemented:
+- Steps collapse with summary when completed
+- Can click completed steps to go back
+- Going back resets downstream steps
+- Future steps grayed out until unlocked
+- No localStorage - refresh starts fresh at Step 2 (if signed in)
diff --git a/docs/plans/2025-12-23-lexicon-publisher.md b/docs/plans/2025-12-23-lexicon-publisher.md
new file mode 100644
index 0000000..de95714
--- /dev/null
+++ b/docs/plans/2025-12-23-lexicon-publisher.md
@@ -0,0 +1,1223 @@
+# Lexicon Publisher Implementation Plan
+
+> **For Claude:** REQUIRED SUB-SKILL: Use superpowers:executing-plans to implement this plan task-by-task.
+
+**Goal:** Build a web tool that validates, publishes, and manages ATProto lexicon schemas with OAuth authentication and DNS setup instructions.
+
+**Architecture:** Single-file HTML tool (like lexicon-validator.html) using quickslice-client-js for OAuth/GraphQL, honk for validation, and JSZip for file handling. Progressive auth: validate without login, publish requires OAuth.
+
+**Tech Stack:** HTML/CSS/JS, quickslice-client-js (CDN), honk (CDN), JSZip (CDN), GraphQL mutations via lexicons-quickslice backend.
+
+---
+
+## Task 1: Copy Lexicon Validator as Base
+
+**Files:**
+- Copy: `lexicon-validator.html` → `lexicon-publisher.html`
+
+**Step 1: Copy the file**
+
+```bash
+cp lexicon-validator.html lexicon-publisher.html
+```
+
+**Step 2: Update title and header**
+
+Change:
+- `<title>{ Lexicon Validator }</title>` → `<title>{ Lexicon Publisher }</title>`
+- Header h1 from "Lexicon Validator" → "Lexicon Publisher"
+- Tagline: add "Publish lexicons to your PDS"
+
+**Step 3: Update CSP to allow lexicons-quickslice**
+
+Add to Content-Security-Policy connect-src:
+```
+https://quickslice-production-4b57.up.railway.app wss://quickslice-production-4b57.up.railway.app https://public.api.bsky.app
+```
+
+**Step 4: Add quickslice-client script**
+
+After honk script, add:
+```html
+<script src="https://cdn.jsdelivr.net/gh/bigmoves/quickslice@main/quickslice-client-js/dist/quickslice-client.min.js"></script>
+```
+
+**Step 5: Verify in browser**
+
+Open `lexicon-publisher.html` - should show renamed validator with same functionality.
+
+**Step 6: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat: scaffold lexicon-publisher from validator"
+```
+
+---
+
+## Task 2: Add State for Auth and Publishing
+
+**Files:**
+- Modify: `lexicon-publisher.html`
+
+**Step 1: Extend state object**
+
+Add these properties to the state object:
+
+```javascript
+const state = {
+  // Existing lexicon state
+  lexicons: [{ id: 1, value: "", collapsed: false }],
+  nextLexiconId: 2,
+  record: "",
+  nsid: "",
+  availableNsids: [],
+  result: null,
+
+  // New: Auth state
+  client: null,
+  viewer: null, // { did, handle }
+
+  // New: Published lexicons from user's PDS
+  publishedLexicons: [],
+
+  // New: Publish workflow
+  validationPassed: false,
+  conflicts: [], // [{ nsid, existingOwner, isSameOwner }]
+  publishResults: [], // [{ nsid, success, error }]
+
+  // New: DNS instructions
+  dnsInstructions: [], // [{ domain, record, lexicons }]
+};
+```
+
+**Step 2: Add constants**
+
+```javascript
+const SERVER_URL = "https://quickslice-production-4b57.up.railway.app";
+const CLIENT_ID = "client_0ygtMYHz-rzUtCMgvhigcA";
+const SCOPE = "atproto repo:com.atproto.lexicon";
+```
+
+**Step 3: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat: add auth and publishing state"
+```
+
+---
+
+## Task 3: Add OAuth Helpers
+
+**Files:**
+- Modify: `lexicon-publisher.html`
+
+**Step 1: Add initClient function**
+
+```javascript
+async function initClient() {
+  if (!state.client) {
+    state.client = await QuicksliceClient.createQuicksliceClient({
+      server: SERVER_URL,
+      clientId: CLIENT_ID,
+      scope: SCOPE,
+    });
+  }
+  return state.client;
+}
+```
+
+**Step 2: Add callback detection**
+
+```javascript
+function isCallbackRoute() {
+  return window.location.pathname === "/lexicon-publisher/callback";
+}
+```
+
+**Step 3: Add OAuth callback handler**
+
+```javascript
+async function handleOAuthCallback() {
+  if (!isCallbackRoute()) return false;
+
+  const params = new URLSearchParams(window.location.search);
+
+  // Start OAuth flow from callback route
+  if (params.get("start") === "1") {
+    window.history.replaceState({}, document.title, "/lexicon-publisher/callback");
+    await startOAuthFromCallback();
+    return true;
+  }
+
+  // Handle OAuth error
+  const urlError = params.get("error");
+  if (urlError) {
+    state.result = { success: false, message: params.get("error_description") || urlError };
+    window.location.href = "/lexicon-publisher";
+    return true;
+  }
+
+  // No code - redirect
+  if (!params.has("code")) {
+    window.location.href = "/lexicon-publisher";
+    return true;
+  }
+
+  // Exchange code for tokens
+  try {
+    await initClient();
+    await state.client.handleRedirectCallback();
+    window.history.replaceState({}, document.title, "/lexicon-publisher/callback");
+    const returnUrl = sessionStorage.getItem("oauth_return_url") || "/lexicon-publisher";
+    sessionStorage.removeItem("oauth_return_url");
+    window.location.href = returnUrl;
+    return true;
+  } catch (err) {
+    console.error("OAuth callback error:", err);
+    state.result = { success: false, message: err.message || "Authentication failed" };
+    window.location.href = "/lexicon-publisher";
+    return true;
+  }
+}
+```
+
+**Step 4: Add login flow**
+
+```javascript
+function showLoginModal() {
+  const existing = document.getElementById("login-modal");
+  if (existing) existing.remove();
+
+  const modal = document.createElement("div");
+  modal.id = "login-modal";
+  modal.className = "modal-overlay";
+  modal.innerHTML = `
+    <div class="modal">
+      <div class="modal-header">
+        <h3>Sign In</h3>
+        <button class="btn-close" onclick="closeLoginModal()">&times;</button>
+      </div>
+      <form onsubmit="handleLogin(event)">
+        <div class="form-group">
+          <label for="login-handle">Your handle</label>
+          <input type="text" id="login-handle" placeholder="you.bsky.social" required />
+        </div>
+        <button type="submit" class="btn btn-primary" style="width: 100%">Sign In</button>
+      </form>
+    </div>
+  `;
+  document.body.appendChild(modal);
+  document.getElementById("login-handle").focus();
+}
+
+function closeLoginModal() {
+  const modal = document.getElementById("login-modal");
+  if (modal) modal.remove();
+}
+
+async function handleLogin(event) {
+  event.preventDefault();
+  const handle = document.getElementById("login-handle").value.trim();
+  if (!handle) return;
+
+  sessionStorage.setItem("oauth_return_url", window.location.href);
+  sessionStorage.setItem("oauth_handle", handle);
+  window.location.href = "/lexicon-publisher/callback?start=1";
+}
+
+async function startOAuthFromCallback() {
+  const handle = sessionStorage.getItem("oauth_handle");
+  sessionStorage.removeItem("oauth_handle");
+
+  if (!handle) {
+    window.location.href = "/lexicon-publisher";
+    return;
+  }
+
+  try {
+    await initClient();
+    await state.client.loginWithRedirect({ handle });
+  } catch (err) {
+    console.error("Login error:", err);
+    sessionStorage.setItem("oauth_error", err.message);
+    window.location.href = "/lexicon-publisher";
+  }
+}
+
+function handleLogout() {
+  if (state.client) {
+    state.client.logout();
+  }
+  state.viewer = null;
+  state.publishedLexicons = [];
+  renderAll();
+}
+```
+
+**Step 5: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat: add OAuth helpers"
+```
+
+---
+
+## Task 4: Add Modal and Auth UI Styles
+
+**Files:**
+- Modify: `lexicon-publisher.html`
+
+**Step 1: Add modal styles**
+
+Add to `<style>` section:
+
+```css
+/* Modal */
+.modal-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+}
+
+.modal {
+  background: var(--bg-card);
+  border-radius: 0.5rem;
+  padding: 1.5rem;
+  width: 90%;
+  max-width: 400px;
+  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
+}
+
+.modal-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 1rem;
+}
+
+.modal-header h3 {
+  font-size: 1.125rem;
+  font-weight: 600;
+}
+
+.btn-close {
+  background: none;
+  border: none;
+  font-size: 1.5rem;
+  cursor: pointer;
+  color: var(--text-secondary);
+  line-height: 1;
+}
+
+.btn-close:hover {
+  color: var(--text-primary);
+}
+
+.form-group {
+  margin-bottom: 1rem;
+}
+
+.form-group label {
+  display: block;
+  font-size: 0.875rem;
+  font-weight: 500;
+  margin-bottom: 0.25rem;
+}
+
+.form-group input {
+  width: 100%;
+  padding: 0.5rem 0.75rem;
+  border: 1px solid var(--border);
+  border-radius: 0.375rem;
+  font-size: 0.875rem;
+}
+
+.form-group input:focus {
+  outline: none;
+  border-color: var(--border-focus);
+}
+
+/* User status in header */
+.user-status {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+  font-size: 0.875rem;
+}
+
+.user-handle {
+  color: var(--text-secondary);
+}
+
+.btn-text {
+  background: none;
+  border: none;
+  color: var(--accent);
+  cursor: pointer;
+  font-size: 0.875rem;
+  padding: 0;
+}
+
+.btn-text:hover {
+  text-decoration: underline;
+}
+```
+
+**Step 2: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat: add modal and auth UI styles"
+```
+
+---
+
+## Task 5: Add Header with Auth Status
+
+**Files:**
+- Modify: `lexicon-publisher.html`
+
+**Step 1: Update header HTML**
+
+Replace the static header in the body with a dynamic one. Update the `<header>` in the HTML:
+
+```html
+<header>
+  <div>
+    <h1>
+      <span style="color: var(--accent)">{</span> Lexicon Publisher
+      <span style="color: var(--accent)">}</span>
+    </h1>
+    <p class="tagline">
+      Validate and publish lexicons to your PDS
+    </p>
+  </div>
+  <div id="auth-status"></div>
+</header>
+```
+
+**Step 2: Add renderAuthStatus function**
+
+```javascript
+function renderAuthStatus() {
+  const container = document.getElementById("auth-status");
+  if (!container) return;
+
+  if (state.viewer) {
+    container.innerHTML = `
+      <div class="user-status">
+        <span class="user-handle">@${esc(state.viewer.handle)}</span>
+        <button class="btn-text" onclick="handleLogout()">Sign Out</button>
+      </div>
+    `;
+  } else {
+    container.innerHTML = `
+      <button class="btn btn-secondary" onclick="showLoginModal()">Sign In</button>
+    `;
+  }
+}
+```
+
+**Step 3: Add renderAll function**
+
+```javascript
+function renderAll() {
+  renderAuthStatus();
+  renderLexiconsSection();
+  renderPublishSection();
+  renderPublishedLexiconsSection();
+  renderDnsSection();
+  renderResult();
+}
+```
+
+**Step 4: Update init to check auth**
+
+```javascript
+async function init() {
+  // Handle OAuth callback first
+  if (await handleOAuthCallback()) {
+    return;
+  }
+
+  // Check for OAuth error from redirect
+  const oauthError = sessionStorage.getItem("oauth_error");
+  if (oauthError) {
+    sessionStorage.removeItem("oauth_error");
+    state.result = { success: false, message: oauthError };
+  }
+
+  // Check if already authenticated
+  try {
+    await initClient();
+    if (state.client.isAuthenticated()) {
+      const viewer = await state.client.query(`
+        query {
+          viewer {
+            did
+            handle
+          }
+        }
+      `);
+      if (viewer.data?.viewer) {
+        state.viewer = viewer.data.viewer;
+        await fetchPublishedLexicons();
+      }
+    }
+  } catch (err) {
+    console.error("Init error:", err);
+  }
+
+  renderAll();
+}
+```
+
+**Step 5: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat: add header with auth status"
+```
+
+---
+
+## Task 6: Add Publish Section UI
+
+**Files:**
+- Modify: `lexicon-publisher.html`
+
+**Step 1: Add publish section to HTML**
+
+Add after `#record-section` in the HTML:
+
+```html
+<div id="publish-section" class="section hidden"></div>
+<div id="published-lexicons-section" class="section hidden"></div>
+<div id="dns-section" class="section hidden"></div>
+```
+
+**Step 2: Add renderPublishSection function**
+
+```javascript
+function renderPublishSection() {
+  const section = document.getElementById("publish-section");
+  if (!section) return;
+
+  // Only show after successful validation
+  if (!state.validationPassed) {
+    section.classList.add("hidden");
+    return;
+  }
+
+  section.classList.remove("hidden");
+
+  const lexiconCount = state.lexicons.filter(l => l.value.trim()).length;
+
+  if (!state.viewer) {
+    section.innerHTML = `
+      <div class="section-header">
+        <span class="section-title">Publish</span>
+      </div>
+      <p style="color: var(--text-secondary); margin-bottom: 0.75rem;">
+        Sign in to publish ${lexiconCount} lexicon${lexiconCount !== 1 ? 's' : ''} to your PDS.
+      </p>
+      <button class="btn btn-primary" onclick="showLoginModal()">Sign In to Publish</button>
+    `;
+  } else {
+    const conflictWarnings = state.conflicts.length > 0 ? `
+      <div class="warning-box" style="margin-bottom: 0.75rem;">
+        <strong>Conflicts detected:</strong>
+        <ul style="margin: 0.5rem 0 0 1.25rem;">
+          ${state.conflicts.map(c => `
+            <li>${esc(c.nsid)} - published by @${esc(c.existingOwner)}
+              ${c.isSameOwner ? '(you - will update)' : '(different owner)'}
+            </li>
+          `).join('')}
+        </ul>
+      </div>
+    ` : '';
+
+    section.innerHTML = `
+      <div class="section-header">
+        <span class="section-title">Publish</span>
+      </div>
+      <p style="color: var(--text-secondary); margin-bottom: 0.75rem;">
+        Ready to publish ${lexiconCount} lexicon${lexiconCount !== 1 ? 's' : ''} to @${esc(state.viewer.handle)}'s PDS.
+      </p>
+      ${conflictWarnings}
+      <button class="btn btn-primary" onclick="publishLexicons()">
+        Publish to PDS
+      </button>
+    `;
+  }
+}
+```
+
+**Step 3: Add warning box style**
+
+```css
+.warning-box {
+  background: #fef3c7;
+  border: 1px solid #fcd34d;
+  border-radius: 0.375rem;
+  padding: 0.75rem;
+  font-size: 0.875rem;
+  color: #92400e;
+}
+```
+
+**Step 4: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat: add publish section UI"
+```
+
+---
+
+## Task 7: Add Published Lexicons Section
+
+**Files:**
+- Modify: `lexicon-publisher.html`
+
+**Step 1: Add GraphQL query for fetching published lexicons**
+
+```javascript
+async function fetchPublishedLexicons() {
+  if (!state.viewer || !state.client) return;
+
+  try {
+    const result = await state.client.query(`
+      query {
+        viewer {
+          comAtprotoLexiconSchemaByDid(first: 100) {
+            edges {
+              node {
+                uri
+                defs
+                lexicon
+                indexedAt
+              }
+            }
+          }
+        }
+      }
+    `);
+
+    state.publishedLexicons = (result.data?.viewer?.comAtprotoLexiconSchemaByDid?.edges || [])
+      .map(e => {
+        const uri = e.node.uri;
+        const rkey = uri.split('/').pop();
+        return {
+          uri,
+          rkey,
+          defs: e.node.defs,
+          lexicon: e.node.lexicon,
+          indexedAt: e.node.indexedAt,
+        };
+      });
+  } catch (err) {
+    console.error("Failed to fetch published lexicons:", err);
+  }
+}
+```
+
+**Step 2: Add renderPublishedLexiconsSection function**
+
+```javascript
+function renderPublishedLexiconsSection() {
+  const section = document.getElementById("published-lexicons-section");
+  if (!section) return;
+
+  if (!state.viewer || state.publishedLexicons.length === 0) {
+    section.classList.add("hidden");
+    return;
+  }
+
+  section.classList.remove("hidden");
+
+  const lexiconCards = state.publishedLexicons.map(lex => `
+    <div class="published-card">
+      <div class="published-header">
+        <span class="published-nsid">${esc(lex.rkey)}</span>
+        <button class="btn btn-danger btn-small" onclick="deleteLexicon('${escapeAttr(lex.rkey)}')">
+          Delete
+        </button>
+      </div>
+      <div class="published-meta">
+        Published ${new Date(lex.indexedAt).toLocaleDateString()}
+      </div>
+    </div>
+  `).join('');
+
+  section.innerHTML = `
+    <div class="section-header">
+      <span class="section-title">Your Published Lexicons</span>
+    </div>
+    ${lexiconCards}
+  `;
+}
+```
+
+**Step 3: Add published card styles**
+
+```css
+.published-card {
+  background: var(--bg-input);
+  border: 1px solid var(--border);
+  border-radius: 0.375rem;
+  padding: 0.75rem;
+  margin-bottom: 0.5rem;
+}
+
+.published-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.published-nsid {
+  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
+  font-size: 0.875rem;
+  font-weight: 500;
+}
+
+.published-meta {
+  font-size: 0.75rem;
+  color: var(--text-secondary);
+  margin-top: 0.25rem;
+}
+```
+
+**Step 4: Add deleteLexicon function**
+
+```javascript
+async function deleteLexicon(rkey) {
+  if (!confirm(`Delete lexicon ${rkey}?`)) return;
+
+  try {
+    await state.client.mutate(`
+      mutation DeleteSchema($rkey: String!) {
+        deleteComAtprotoLexiconSchema(rkey: $rkey) {
+          uri
+        }
+      }
+    `, { rkey });
+
+    state.publishedLexicons = state.publishedLexicons.filter(l => l.rkey !== rkey);
+    state.result = { success: true, message: `Deleted ${rkey}` };
+    renderAll();
+  } catch (err) {
+    state.result = { success: false, message: `Failed to delete: ${err.message}` };
+    renderResult();
+  }
+}
+```
+
+**Step 5: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat: add published lexicons section"
+```
+
+---
+
+## Task 8: Add Conflict Detection
+
+**Files:**
+- Modify: `lexicon-publisher.html`
+
+**Step 1: Add checkConflicts function**
+
+```javascript
+async function checkConflicts() {
+  state.conflicts = [];
+
+  const nsids = [];
+  for (const lex of state.lexicons) {
+    const trimmed = lex.value.trim();
+    if (!trimmed) continue;
+    try {
+      const obj = JSON.parse(trimmed);
+      if (obj.id) nsids.push(obj.id);
+    } catch (e) {}
+  }
+
+  if (nsids.length === 0) return;
+
+  try {
+    await initClient();
+
+    // Query for each NSID to check if it exists
+    for (const nsid of nsids) {
+      const result = await state.client.query(`
+        query CheckNsid($pattern: String!) {
+          comAtprotoLexiconSchema(
+            where: { uri: { endsWith: $pattern } }
+            first: 10
+          ) {
+            edges {
+              node {
+                uri
+                did
+                actorHandle
+              }
+            }
+          }
+        }
+      `, { pattern: `/${nsid}` });
+
+      const matches = result.data?.comAtprotoLexiconSchema?.edges || [];
+      for (const match of matches) {
+        const existingDid = match.node.did;
+        const existingHandle = match.node.actorHandle || existingDid;
+        const isSameOwner = state.viewer && existingDid === state.viewer.did;
+
+        state.conflicts.push({
+          nsid,
+          existingOwner: existingHandle,
+          existingDid,
+          isSameOwner,
+        });
+      }
+    }
+  } catch (err) {
+    console.error("Conflict check failed:", err);
+  }
+}
+```
+
+**Step 2: Update validateLexicons to set validationPassed and check conflicts**
+
+Modify the existing `validateLexicons` function - after successful validation:
+
+```javascript
+async function validateLexicons() {
+  state.result = null;
+  state.validationPassed = false;
+  state.conflicts = [];
+
+  const parseResult = parseLexicons();
+  if (parseResult.error) {
+    state.result = { success: false, message: parseResult.error };
+    renderResult();
+    return;
+  }
+
+  try {
+    const lexiconList = honk.toList(parseResult.lexicons);
+    const result = honk.validate(lexiconList);
+    const unwrapped = unwrapHonkResult(result);
+
+    if (unwrapped.ok) {
+      const count = parseResult.lexicons.length;
+      const noun = count === 1 ? "lexicon" : "lexicons";
+      state.result = { success: true, message: `${count} ${noun} valid` };
+      state.validationPassed = true;
+
+      // Check for conflicts if authenticated
+      if (state.viewer) {
+        await checkConflicts();
+      }
+    } else {
+      state.result = {
+        success: false,
+        message: `Validation failed: ${formatHonkError(unwrapped.value)}`,
+      };
+    }
+  } catch (e) {
+    state.result = {
+      success: false,
+      message: `Validation error: ${e.message}`,
+    };
+  }
+
+  renderAll();
+}
+```
+
+**Step 3: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat: add conflict detection"
+```
+
+---
+
+## Task 9: Add Publish Function
+
+**Files:**
+- Modify: `lexicon-publisher.html`
+
+**Step 1: Add publishLexicons function**
+
+```javascript
+async function publishLexicons() {
+  if (!state.viewer || !state.client) {
+    showLoginModal();
+    return;
+  }
+
+  state.publishResults = [];
+  state.dnsInstructions = [];
+
+  const lexiconsToPublish = [];
+  for (const lex of state.lexicons) {
+    const trimmed = lex.value.trim();
+    if (!trimmed) continue;
+    try {
+      const obj = JSON.parse(trimmed);
+      if (obj.id) {
+        lexiconsToPublish.push({ nsid: obj.id, schema: obj });
+      }
+    } catch (e) {}
+  }
+
+  if (lexiconsToPublish.length === 0) {
+    state.result = { success: false, message: "No valid lexicons to publish" };
+    renderResult();
+    return;
+  }
+
+  // Publish each lexicon
+  for (const { nsid, schema } of lexiconsToPublish) {
+    try {
+      await state.client.mutate(`
+        mutation CreateSchema($input: ComAtprotoLexiconSchemaInput!, $rkey: String!) {
+          createComAtprotoLexiconSchema(input: $input, rkey: $rkey) {
+            uri
+          }
+        }
+      `, {
+        rkey: nsid,
+        input: {
+          defs: JSON.stringify(schema.defs),
+          lexicon: schema.lexicon || 1,
+        },
+      });
+
+      state.publishResults.push({ nsid, success: true });
+    } catch (err) {
+      state.publishResults.push({ nsid, success: false, error: err.message });
+    }
+  }
+
+  // Generate DNS instructions
+  generateDnsInstructions(lexiconsToPublish.map(l => l.nsid));
+
+  // Refresh published lexicons list
+  await fetchPublishedLexicons();
+
+  // Show results
+  const successCount = state.publishResults.filter(r => r.success).length;
+  const failCount = state.publishResults.filter(r => !r.success).length;
+
+  if (failCount === 0) {
+    state.result = { success: true, message: `Published ${successCount} lexicon${successCount !== 1 ? 's' : ''}` };
+  } else {
+    const errors = state.publishResults.filter(r => !r.success).map(r => `${r.nsid}: ${r.error}`).join('\n');
+    state.result = { success: false, message: `Published ${successCount}, failed ${failCount}:\n${errors}` };
+  }
+
+  renderAll();
+}
+```
+
+**Step 2: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat: add publish function"
+```
+
+---
+
+## Task 10: Add DNS Instructions Section
+
+**Files:**
+- Modify: `lexicon-publisher.html`
+
+**Step 1: Add getDomainAuthority helper**
+
+```javascript
+function getDomainAuthority(nsid) {
+  // "buzz.bookhive.defs" → "bookhive.buzz"
+  // "buzz.bookhive.actor.profile" → "actor.bookhive.buzz"
+  const parts = nsid.split(".");
+  parts.pop(); // remove name (last segment)
+  return parts.reverse().join(".");
+}
+```
+
+**Step 2: Add generateDnsInstructions function**
+
+```javascript
+function generateDnsInstructions(nsids) {
+  if (!state.viewer) return;
+
+  const byDomain = {};
+
+  for (const nsid of nsids) {
+    const domain = getDomainAuthority(nsid);
+    if (!byDomain[domain]) {
+      byDomain[domain] = [];
+    }
+    byDomain[domain].push(nsid);
+  }
+
+  state.dnsInstructions = Object.entries(byDomain).map(([domain, lexicons]) => ({
+    domain,
+    recordName: `_lexicon.${domain}`,
+    recordValue: `did=${state.viewer.did}`,
+    lexicons,
+  }));
+}
+```
+
+**Step 3: Add renderDnsSection function**
+
+```javascript
+function renderDnsSection() {
+  const section = document.getElementById("dns-section");
+  if (!section) return;
+
+  if (state.dnsInstructions.length === 0) {
+    section.classList.add("hidden");
+    return;
+  }
+
+  section.classList.remove("hidden");
+
+  const cards = state.dnsInstructions.map(instr => `
+    <div class="dns-card">
+      <div class="dns-domain">${esc(instr.domain)}</div>
+      <div class="dns-record">
+        <div class="dns-row">
+          <span class="dns-label">Type:</span>
+          <span class="dns-value">TXT</span>
+        </div>
+        <div class="dns-row">
+          <span class="dns-label">Name:</span>
+          <span class="dns-value">${esc(instr.recordName)}</span>
+          <button class="btn btn-secondary btn-small" onclick="copyToClipboard('${escapeAttr(instr.recordName)}')">Copy</button>
+        </div>
+        <div class="dns-row">
+          <span class="dns-label">Value:</span>
+          <span class="dns-value">${esc(instr.recordValue)}</span>
+          <button class="btn btn-secondary btn-small" onclick="copyToClipboard('${escapeAttr(instr.recordValue)}')">Copy</button>
+        </div>
+      </div>
+      <div class="dns-lexicons">
+        <strong>Lexicons:</strong>
+        <ul>
+          ${instr.lexicons.map(l => `<li>${esc(l)}</li>`).join('')}
+        </ul>
+      </div>
+    </div>
+  `).join('');
+
+  section.innerHTML = `
+    <div class="section-header">
+      <span class="section-title">DNS Setup Required</span>
+    </div>
+    ${cards}
+    <div class="dns-note">
+      You must control these domains to complete lexicon resolution.
+      Subdomains (e.g., actor.bookhive.buzz) need their own TXT record.
+    </div>
+  `;
+}
+```
+
+**Step 4: Add copyToClipboard helper**
+
+```javascript
+function copyToClipboard(text) {
+  navigator.clipboard.writeText(text).then(() => {
+    // Brief visual feedback could be added here
+  }).catch(err => {
+    console.error('Copy failed:', err);
+  });
+}
+```
+
+**Step 5: Add DNS section styles**
+
+```css
+.dns-card {
+  background: var(--bg-input);
+  border: 1px solid var(--border);
+  border-radius: 0.375rem;
+  padding: 1rem;
+  margin-bottom: 0.75rem;
+}
+
+.dns-domain {
+  font-weight: 600;
+  font-size: 1rem;
+  margin-bottom: 0.75rem;
+  color: var(--accent);
+}
+
+.dns-record {
+  background: var(--bg-card);
+  border: 1px solid var(--border);
+  border-radius: 0.25rem;
+  padding: 0.75rem;
+  margin-bottom: 0.75rem;
+}
+
+.dns-row {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  margin-bottom: 0.25rem;
+}
+
+.dns-row:last-child {
+  margin-bottom: 0;
+}
+
+.dns-label {
+  font-size: 0.75rem;
+  color: var(--text-secondary);
+  width: 3rem;
+}
+
+.dns-value {
+  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
+  font-size: 0.8125rem;
+  flex: 1;
+}
+
+.dns-lexicons {
+  font-size: 0.875rem;
+}
+
+.dns-lexicons ul {
+  margin: 0.25rem 0 0 1.25rem;
+  padding: 0;
+}
+
+.dns-lexicons li {
+  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
+  font-size: 0.8125rem;
+}
+
+.dns-note {
+  background: #dbeafe;
+  border: 1px solid #93c5fd;
+  border-radius: 0.375rem;
+  padding: 0.75rem;
+  font-size: 0.875rem;
+  color: #1e40af;
+}
+```
+
+**Step 6: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat: add DNS instructions section"
+```
+
+---
+
+## Task 11: Remove Record Validation Section
+
+**Files:**
+- Modify: `lexicon-publisher.html`
+
+**Step 1: Remove record section**
+
+The record validation section from lexicon-validator isn't needed for the publisher. Remove:
+- `<div id="record-section" class="section"></div>` from HTML
+- `renderRecordSection()` function
+- Related state: `record`, `nsid`, `availableNsids`
+- `validateRecord()` function
+- `updateRecord()`, `updateNsid()`, `resetRecordTemplate()`, `generateRecordTemplate()`, `getDefaultValue()` functions
+- `RECORD_PLACEHOLDER` constant
+
+**Step 2: Update renderAll to not call renderRecordSection**
+
+**Step 3: Commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "refactor: remove record validation section"
+```
+
+---
+
+## Task 12: Final Testing and Cleanup
+
+**Files:**
+- Modify: `lexicon-publisher.html`
+
+**Step 1: Test full flow locally**
+
+1. Open `/lexicon-publisher` in browser
+2. Upload a lexicon ZIP or paste JSON
+3. Click "Validate Lexicons" - should show success
+4. Click "Sign In to Publish"
+5. Enter handle and complete OAuth
+6. Verify "Your Published Lexicons" section appears
+7. Click "Publish to PDS"
+8. Verify DNS instructions appear
+9. Test "Delete" on a published lexicon
+10. Test "Sign Out"
+
+**Step 2: Ensure proper error handling**
+
+- Test with invalid JSON
+- Test with network error (disconnect)
+- Test with expired token
+
+**Step 3: Final commit**
+
+```bash
+git add lexicon-publisher.html
+git commit -m "feat: complete lexicon-publisher tool"
+```
+
+---
+
+## Task 13: Update Index Page
+
+**Files:**
+- Modify: `index.html`
+
+**Step 1: Add lexicon-publisher to tools list**
+
+Add entry for the new tool in the tools list, similar to lexicon-validator.
+
+**Step 2: Commit**
+
+```bash
+git add index.html
+git commit -m "docs: add lexicon-publisher to index"
+```
+
+---
+
+## Summary
+
+This plan creates a complete lexicon publishing tool with:
+- Same UX as lexicon-validator for uploading/editing lexicons
+- OAuth authentication via quickslice-client-js
+- Direct publishing to PDS via GraphQL mutations
+- Conflict detection with warnings
+- Management of existing published lexicons (view/delete)
+- DNS setup instructions grouped by domain authority
diff --git a/index.html b/index.html
index 554fc15..a1ded49 100644
--- a/index.html
+++ b/index.html
@@ -176,6 +176,13 @@
           </div>
           <div class="tool-description">Validate AT Protocol lexicon schemas and records.</div>
         </a>
+        <a href="lexicon-publisher" class="tool-card">
+          <div class="tool-header">
+            <span class="tool-icon" style="color: #0066cc">{ }</span>
+            <span class="tool-name">Lexicon Publisher</span>
+          </div>
+          <div class="tool-description">Publish lexicon schemas to your PDS.</div>
+        </a>
         <a href="bugs" class="tool-card">
           <div class="tool-header">
             <span class="tool-icon">🐛</span>
diff --git a/lexicon-publisher.html b/lexicon-publisher.html
new file mode 100644
index 0000000..a9ddf12
--- /dev/null
+++ b/lexicon-publisher.html
@@ -0,0 +1,2233 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta
+      http-equiv="Content-Security-Policy"
+      content="default-src 'self'; script-src 'self' 'unsafe-inline' https://cdn.jsdelivr.net https://cdnjs.cloudflare.com; style-src 'self' 'unsafe-inline'; connect-src 'self' https://quickslice-production-4b57.up.railway.app wss://quickslice-production-4b57.up.railway.app https://public.api.bsky.app https://cloudflare-dns.com; img-src 'self' https: data:;"
+    />
+    <title>{ Lexicon Publisher }</title>
+    <style>
+      /* CSS Reset */
+      *,
+      *::before,
+      *::after {
+        box-sizing: border-box;
+      }
+      * {
+        margin: 0;
+      }
+      body {
+        line-height: 1.5;
+        -webkit-font-smoothing: antialiased;
+      }
+      input,
+      button,
+      textarea {
+        font: inherit;
+      }
+
+      /* Light Theme */
+      :root {
+        --bg-primary: #f5f5f5;
+        --bg-card: #ffffff;
+        --bg-input: #fafafa;
+        --text-primary: #1a1a1a;
+        --text-secondary: #666666;
+        --accent: #0066cc;
+        --accent-hover: #0052a3;
+        --border: #e0e0e0;
+        --border-focus: #0066cc;
+        --error-bg: #fef2f2;
+        --error-border: #fca5a5;
+        --error-text: #dc2626;
+        --success-bg: #f0fdf4;
+        --success-border: #86efac;
+        --success-text: #16a34a;
+      }
+
+      body {
+        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+        background: var(--bg-primary);
+        color: var(--text-primary);
+        min-height: 100vh;
+        padding: 2rem 1rem;
+      }
+
+      #app {
+        max-width: 700px;
+        margin: 0 auto;
+      }
+
+      header {
+        text-align: center;
+        margin-bottom: 2rem;
+      }
+
+      header h1 {
+        font-size: 2rem;
+        color: var(--text-primary);
+        margin-bottom: 0.25rem;
+      }
+
+      .tagline {
+        color: var(--text-secondary);
+        font-size: 0.875rem;
+      }
+
+      .tagline a {
+        color: var(--accent);
+        text-decoration: none;
+      }
+
+      .tagline a:hover {
+        text-decoration: underline;
+      }
+
+      a {
+        color: var(--accent);
+      }
+
+      a:visited {
+        color: var(--accent);
+      }
+
+      /* Actor Autocomplete */
+      qs-actor-autocomplete {
+        --qs-input-bg: var(--bg-input);
+        --qs-input-border: var(--border);
+        --qs-input-border-focus: var(--accent);
+        --qs-input-text: var(--text-primary);
+        --qs-input-placeholder: var(--text-secondary);
+        --qs-input-padding: 0.5rem 0.75rem;
+        --qs-menu-bg: var(--bg-card);
+        --qs-menu-border: var(--border);
+        --qs-menu-shadow: rgba(0, 0, 0, 0.3);
+        --qs-item-hover: var(--bg-input);
+        --qs-item-text: var(--text-primary);
+        --qs-item-secondary: var(--text-secondary);
+        flex: 1;
+      }
+
+      /* Sections */
+      .section {
+        background: var(--bg-card);
+        border-radius: 0.5rem;
+        padding: 1rem;
+        margin-bottom: 1rem;
+        border: 1px solid var(--border);
+        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
+      }
+
+      .section-header {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 0.75rem;
+      }
+
+      .section-title {
+        font-weight: 600;
+        font-size: 0.875rem;
+        text-transform: uppercase;
+        letter-spacing: 0.05em;
+        color: var(--text-secondary);
+      }
+
+      /* Buttons */
+      .btn {
+        padding: 0.5rem 1rem;
+        border: none;
+        border-radius: 0.375rem;
+        font-size: 0.875rem;
+        font-weight: 500;
+        cursor: pointer;
+        transition:
+          background-color 0.15s,
+          opacity 0.15s;
+      }
+
+      .btn-primary {
+        background: var(--accent);
+        color: #ffffff;
+      }
+
+      .btn-primary:hover {
+        background: var(--accent-hover);
+      }
+
+      .btn-secondary {
+        background: var(--bg-card);
+        color: var(--text-primary);
+        border: 1px solid var(--border);
+      }
+
+      .btn-secondary:hover {
+        background: var(--bg-primary);
+      }
+
+      .btn-small {
+        padding: 0.25rem 0.5rem;
+        font-size: 0.75rem;
+      }
+
+      .btn-danger {
+        background: var(--error-bg);
+        color: var(--error-text);
+        border: 1px solid var(--error-border);
+      }
+
+      .btn-danger:hover {
+        background: #fee2e2;
+      }
+
+      .btn:disabled {
+        opacity: 0.5;
+        cursor: not-allowed;
+      }
+
+      /* Editors */
+      .editor-card {
+        background: var(--bg-input);
+        border: 1px solid var(--border);
+        border-radius: 0.375rem;
+        margin-bottom: 0.75rem;
+      }
+
+      .editor-header {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding: 0.5rem 0.75rem;
+        border-bottom: 1px solid var(--border);
+        background: var(--bg-card);
+        border-radius: 0.375rem 0.375rem 0 0;
+      }
+
+      .editor-label {
+        font-size: 0.75rem;
+        color: var(--text-secondary);
+        font-weight: 500;
+      }
+
+      textarea {
+        width: 100%;
+        min-height: 200px;
+        padding: 0.75rem;
+        background: var(--bg-input);
+        border: none;
+        color: var(--text-primary);
+        font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
+        font-size: 0.8125rem;
+        resize: vertical;
+        border-radius: 0 0 0.375rem 0.375rem;
+      }
+
+      textarea:focus {
+        outline: none;
+        background: #ffffff;
+      }
+
+      textarea::placeholder {
+        color: var(--text-secondary);
+        opacity: 0.6;
+      }
+
+      input[type="text"] {
+        flex: 1;
+        padding: 0.5rem 0.75rem;
+        background: var(--bg-input);
+        border: 1px solid var(--border);
+        border-radius: 0.375rem;
+        color: var(--text-primary);
+        font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
+        font-size: 0.8125rem;
+      }
+
+      input[type="text"]:focus {
+        outline: none;
+        border-color: var(--border-focus);
+        background: #ffffff;
+      }
+
+      input[type="text"]::placeholder {
+        color: var(--text-secondary);
+        opacity: 0.6;
+      }
+
+      /* Results */
+      .result {
+        padding: 1rem;
+        border-radius: 0.375rem;
+        font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
+        font-size: 0.8125rem;
+        white-space: pre-wrap;
+        word-break: break-word;
+      }
+
+      .result-success {
+        background: var(--success-bg);
+        border: 1px solid var(--success-border);
+        color: var(--success-text);
+      }
+
+      .result-error {
+        background: var(--error-bg);
+        border: 1px solid var(--error-border);
+        color: var(--error-text);
+      }
+
+      .result:empty {
+        display: none;
+      }
+
+      /* Button row */
+      .button-row {
+        display: flex;
+        gap: 0.5rem;
+        margin-top: 0.75rem;
+      }
+
+      .hidden {
+        display: none !important;
+      }
+
+      /* Drop Zone */
+      .drop-zone {
+        border: 2px dashed var(--border);
+        border-radius: 0.5rem;
+        padding: 2rem;
+        text-align: center;
+        margin-bottom: 1rem;
+        transition: all 0.2s ease;
+        cursor: pointer;
+      }
+
+      .drop-zone:hover {
+        border-color: var(--accent);
+        background: var(--bg-input);
+      }
+
+      .drop-zone.drag-over {
+        border-color: var(--accent);
+        background: rgba(0, 102, 204, 0.05);
+      }
+
+      .drop-zone-icon {
+        font-size: 2rem;
+        margin-bottom: 0.5rem;
+      }
+
+      .drop-zone-text {
+        color: var(--text-secondary);
+        font-size: 0.875rem;
+      }
+
+      .drop-zone-text strong {
+        color: var(--accent);
+      }
+
+      .drop-zone-hint {
+        color: var(--text-secondary);
+        font-size: 0.75rem;
+        margin-top: 0.25rem;
+        opacity: 0.8;
+      }
+
+      .drop-zone-example {
+        color: var(--text-secondary);
+        font-size: 0.7rem;
+        margin-top: 0.5rem;
+        opacity: 0.7;
+      }
+
+      .drop-zone-example pre {
+        font-family: monospace;
+        font-size: 0.65rem;
+        line-height: 1.3;
+      }
+
+      .drop-zone-example a {
+        color: var(--text-secondary);
+      }
+
+      .loading-spinner {
+        display: inline-block;
+        width: 1rem;
+        height: 1rem;
+        border: 2px solid var(--border);
+        border-top-color: var(--accent);
+        border-radius: 50%;
+        animation: spin 0.8s linear infinite;
+        margin-right: 0.5rem;
+        vertical-align: middle;
+      }
+
+      @keyframes spin {
+        to {
+          transform: rotate(360deg);
+        }
+      }
+
+      /* Collapsible editors */
+      .editor-card.collapsed textarea {
+        display: none;
+      }
+
+      .collapse-toggle {
+        background: none;
+        border: none;
+        cursor: pointer;
+        padding: 0.25rem;
+        color: var(--text-secondary);
+        font-size: 0.75rem;
+        display: flex;
+        align-items: center;
+        gap: 0.25rem;
+      }
+
+      .collapse-toggle:hover {
+        color: var(--text-primary);
+      }
+
+      .collapse-all-row {
+        display: flex;
+        justify-content: flex-end;
+        margin-bottom: 0.5rem;
+        gap: 0.5rem;
+      }
+
+      /* Modal */
+      .modal-overlay {
+        position: fixed;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        background: rgba(0, 0, 0, 0.5);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        z-index: 1000;
+      }
+
+      .modal {
+        background: var(--bg-card);
+        border-radius: 0.5rem;
+        padding: 1.5rem;
+        width: 90%;
+        max-width: 400px;
+        box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
+      }
+
+      .modal-header {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 1rem;
+      }
+
+      .modal-header h3 {
+        font-size: 1.125rem;
+        font-weight: 600;
+      }
+
+      .btn-close {
+        background: none;
+        border: none;
+        font-size: 1.5rem;
+        cursor: pointer;
+        color: var(--text-secondary);
+        line-height: 1;
+      }
+
+      .btn-close:hover {
+        color: var(--text-primary);
+      }
+
+      .form-group {
+        margin-bottom: 1rem;
+      }
+
+      .form-group label {
+        display: block;
+        font-size: 0.875rem;
+        font-weight: 500;
+        margin-bottom: 0.25rem;
+      }
+
+      .form-group input {
+        width: 100%;
+        padding: 0.5rem 0.75rem;
+        border: 1px solid var(--border);
+        border-radius: 0.375rem;
+        font-size: 0.875rem;
+      }
+
+      .form-group input:focus {
+        outline: none;
+        border-color: var(--border-focus);
+      }
+
+      /* User status in header */
+      .user-status {
+        display: flex;
+        align-items: center;
+        gap: 0.75rem;
+        font-size: 0.875rem;
+      }
+
+      .user-handle {
+        color: var(--text-secondary);
+      }
+
+      .btn-text {
+        background: none;
+        border: none;
+        color: var(--accent);
+        cursor: pointer;
+        font-size: 0.875rem;
+        padding: 0;
+      }
+
+      .btn-text:hover {
+        text-decoration: underline;
+      }
+
+      /* Warning box */
+      .warning-box {
+        background: #fef3c7;
+        border: 1px solid #fcd34d;
+        border-radius: 0.375rem;
+        padding: 0.75rem;
+        font-size: 0.875rem;
+        color: #92400e;
+      }
+
+      /* Published lexicon cards */
+      .published-card {
+        background: var(--bg-input);
+        border: 1px solid var(--border);
+        border-radius: 0.375rem;
+        padding: 0.75rem;
+        margin-bottom: 0.5rem;
+      }
+
+      .published-header {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+      }
+
+      .published-nsid {
+        font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
+        font-size: 0.875rem;
+        font-weight: 500;
+      }
+
+      .published-meta {
+        font-size: 0.75rem;
+        color: var(--text-secondary);
+        margin-top: 0.25rem;
+      }
+
+      /* DNS instructions */
+      .dns-card {
+        background: var(--bg-input);
+        border: 1px solid var(--border);
+        border-radius: 0.375rem;
+        padding: 1rem;
+        margin-bottom: 0.75rem;
+      }
+
+      .dns-domain {
+        font-weight: 600;
+        font-size: 1rem;
+        margin-bottom: 0.75rem;
+        color: var(--accent);
+        display: flex;
+        align-items: center;
+        gap: 0.5rem;
+      }
+
+      .dns-status {
+        font-size: 1.1rem;
+        font-weight: 700;
+      }
+
+      .dns-verified {
+        color: #22c55e;
+      }
+
+      .dns-not-found {
+        color: #ef4444;
+      }
+
+      .dns-card-verified {
+        border-color: #22c55e;
+        background: rgba(34, 197, 94, 0.05);
+      }
+
+      .dns-record {
+        background: var(--bg-card);
+        border: 1px solid var(--border);
+        border-radius: 0.25rem;
+        padding: 0.75rem;
+        margin-bottom: 0.75rem;
+      }
+
+      .dns-row {
+        display: flex;
+        align-items: center;
+        gap: 0.5rem;
+        margin-bottom: 0.25rem;
+      }
+
+      .dns-row:last-child {
+        margin-bottom: 0;
+      }
+
+      .dns-label {
+        font-size: 0.75rem;
+        color: var(--text-secondary);
+        width: 3rem;
+      }
+
+      .dns-value {
+        font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
+        font-size: 0.8125rem;
+        flex: 1;
+      }
+
+      .dns-lexicons {
+        font-size: 0.875rem;
+      }
+
+      .dns-lexicons ul {
+        margin: 0.25rem 0 0 1.25rem;
+        padding: 0;
+      }
+
+      .dns-lexicons li {
+        font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
+        font-size: 0.8125rem;
+      }
+
+      .dns-note {
+        background: #dbeafe;
+        border: 1px solid #93c5fd;
+        border-radius: 0.375rem;
+        padding: 0.75rem;
+        font-size: 0.875rem;
+        color: #1e40af;
+      }
+
+      /* Step wizard styles */
+      .step {
+        background: var(--bg-card);
+        border-radius: 0.5rem;
+        margin-bottom: 0.75rem;
+        border: 1px solid var(--border);
+        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
+      }
+
+      .step-header {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding: 1rem;
+        cursor: pointer;
+        user-select: none;
+      }
+
+      .step-header:hover {
+        background: var(--bg-input);
+      }
+
+      .step-header-left {
+        display: flex;
+        align-items: center;
+        gap: 0.75rem;
+      }
+
+      .step-number {
+        width: 1.75rem;
+        height: 1.75rem;
+        border-radius: 50%;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-size: 0.875rem;
+        font-weight: 600;
+        background: var(--border);
+        color: var(--text-secondary);
+      }
+
+      .step-title {
+        font-weight: 600;
+        font-size: 0.9375rem;
+      }
+
+      .step-summary {
+        font-size: 0.875rem;
+        color: var(--text-secondary);
+      }
+
+      .step-content {
+        padding: 1rem;
+        border-top: 1px solid var(--border);
+      }
+
+      /* Step states */
+      .step.step-current .step-number {
+        background: var(--accent);
+        color: #ffffff;
+      }
+
+      .step.step-current .step-header {
+        cursor: default;
+      }
+
+      .step.step-current .step-header:hover {
+        background: transparent;
+      }
+
+      .step.step-completed .step-number {
+        background: var(--success-text);
+        color: #ffffff;
+      }
+
+      .step.step-completed .step-number::after {
+        content: '✓';
+      }
+
+      .step.step-completed .step-number span {
+        display: none;
+      }
+
+      .step.step-future {
+        opacity: 0.5;
+      }
+
+      .step.step-future .step-header {
+        cursor: not-allowed;
+      }
+
+      .step.step-future .step-header:hover {
+        background: transparent;
+      }
+
+      .step.step-collapsed .step-content {
+        display: none;
+      }
+
+      .step.step-collapsed .step-header {
+        border-bottom: none;
+      }
+    </style>
+  </head>
+  <body>
+    <div id="app">
+      <header>
+        <div>
+          <h1>
+            <span style="color: var(--accent)">{</span> Lexicon Publisher
+            <span style="color: var(--accent)">}</span>
+          </h1>
+          <p class="tagline">
+            Publish your AT Protocol Lexicon schemas
+          </p>
+        </div>
+      </header>
+      <div style="text-align: center; margin-bottom: 1.5rem; font-size: 0.875rem; color: var(--text-secondary);">
+        Learn more:
+        <a href="https://atproto.com/specs/lexicon#lexicon-publication-and-resolution" target="_blank" rel="noopener">AT Protocol Spec</a>
+        ·
+        <a href="https://nickthesick.com/blog/Publishing+ATProto+Lexicons" target="_blank" rel="noopener">Publishing Guide</a>
+        ·
+        🐛 <a href="https://tools.slices.network/bugs?ns=network.slices" target="_blank" rel="noopener">Report a bug</a>
+      </div>
+      <main id="steps-container">
+      </main>
+      <footer style="text-align: center; padding: 2rem 1rem; color: var(--text-secondary); font-size: 0.875rem;">
+        <svg width="24" height="24" viewBox="0 0 128 128" style="vertical-align: middle; margin-right: 0.5rem;">
+          <defs>
+            <linearGradient id="board1" x1="0%" y1="0%" x2="100%" y2="100%">
+              <stop offset="0%" stop-color="#FF6347" />
+              <stop offset="100%" stop-color="#FF4500" />
+            </linearGradient>
+            <linearGradient id="board2" x1="0%" y1="0%" x2="100%" y2="100%">
+              <stop offset="0%" stop-color="#00CED1" />
+              <stop offset="100%" stop-color="#4682B4" />
+            </linearGradient>
+          </defs>
+          <g transform="translate(64, 64)">
+            <ellipse cx="0" cy="-28" rx="50" ry="20" fill="url(#board1)" />
+            <ellipse cx="0" cy="0" rx="60" ry="20" fill="url(#board2)" />
+            <ellipse cx="0" cy="28" rx="40" ry="20" fill="#32CD32" />
+          </g>
+        </svg>
+        © 2025 slices.network
+      </footer>
+    </div>
+    <script src="https://cdn.jsdelivr.net/gh/bigmoves/honk@deaa420/dist/honk.min.js" integrity="sha384-c6ZE86yow2uS6DWDABjcuBgp4d9kDleBTyI7eDxjwdgqvl92jM4iFZ+mK3FuxKTk" crossorigin="anonymous"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js" integrity="sha384-+mbV2IY1Zk/X1p/nWllGySJSUN8uMs+gUAN10Or95UBH0fpj6GfKgPmgC5EXieXG" crossorigin="anonymous"></script>
+    <!-- TODO: Pin quickslice to a specific version/commit instead of @main -->
+    <script src="https://cdn.jsdelivr.net/gh/bigmoves/quickslice@main/quickslice-client-js/dist/quickslice-client.min.js" crossorigin="anonymous"></script>
+    <script src="https://cdn.jsdelivr.net/gh/bigmoves/elements@v0.1.0/dist/elements.min.js" integrity="sha384-ZT1CwqnY+9K7mM18To0R9U17zu1pEQUJLncM59n3QlwKcGeHI944R8knY+Alh2eA" crossorigin="anonymous"></script>
+    <script>
+      // =============================================================================
+      // CONSTANTS
+      // =============================================================================
+
+      const SERVER_URL = "https://quickslice-production-4b57.up.railway.app";
+      const CLIENT_ID = "client_0ygtMYHz-rzUtCMgvhigcA";
+      const SCOPE = "atproto repo:com.atproto.lexicon.schema";
+
+      // =============================================================================
+      // STATE
+      // =============================================================================
+
+      const state = {
+        // Existing lexicon state
+        lexicons: [{ id: 1, value: "", collapsed: false }],
+        nextLexiconId: 2,
+        result: null,
+
+        // New: Auth state
+        client: null,
+        viewer: null, // { did, handle }
+
+        // New: Published lexicons from user's PDS
+        publishedLexicons: [],
+
+        // New: Publish workflow
+        validationPassed: false,
+        conflicts: [], // [{ nsid, existingOwner, isSameOwner }]
+        publishResults: [], // [{ nsid, success, error }]
+
+        // New: DNS instructions
+        dnsInstructions: [], // [{ domain, record, lexicons }]
+
+        // New: External dependency check
+        missingDependencies: [], // [nsid, ...]
+
+        // Publish result (separate from validation result)
+        publishResult: null,
+
+        // Loading states
+        isValidating: false,
+        isPublishing: false,
+
+        // Step wizard state
+        currentStep: 1, // 1=SignIn, 2=Define, 3=Publish, 4=DNS, 5=Published
+        stepCompleted: {
+          1: false, // Sign In
+          2: false, // Define Lexicons
+          3: false, // Publish
+          4: false, // Verify DNS (non-blocking)
+        },
+      };
+
+      // =============================================================================
+      // STEP NAVIGATION
+      // =============================================================================
+
+      function goToStep(stepNumber) {
+        if (stepNumber < 1 || stepNumber > 5) return;
+
+        // Can only go to completed steps or the next available step
+        const maxAllowedStep = getMaxAllowedStep();
+        if (stepNumber > maxAllowedStep) return;
+
+        state.currentStep = stepNumber;
+        renderAllSteps();
+      }
+
+      function getMaxAllowedStep() {
+        // Can go to step N+1 if step N is completed
+        for (let i = 1; i <= 4; i++) {
+          if (!state.stepCompleted[i]) return i;
+        }
+        return 5;
+      }
+
+      function completeStep(stepNumber) {
+        state.stepCompleted[stepNumber] = true;
+        state.currentStep = Math.min(stepNumber + 1, 5);
+        renderAllSteps();
+      }
+
+      function resetStepsFrom(stepNumber) {
+        // Reset this step and all downstream steps
+        for (let i = stepNumber; i <= 4; i++) {
+          state.stepCompleted[i] = false;
+        }
+        // Clear downstream state
+        if (stepNumber <= 2) {
+          state.validationPassed = false;
+          state.conflicts = [];
+          state.missingDependencies = [];
+          state.result = null;
+        }
+        if (stepNumber <= 3) {
+          state.publishResult = null;
+          state.publishResults = [];
+        }
+      }
+
+      function getStepSummary(stepNumber) {
+        switch (stepNumber) {
+          case 1:
+            return state.viewer ? `@${state.viewer.handle}` : '';
+          case 2:
+            const validCount = state.lexicons.filter(l => l.value.trim()).length;
+            return `${validCount} lexicon${validCount !== 1 ? 's' : ''} ready`;
+          case 3:
+            const publishedCount = state.publishResults.filter(r => r.success).length;
+            return `Published ${publishedCount} lexicon${publishedCount !== 1 ? 's' : ''}`;
+          case 4:
+            const verifiedCount = state.dnsInstructions.filter(d => d.verified === true).length;
+            const totalDns = state.dnsInstructions.length;
+            if (totalDns === 0) return 'No DNS needed';
+            if (verifiedCount === totalDns) return 'DNS verified';
+            return `${verifiedCount}/${totalDns} domains verified`;
+          default:
+            return '';
+        }
+      }
+
+      // =============================================================================
+      // PLACEHOLDERS
+      // =============================================================================
+
+      const LEXICON_PLACEHOLDER = `{
+  "lexicon": 1,
+  "id": "com.example.myRecord",
+  "defs": {
+    "main": {
+      "type": "record",
+      "record": {
+        "type": "object",
+        "required": ["status", "createdAt"],
+        "properties": {
+          "status": {
+            "type": "string",
+            "maxLength": 100
+          },
+          "createdAt": {
+            "type": "string",
+            "format": "datetime"
+          }
+        }
+      }
+    }
+  }
+}`;
+
+      // =============================================================================
+      // HELPERS
+      // =============================================================================
+
+      function esc(str) {
+        const d = document.createElement("div");
+        d.textContent = str || "";
+        return d.innerHTML;
+      }
+
+      function escapeAttr(str) {
+        return (str || "")
+          .replace(/&/g, "&amp;")
+          .replace(/"/g, "&quot;")
+          .replace(/</g, "&lt;")
+          .replace(/>/g, "&gt;");
+      }
+
+      function unwrapHonkResult(result) {
+        if (typeof result.isOk === "function") {
+          return { ok: result.isOk(), value: result[0] };
+        }
+        return { ok: true, value: result };
+      }
+
+      function formatHonkError(err) {
+        if (!err) return "Unknown error";
+        if (typeof err === "string") return err;
+        if (err.message) {
+          return err.path ? `${err.message} (at ${err.path})` : err.message;
+        }
+
+        // Handle Gleam Dict/Map structure (HAMT)
+        // Structure: { root: { array: [{ k: nsid, v: { head: errorMsg, tail: {} } }] }, size: n }
+        if (err.root && err.root.array && Array.isArray(err.root.array)) {
+          const errors = [];
+          for (const entry of err.root.array) {
+            if (entry.v) {
+              // Extract errors from linked list structure (head/tail)
+              let current = entry.v;
+              while (current && current.head) {
+                errors.push(current.head);
+                current = current.tail;
+              }
+            }
+          }
+          if (errors.length > 0) {
+            return errors.join("\n");
+          }
+        }
+
+        // Handle simple linked list structure (head/tail without root)
+        if (err.head) {
+          const errors = [];
+          let current = err;
+          while (current && current.head) {
+            errors.push(current.head);
+            current = current.tail;
+          }
+          if (errors.length > 0) {
+            return errors.join("\n");
+          }
+        }
+
+        return JSON.stringify(err, null, 2);
+      }
+
+      // =============================================================================
+      // OAUTH
+      // =============================================================================
+
+      async function initClient() {
+        if (!state.client) {
+          state.client = await QuicksliceClient.createQuicksliceClient({
+            server: SERVER_URL,
+            clientId: CLIENT_ID,
+            scope: SCOPE,
+          });
+        }
+        return state.client;
+      }
+
+      function showLoginModal() {
+        const existing = document.getElementById("login-modal");
+        if (existing) existing.remove();
+
+        const modal = document.createElement("div");
+        modal.id = "login-modal";
+        modal.className = "modal-overlay";
+        modal.innerHTML = `
+          <div class="modal">
+            <div class="modal-header">
+              <h3>Sign In</h3>
+              <button class="btn-close" onclick="closeLoginModal()">&times;</button>
+            </div>
+            <form onsubmit="handleLogin(event)">
+              <div class="form-group">
+                <label for="login-handle">Your handle</label>
+                <input type="text" id="login-handle" placeholder="you.bsky.social" required />
+              </div>
+              <button type="submit" class="btn btn-primary" style="width: 100%">Sign In</button>
+            </form>
+          </div>
+        `;
+        document.body.appendChild(modal);
+        document.getElementById("login-handle").focus();
+      }
+
+      function closeLoginModal() {
+        const modal = document.getElementById("login-modal");
+        if (modal) modal.remove();
+      }
+
+      async function handleLogin(event) {
+        event.preventDefault();
+        const handle = document.getElementById("login-handle").value.trim();
+        if (!handle) return;
+
+        try {
+          await initClient();
+          await state.client.loginWithRedirect({ handle });
+        } catch (err) {
+          console.error("Login error:", err);
+          state.result = { success: false, message: "Login failed: " + err.message };
+          renderAllSteps();
+        }
+      }
+
+      function handleLogout() {
+        if (state.client) {
+          state.client.logout();
+        }
+        window.location.reload();
+      }
+
+      // =============================================================================
+      // RENDERING
+      // =============================================================================
+
+      function renderStep(stepNumber, title, contentHtml) {
+        const isCompleted = state.stepCompleted[stepNumber];
+        const isCurrent = state.currentStep === stepNumber;
+        const isFuture = stepNumber > getMaxAllowedStep();
+        const isCollapsed = !isCurrent;
+
+        const classes = ['step'];
+        if (isCompleted) classes.push('step-completed');
+        if (isCurrent) classes.push('step-current');
+        if (isFuture) classes.push('step-future');
+        if (isCollapsed) classes.push('step-collapsed');
+
+        const summary = isCompleted ? getStepSummary(stepNumber) : '';
+        const clickHandler = !isCurrent && !isFuture ? `onclick="goToStep(${stepNumber})"` : '';
+
+        return `
+          <div class="${classes.join(' ')}" data-step="${stepNumber}">
+            <div class="step-header" ${clickHandler}>
+              <div class="step-header-left">
+                <div class="step-number"><span>${stepNumber}</span></div>
+                <span class="step-title">${esc(title)}</span>
+              </div>
+              ${summary ? `<span class="step-summary">${esc(summary)}</span>` : ''}
+            </div>
+            <div class="step-content">
+              ${contentHtml}
+            </div>
+          </div>
+        `;
+      }
+
+      function renderAllSteps() {
+        const container = document.getElementById('steps-container');
+        if (!container) return;
+
+        container.innerHTML = [
+          renderStep(1, 'Sign In', renderSignInContent()),
+          renderStep(2, 'Define Lexicons', renderDefineLexiconsContent()),
+          renderStep(3, 'Publish', renderPublishContent()),
+          renderStep(4, 'Verify DNS', renderDnsContent()),
+          renderStep(5, 'Your Published Lexicons', renderPublishedLexiconsContent()),
+        ].join('');
+
+        setupAutocomplete();
+      }
+
+      function renderSignInContent() {
+        if (state.viewer) {
+          // Already signed in - show minimal confirmation
+          return `
+            <p style="color: var(--text-secondary);">
+              Signed in as <strong>@${esc(state.viewer.handle)}</strong>
+            </p>
+            <div class="button-row">
+              <button class="btn btn-secondary" onclick="handleLogout()">Sign Out</button>
+            </div>
+          `;
+        }
+
+        return `
+          <p style="color: var(--text-secondary); margin-bottom: 1rem;">
+            Sign in with your AT Protocol handle to publish lexicons to your PDS.
+          </p>
+          <form onsubmit="handleStepLogin(event)" style="display: flex; gap: 0.5rem; align-items: flex-start;">
+            <qs-actor-autocomplete id="handle-autocomplete" placeholder="you.bsky.social"></qs-actor-autocomplete>
+            <input type="hidden" id="step-login-handle" />
+            <button type="submit" class="btn btn-primary">Sign In</button>
+          </form>
+        `;
+      }
+
+      function setupAutocomplete() {
+        const autocomplete = document.getElementById('handle-autocomplete');
+        if (!autocomplete) return;
+
+        autocomplete.addEventListener('qs-select', (e) => {
+          document.getElementById('step-login-handle').value = e.detail.actor.handle;
+        });
+        autocomplete.addEventListener('input', () => {
+          document.getElementById('step-login-handle').value = autocomplete.value;
+        });
+      }
+
+      async function handleStepLogin(event) {
+        event.preventDefault();
+        const handle = document.getElementById('step-login-handle').value.trim() ||
+                       document.getElementById('handle-autocomplete')?.value?.trim();
+        if (!handle) return;
+
+        try {
+          await initClient();
+          await state.client.loginWithRedirect({ handle });
+        } catch (err) {
+          console.error('Login error:', err);
+          state.result = { success: false, message: 'Login failed: ' + err.message };
+          renderAllSteps();
+        }
+      }
+
+      function renderDefineLexiconsContent() {
+        const getLexiconLabel = (lex, idx) => {
+          try {
+            const obj = JSON.parse(lex.value);
+            if (obj.id) return obj.id;
+          } catch (e) {}
+          return `Lexicon ${idx + 1}`;
+        };
+
+        const editorsHtml = state.lexicons
+          .map(
+            (lex, idx) => `
+        <div class="editor-card ${lex.collapsed ? "collapsed" : ""}" data-lexicon-id="${lex.id}">
+          <div class="editor-header">
+            <div style="display: flex; align-items: center; gap: 0.5rem;">
+              <button class="collapse-toggle" onclick="toggleLexicon(${lex.id})">
+                ${lex.collapsed ? "▶" : "▼"}
+              </button>
+              <span class="editor-label">${esc(getLexiconLabel(lex, idx))}</span>
+            </div>
+            <button
+              class="btn btn-danger btn-small"
+              onclick="removeLexicon(${lex.id})"
+              ${state.lexicons.length === 1 ? "disabled" : ""}
+            >Remove</button>
+          </div>
+          <textarea
+            placeholder="${escapeAttr(LEXICON_PLACEHOLDER)}"
+            onchange="handleLexiconChange(${lex.id}, this.value)"
+            oninput="handleLexiconChange(${lex.id}, this.value)"
+          >${esc(lex.value)}</textarea>
+        </div>
+      `,
+          )
+          .join("");
+
+        const hasMultiple = state.lexicons.length > 1;
+        const allCollapsed = state.lexicons.every((l) => l.collapsed);
+        const collapseAllRow = hasMultiple
+          ? `<div class="collapse-all-row">
+              <button class="btn btn-secondary btn-small" onclick="toggleAllLexicons(${allCollapsed ? "false" : "true"})">
+                ${allCollapsed ? "Expand All" : "Collapse All"}
+              </button>
+            </div>`
+          : "";
+
+        const resultHtml = state.result && state.currentStep === 2 ? `
+          <div class="result ${state.result.success ? 'result-success' : 'result-error'}" style="margin-top: 0.75rem;">${state.result.success ? '✓' : '✗'} ${esc(state.result.message)}</div>
+          ${state.missingDependencies.length > 0 ? `
+            <div class="warning-box" style="margin-top: 0.75rem;">
+              <strong>Missing external dependencies:</strong>
+              <ul style="margin: 0.5rem 0 0 1.25rem;">
+                ${state.missingDependencies.map(d => `<li>${esc(d)}</li>`).join('')}
+              </ul>
+            </div>
+          ` : ''}
+        ` : '';
+
+        return `
+          <div
+            class="drop-zone"
+            id="drop-zone"
+            ondragover="handleDragOver(event)"
+            ondragleave="handleDragLeave(event)"
+            ondrop="handleDrop(event)"
+            onclick="triggerFileInput()"
+          >
+            <div class="drop-zone-icon">📦</div>
+            <div class="drop-zone-text">
+              <strong>Drop a .zip file of your lexicons</strong> or click to browse
+            </div>
+            <div class="drop-zone-hint">Supports nested folders with .json lexicon files</div>
+            <div class="drop-zone-example">
+<pre style="text-align: left; margin: 0.75rem auto 0; display: inline-block;">lexicons/
+├── com/
+│   └── example/
+│       ├── actor/
+│       │   └── profile.json
+│       └── feed/
+│           └── post.json</pre>
+            </div>
+          </div>
+          <div style="display: flex; justify-content: center; margin-bottom: 1rem; color: var(--text-secondary);">
+            See&nbsp;<a href="https://github.com/bluesky-social/atproto/tree/main/lexicons" target="_blank" rel="noopener">bluesky-social/atproto/lexicons</a>&nbsp;for a typical structure
+          </div>
+          <input type="file" id="file-input" accept=".zip" onchange="handleFileSelect(event)" style="display: none;" />
+          ${collapseAllRow}
+          ${editorsHtml}
+          <div class="button-row">
+            <button class="btn btn-secondary" onclick="addLexicon()" ${state.isValidating ? 'disabled' : ''}>+ Add Lexicon</button>
+            <button class="btn btn-primary" onclick="continueToPublish()" ${state.isValidating ? 'disabled' : ''}>
+              ${state.isValidating ? '<span class="loading-spinner"></span> Validating...' : 'Continue to Publish'}
+            </button>
+          </div>
+          ${state.publishedLexicons.length > 0 ? `
+            <div style="text-align: center; margin-top: 0.75rem;">
+              <a href="#" onclick="goToPublishedStep(); return false;" style="color: var(--text-secondary); font-size: 0.875rem;">
+                or view your published lexicons
+              </a>
+            </div>
+          ` : ''}
+          ${resultHtml}
+        `;
+      }
+
+      function goToPublishedStep() {
+        // Skip to step 5 to view published lexicons
+        state.stepCompleted[2] = true;
+        state.stepCompleted[3] = true;
+        state.stepCompleted[4] = true;
+        state.currentStep = 5;
+        renderAllSteps();
+      }
+
+      function handleLexiconChange(id, value) {
+        const lex = state.lexicons.find((l) => l.id === id);
+        if (lex) {
+          lex.value = value;
+          // Reset downstream steps when editing
+          if (state.stepCompleted[2]) {
+            resetStepsFrom(2);
+          }
+        }
+      }
+
+      async function continueToPublish() {
+        // Validate lexicons first
+        state.result = null;
+        state.validationPassed = false;
+        state.conflicts = [];
+        state.missingDependencies = [];
+        state.isValidating = true;
+        renderAllSteps();
+
+        const parseResult = parseLexicons();
+        if (parseResult.error) {
+          state.result = { success: false, message: parseResult.error };
+          state.isValidating = false;
+          renderAllSteps();
+          return;
+        }
+
+        try {
+          const lexiconList = honk.toList(parseResult.lexicons);
+          const result = honk.validate(lexiconList);
+          const unwrapped = unwrapHonkResult(result);
+
+          if (!unwrapped.ok) {
+            state.result = {
+              success: false,
+              message: `Validation failed: ${formatHonkError(unwrapped.value)}`,
+            };
+            state.isValidating = false;
+            renderAllSteps();
+            return;
+          }
+
+          const count = parseResult.lexicons.length;
+          state.result = { success: true, message: `${count} lexicon${count !== 1 ? 's' : ''} valid` };
+          state.validationPassed = true;
+
+          // Check external dependencies and conflicts
+          if (state.viewer) {
+            const userDomain = getUserDomain(state.viewer.handle);
+            const externalRefs = extractExternalRefs(parseResult.lexicons, userDomain);
+            const { missing } = await checkExternalDependencies(externalRefs);
+            state.missingDependencies = missing;
+            await checkConflicts();
+          }
+
+          state.isValidating = false;
+          // Complete step 2 and move to step 3
+          completeStep(2);
+        } catch (e) {
+          state.result = {
+            success: false,
+            message: `Validation error: ${e.message}`,
+          };
+          state.isValidating = false;
+          renderAllSteps();
+        }
+      }
+
+      function renderPublishContent() {
+        const { publishable, excluded } = getPublishableLexicons();
+        const userDomain = state.viewer ? getUserDomain(state.viewer.handle) : '';
+
+        // Build conflict lookup
+        const conflictMap = {};
+        for (const c of state.conflicts) {
+          conflictMap[c.nsid] = c;
+        }
+
+        // Categorize lexicons
+        const willPublish = []; // new or update (same owner)
+        const blocked = []; // different owner conflicts
+
+        for (const p of publishable) {
+          const conflict = conflictMap[p.nsid];
+          if (conflict && !conflict.isSameOwner) {
+            blocked.push({ nsid: p.nsid, owner: conflict.existingOwner });
+          } else {
+            willPublish.push({
+              nsid: p.nsid,
+              isUpdate: conflict && conflict.isSameOwner
+            });
+          }
+        }
+
+        const publishCount = willPublish.length;
+        const canPublish = publishCount > 0;
+
+        const resultHtml = state.publishResult ? `
+          <div class="result ${state.publishResult.success ? 'result-success' : 'result-error'}" style="margin-top: 0.75rem;">${state.publishResult.success ? '✓' : '✗'} ${esc(state.publishResult.message)}</div>
+        ` : '';
+
+        // Unified lexicon list
+        const listItems = [];
+
+        // Publishable (new or update)
+        for (const item of willPublish) {
+          const status = item.isUpdate ? 'update' : 'new';
+          listItems.push(`<li><span style="color: var(--success);">✓</span> ${esc(item.nsid)} <span style="opacity: 0.6;">(${status})</span></li>`);
+        }
+
+        // Excluded (wrong domain)
+        for (const item of excluded) {
+          listItems.push(`<li><span style="opacity: 0.5;">−</span> <span style="opacity: 0.6;">${esc(item.nsid)}</span> <span style="opacity: 0.5;">(${esc(getRootDomain(item.domain))})</span></li>`);
+        }
+
+        // Blocked (different owner)
+        for (const item of blocked) {
+          listItems.push(`<li><span style="color: var(--error);">✗</span> ${esc(item.nsid)} <span style="opacity: 0.6;">owned by @${esc(item.owner)}</span></li>`);
+        }
+
+        const lexiconList = listItems.length > 0 ? `
+          <ul style="margin: 0 0 0.75rem 0; padding-left: 0; list-style: none; font-family: ui-monospace, SFMono-Regular, monospace; font-size: 0.875rem;">
+            ${listItems.join('')}
+          </ul>
+        ` : '';
+
+        return `
+          <p style="color: var(--text-secondary); margin-bottom: 0.75rem;">
+            ${canPublish
+              ? `Publish ${publishCount} lexicon${publishCount !== 1 ? 's' : ''} to @${esc(state.viewer?.handle || '')}'s PDS.`
+              : `No lexicons to publish for ${esc(userDomain)}.`}
+          </p>
+          ${lexiconList}
+          <div class="button-row">
+            <button class="btn btn-primary" onclick="publishAndContinue()" ${canPublish && !state.isPublishing ? '' : 'disabled'}>
+              ${state.isPublishing ? '<span class="loading-spinner"></span> Publishing...' : 'Publish to PDS'}
+            </button>
+          </div>
+          ${resultHtml}
+        `;
+      }
+
+      async function publishAndContinue() {
+        if (!state.viewer || !state.client) return;
+
+        state.publishResults = [];
+        state.publishResult = null;
+        state.isPublishing = true;
+        renderAllSteps();
+
+        const { publishable: lexiconsToPublish } = getPublishableLexicons();
+
+        if (lexiconsToPublish.length === 0) {
+          state.publishResult = { success: false, message: "No valid lexicons to publish" };
+          state.isPublishing = false;
+          renderAllSteps();
+          return;
+        }
+
+        // Publish each lexicon
+        for (const { nsid, schema } of lexiconsToPublish) {
+          try {
+            const ownedConflict = state.conflicts.find(c => c.nsid === nsid && c.isSameOwner);
+            const input = {
+              id: nsid,
+              defs: schema.defs,
+              lexicon: schema.lexicon || 1,
+              ...(schema.description && { description: schema.description }),
+            };
+
+            if (ownedConflict) {
+              await state.client.mutate(`
+                mutation UpdateSchema($input: ComAtprotoLexiconSchemaInput!, $rkey: String!) {
+                  updateComAtprotoLexiconSchema(input: $input, rkey: $rkey) {
+                    uri
+                  }
+                }
+              `, { rkey: nsid, input });
+              state.publishResults.push({ nsid, success: true, updated: true });
+            } else {
+              await state.client.mutate(`
+                mutation CreateSchema($input: ComAtprotoLexiconSchemaInput!, $rkey: String!) {
+                  createComAtprotoLexiconSchema(input: $input, rkey: $rkey) {
+                    uri
+                  }
+                }
+              `, { rkey: nsid, input });
+              state.publishResults.push({ nsid, success: true });
+            }
+          } catch (err) {
+            state.publishResults.push({ nsid, success: false, error: err.message });
+          }
+        }
+
+        // Generate DNS instructions
+        generateDnsInstructions(lexiconsToPublish.map(l => l.nsid));
+
+        // Refresh published lexicons list
+        await fetchPublishedLexicons();
+
+        // Show results
+        const successCount = state.publishResults.filter(r => r.success).length;
+        const failCount = state.publishResults.filter(r => !r.success).length;
+
+        state.isPublishing = false;
+
+        if (failCount === 0) {
+          state.publishResult = { success: true, message: `Published ${successCount} lexicon${successCount !== 1 ? 's' : ''}` };
+          // Complete step 3 and move forward
+          completeStep(3);
+        } else {
+          const errors = state.publishResults.filter(r => !r.success).map(r => `${r.nsid}: ${r.error}`).join('\n');
+          state.publishResult = { success: false, message: `Published ${successCount}, failed ${failCount}:\n${errors}` };
+          renderAllSteps();
+        }
+      }
+
+      function renderDnsContent() {
+        if (state.dnsInstructions.length === 0) {
+          return `
+            <p style="color: var(--text-secondary);">
+              No DNS records required. Your lexicons are published!
+            </p>
+            <div class="button-row">
+              <button class="btn btn-primary" onclick="skipDnsAndContinue()">View Published Lexicons</button>
+            </div>
+          `;
+        }
+
+        const cards = state.dnsInstructions.map(instr => {
+          let statusIcon = '';
+          if (instr.verified === true) {
+            statusIcon = '<span class="dns-status dns-verified" title="Verified">✓</span>';
+          } else if (instr.verified === false) {
+            statusIcon = '<span class="dns-status dns-not-found" title="Not found">✗</span>';
+          }
+
+          return `
+            <div class="dns-card ${instr.verified === true ? 'dns-card-verified' : ''}">
+              <div class="dns-domain">${esc(instr.domain)} ${statusIcon}</div>
+              <div class="dns-record">
+                <div class="dns-row">
+                  <span class="dns-label">Type:</span>
+                  <span class="dns-value">TXT</span>
+                </div>
+                <div class="dns-row">
+                  <span class="dns-label">Name:</span>
+                  <span class="dns-value">${esc(instr.recordName)}</span>
+                  <button class="btn btn-secondary btn-small" onclick="copyToClipboard('${escapeAttr(instr.recordName)}')">Copy</button>
+                </div>
+                <div class="dns-row">
+                  <span class="dns-label">Value:</span>
+                  <span class="dns-value">${esc(instr.recordValue)}</span>
+                  <button class="btn btn-secondary btn-small" onclick="copyToClipboard('${escapeAttr(instr.recordValue)}')">Copy</button>
+                </div>
+              </div>
+              <div class="dns-lexicons">
+                <strong>Lexicons:</strong>
+                <ul>
+                  ${instr.lexicons.map(l => `<li>${esc(l)}</li>`).join('')}
+                </ul>
+              </div>
+            </div>
+          `;
+        }).join('');
+
+        const allVerified = state.dnsInstructions.every(d => d.verified === true);
+
+        return `
+          <div class="dns-note" style="margin-bottom: 0.75rem;">
+            Add these TXT records to your DNS provider. You must control these domains to complete lexicon resolution.
+          </div>
+          ${cards}
+          <div class="button-row">
+            <button class="btn btn-secondary" onclick="verifyDnsAndRender()">Verify DNS</button>
+            <button class="btn btn-primary" onclick="continueToDone()">
+              ${allVerified ? 'Continue' : 'Skip for Now'}
+            </button>
+          </div>
+        `;
+      }
+
+      async function verifyDnsAndRender() {
+        await verifyDnsRecords();
+        renderAllSteps();
+      }
+
+      function skipDnsAndContinue() {
+        // Mark DNS step as complete (non-blocking) and continue
+        state.stepCompleted[4] = true;
+        state.currentStep = 5;
+        renderAllSteps();
+      }
+
+      function continueToDone() {
+        // Mark DNS step as complete and move to final step
+        state.stepCompleted[4] = true;
+        state.currentStep = 5;
+        renderAllSteps();
+      }
+
+      function renderPublishedLexiconsContent() {
+        if (state.publishedLexicons.length === 0) {
+          return `
+            <p style="color: var(--text-secondary);">
+              You haven't published any lexicons yet.
+            </p>
+          `;
+        }
+
+        const lexiconCards = state.publishedLexicons.map(lex => `
+          <div class="published-card">
+            <div class="published-header">
+              <span class="published-nsid">${esc(lex.rkey)}</span>
+              <button class="btn btn-danger btn-small" onclick="deleteLexiconAndRender('${escapeAttr(lex.rkey)}')">
+                Delete
+              </button>
+            </div>
+          </div>
+        `).join('');
+
+        return `
+          <p style="color: var(--text-secondary); margin-bottom: 0.75rem;">
+            You have ${state.publishedLexicons.length} published lexicon${state.publishedLexicons.length !== 1 ? 's' : ''}.
+          </p>
+          ${lexiconCards}
+          <div class="button-row" style="margin-top: 1rem;">
+            <button class="btn btn-primary" onclick="goToDefineStep()">Add or Update Lexicons</button>
+          </div>
+        `;
+      }
+
+      function goToDefineStep() {
+        // Reset steps 2-4 but keep step 1 complete (still signed in)
+        resetStepsFrom(2);
+        state.currentStep = 2;
+        renderAllSteps();
+      }
+
+      async function deleteLexiconAndRender(rkey) {
+        if (!confirm(`Delete lexicon ${rkey}?`)) return;
+
+        try {
+          await state.client.mutate(`
+            mutation DeleteSchema($rkey: String!) {
+              deleteComAtprotoLexiconSchema(rkey: $rkey) {
+                uri
+              }
+            }
+          `, { rkey });
+
+          state.publishedLexicons = state.publishedLexicons.filter(l => l.rkey !== rkey);
+
+          // Update DNS instructions if needed
+          if (state.publishedLexicons.length > 0) {
+            generateDnsInstructions(state.publishedLexicons.map(l => l.rkey));
+          } else {
+            state.dnsInstructions = [];
+          }
+
+          renderAllSteps();
+        } catch (err) {
+          alert(`Failed to delete: ${err.message}`);
+        }
+      }
+
+      async function fetchPublishedLexicons() {
+        if (!state.viewer || !state.client) return;
+
+        try {
+          const result = await state.client.query(`
+            query {
+              viewer {
+                comAtprotoLexiconSchemaByDid(first: 100) {
+                  edges {
+                    node {
+                      uri
+                      defs
+                      lexicon
+                      indexedAt
+                    }
+                  }
+                }
+              }
+            }
+          `);
+
+          state.publishedLexicons = (result?.viewer?.comAtprotoLexiconSchemaByDid?.edges || [])
+            .map(e => {
+              const uri = e.node.uri;
+              const rkey = uri.split('/').pop();
+              return {
+                uri,
+                rkey,
+                defs: e.node.defs,
+                lexicon: e.node.lexicon,
+                indexedAt: e.node.indexedAt,
+              };
+            });
+
+          // Generate DNS instructions from published lexicons
+          if (state.publishedLexicons.length > 0) {
+            generateDnsInstructions(state.publishedLexicons.map(l => l.rkey));
+          }
+        } catch (err) {
+          console.error("Failed to fetch published lexicons:", err);
+        }
+      }
+
+      function getDomainAuthority(nsid) {
+        // "buzz.bookhive.defs" → "bookhive.buzz"
+        // "buzz.bookhive.actor.profile" → "actor.bookhive.buzz"
+        const parts = nsid.split(".");
+        parts.pop(); // remove name (last segment)
+        return parts.reverse().join(".");
+      }
+
+      function getUserDomain(handle) {
+        // "bigmoves.bookhive.buzz" → "bookhive.buzz"
+        // "chad.bsky.social" → "bsky.social"
+        const parts = handle.split(".");
+        if (parts.length >= 2) {
+          return parts.slice(-2).join(".");
+        }
+        return handle;
+      }
+
+      function getRootDomain(domain) {
+        // "richtext.bsky.app" → "bsky.app"
+        // "actor.bsky.app" → "bsky.app"
+        const parts = domain.split(".");
+        if (parts.length >= 2) {
+          return parts.slice(-2).join(".");
+        }
+        return domain;
+      }
+
+      function canPublishLexicon(nsid) {
+        if (!state.viewer) return false;
+        const userDomain = getUserDomain(state.viewer.handle);
+        const lexiconDomain = getDomainAuthority(nsid);
+        // Check if lexicon domain ends with user's domain
+        return lexiconDomain === userDomain || lexiconDomain.endsWith("." + userDomain);
+      }
+
+      function getPublishableLexicons() {
+        const publishable = [];
+        const excluded = [];
+
+        for (const lex of state.lexicons) {
+          const trimmed = lex.value.trim();
+          if (!trimmed) continue;
+          try {
+            const obj = JSON.parse(trimmed);
+            if (obj.id) {
+              if (canPublishLexicon(obj.id)) {
+                publishable.push({ nsid: obj.id, schema: obj });
+              } else {
+                excluded.push({ nsid: obj.id, domain: getDomainAuthority(obj.id) });
+              }
+            }
+          } catch (e) {}
+        }
+
+        return { publishable, excluded };
+      }
+
+      function extractExternalRefs(lexicons, userDomain) {
+        const refs = new Set();
+
+        function walk(obj) {
+          if (!obj || typeof obj !== 'object') return;
+          if (obj.ref && typeof obj.ref === 'string') {
+            const nsid = obj.ref.split('#')[0];
+            if (!nsid) return; // Skip local refs like #main
+            const domain = getDomainAuthority(nsid);
+            if (domain !== userDomain && !domain.endsWith('.' + userDomain)) {
+              refs.add(nsid);
+            }
+          }
+          for (const val of Object.values(obj)) walk(val);
+        }
+
+        for (const lex of lexicons) walk(lex);
+        return [...refs];
+      }
+
+      async function checkExternalDependencies(externalNsids) {
+        if (externalNsids.length === 0) return { found: [], missing: [] };
+
+        try {
+          const result = await state.client.query(`
+            query CheckDeps($nsids: [String!]!) {
+              comAtprotoLexiconSchema(
+                first: 100,
+                where: { id: { in: $nsids } }
+              ) {
+                edges {
+                  node { id }
+                }
+              }
+            }
+          `, { nsids: externalNsids });
+
+          const foundIds = (result?.comAtprotoLexiconSchema?.edges || [])
+            .map(e => e.node.id);
+
+          return {
+            found: externalNsids.filter(n => foundIds.includes(n)),
+            missing: externalNsids.filter(n => !foundIds.includes(n)),
+          };
+        } catch (err) {
+          console.error("External dependency check failed:", err);
+          return { found: [], missing: [] };
+        }
+      }
+
+      function generateDnsInstructions(nsids) {
+        if (!state.viewer) return;
+
+        const byDomain = {};
+
+        for (const nsid of nsids) {
+          const domain = getDomainAuthority(nsid);
+          if (!byDomain[domain]) {
+            byDomain[domain] = [];
+          }
+          byDomain[domain].push(nsid);
+        }
+
+        state.dnsInstructions = Object.entries(byDomain).map(([domain, lexicons]) => ({
+          domain,
+          recordName: `_lexicon.${domain}`,
+          recordValue: `did=${state.viewer.did}`,
+          lexicons,
+          verified: null, // null = not checked, true = verified, false = not found
+        }));
+      }
+
+      async function resolveDNS(name, type = 'TXT') {
+        const url = new URL('https://cloudflare-dns.com/dns-query');
+        url.searchParams.set('name', name);
+        url.searchParams.set('type', type);
+
+        const response = await fetch(url, {
+          headers: { 'Accept': 'application/dns-json' }
+        });
+
+        return response.json();
+      }
+
+      async function verifyDnsRecords() {
+        if (!state.viewer || state.dnsInstructions.length === 0) return;
+
+        const expectedValue = `did=${state.viewer.did}`;
+
+        for (const instr of state.dnsInstructions) {
+          try {
+            const result = await resolveDNS(instr.recordName, 'TXT');
+            const answers = result.Answer || [];
+            // TXT records come quoted, check if any match
+            const found = answers.some(a => {
+              const txt = (a.data || '').replace(/^"|"$/g, '');
+              return txt === expectedValue;
+            });
+            instr.verified = found;
+          } catch (err) {
+            console.error(`DNS lookup failed for ${instr.recordName}:`, err);
+            instr.verified = false;
+          }
+        }
+      }
+
+      function copyToClipboard(text) {
+        navigator.clipboard.writeText(text).catch(err => {
+          console.error('Copy failed:', err);
+        });
+      }
+
+      // =============================================================================
+      // STATE UPDATES
+      // =============================================================================
+
+      function addLexicon() {
+        state.lexicons.push({ id: state.nextLexiconId++, value: "", collapsed: false });
+        renderAllSteps();
+      }
+
+      function toggleLexicon(id) {
+        const lex = state.lexicons.find((l) => l.id === id);
+        if (lex) {
+          lex.collapsed = !lex.collapsed;
+          renderAllSteps();
+        }
+      }
+
+      function toggleAllLexicons(collapse) {
+        state.lexicons.forEach((lex) => {
+          lex.collapsed = collapse;
+        });
+        renderAllSteps();
+      }
+
+      function removeLexicon(id) {
+        if (state.lexicons.length <= 1) return;
+        state.lexicons = state.lexicons.filter((l) => l.id !== id);
+        renderAllSteps();
+      }
+
+      // =============================================================================
+      // VALIDATION
+      // =============================================================================
+
+      function parseLexicons() {
+        const parsed = [];
+        for (let i = 0; i < state.lexicons.length; i++) {
+          const lex = state.lexicons[i];
+          const trimmed = lex.value.trim();
+
+          if (!trimmed) {
+            return {
+              error: `Lexicon ${i + 1}: Empty - please enter a lexicon schema`,
+            };
+          }
+
+          // Validate JSON syntax first
+          try {
+            const obj = JSON.parse(trimmed);
+            if (Array.isArray(obj)) {
+              return {
+                error: `Lexicon ${i + 1}: Expected a single lexicon object, not an array. Use "+ Add Lexicon" for multiple.`,
+              };
+            }
+          } catch (e) {
+            return { error: `Lexicon ${i + 1}: Invalid JSON - ${e.message}` };
+          }
+
+          // Parse to Gleam Json type
+          const parseResult = honk.parse_json_string(trimmed);
+          const unwrapped = unwrapHonkResult(parseResult);
+          if (!unwrapped.ok) {
+            return { error: `Lexicon ${i + 1}: ${formatHonkError(unwrapped.value)}` };
+          }
+          parsed.push(unwrapped.value);
+        }
+        return { lexicons: parsed };
+      }
+
+      async function checkConflicts() {
+        state.conflicts = [];
+
+        // Only check conflicts for publishable lexicons (ones the user can actually publish)
+        const { publishable } = getPublishableLexicons();
+        const nsids = publishable.map(p => p.nsid);
+
+        if (nsids.length === 0) return;
+
+        try {
+          // Batch query for all NSIDs at once
+          const result = await state.client.query(`
+            query CheckConflicts($nsids: [String!]!) {
+              comAtprotoLexiconSchema(
+                where: { id: { in: $nsids } }
+                first: 100
+              ) {
+                edges {
+                  node {
+                    id
+                    uri
+                    did
+                    actorHandle
+                  }
+                }
+              }
+            }
+          `, { nsids });
+
+          const matches = result?.comAtprotoLexiconSchema?.edges || [];
+          for (const match of matches) {
+            const nsid = match.node.id;
+            const existingDid = match.node.did;
+            const existingHandle = match.node.actorHandle || existingDid;
+            const isSameOwner = state.viewer && existingDid === state.viewer.did;
+
+            state.conflicts.push({
+              nsid,
+              existingOwner: existingHandle,
+              existingDid,
+              isSameOwner,
+            });
+          }
+        } catch (err) {
+          console.error("Conflict check failed:", err);
+        }
+      }
+
+      // =============================================================================
+      // ZIP FILE HANDLING
+      // =============================================================================
+
+      function handleDragOver(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        event.currentTarget.classList.add("drag-over");
+      }
+
+      function handleDragLeave(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        event.currentTarget.classList.remove("drag-over");
+      }
+
+      function handleDrop(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        event.currentTarget.classList.remove("drag-over");
+
+        const files = event.dataTransfer.files;
+        if (files.length > 0) {
+          processZipFile(files[0]);
+        }
+      }
+
+      function triggerFileInput() {
+        document.getElementById("file-input").click();
+      }
+
+      function handleFileSelect(event) {
+        const files = event.target.files;
+        if (files.length > 0) {
+          processZipFile(files[0]);
+        }
+        // Reset input so the same file can be selected again
+        event.target.value = "";
+      }
+
+      async function processZipFile(file) {
+        if (!file.name.toLowerCase().endsWith(".zip")) {
+          state.result = {
+            success: false,
+            message: `Invalid file type: ${file.name}. Please select a .zip file.`,
+          };
+          renderAllSteps();
+          return;
+        }
+
+        const MAX_FILE_SIZE = 10 * 1024 * 1024; // 10MB
+        if (file.size > MAX_FILE_SIZE) {
+          state.result = {
+            success: false,
+            message: `File too large: ${(file.size / 1024 / 1024).toFixed(1)}MB. Maximum size is 10MB.`,
+          };
+          renderAllSteps();
+          return;
+        }
+
+        if (typeof JSZip === "undefined") {
+          state.result = {
+            success: false,
+            message: "JSZip library failed to load. Check your internet connection.",
+          };
+          renderAllSteps();
+          return;
+        }
+
+        // Show loading state
+        const dropZone = document.getElementById("drop-zone");
+        if (dropZone) {
+          dropZone.innerHTML = `
+            <div class="drop-zone-icon"><span class="loading-spinner"></span></div>
+            <div class="drop-zone-text">Processing ${esc(file.name)}...</div>
+          `;
+        }
+
+        try {
+          const zip = await JSZip.loadAsync(file);
+          const jsonFiles = [];
+
+          // Find all .json files in the zip (including nested folders)
+          // Skip macOS metadata files (__MACOSX) and hidden files (._*)
+          zip.forEach((relativePath, zipEntry) => {
+            if (
+              !zipEntry.dir &&
+              relativePath.toLowerCase().endsWith(".json") &&
+              !relativePath.startsWith("__MACOSX/") &&
+              !relativePath.split("/").some((part) => part.startsWith("._"))
+            ) {
+              jsonFiles.push({ path: relativePath, entry: zipEntry });
+            }
+          });
+
+          if (jsonFiles.length === 0) {
+            state.result = {
+              success: false,
+              message: `No .json files found in ${file.name}`,
+            };
+            renderAllSteps();
+            return;
+          }
+
+          // Extract and parse all JSON files
+          const lexicons = [];
+          const errors = [];
+
+          for (const { path, entry } of jsonFiles) {
+            try {
+              const content = await entry.async("string");
+              // Validate it's valid JSON
+              JSON.parse(content);
+              lexicons.push({ path, content });
+            } catch (e) {
+              errors.push(`${path}: ${e.message}`);
+            }
+          }
+
+          if (lexicons.length === 0) {
+            state.result = {
+              success: false,
+              message: `All JSON files had parse errors:\n${errors.join("\n")}`,
+            };
+            renderAllSteps();
+            return;
+          }
+
+          // Replace current lexicons with extracted ones (collapsed by default)
+          state.lexicons = lexicons.map((lex, idx) => ({
+            id: state.nextLexiconId + idx,
+            value: lex.content,
+            collapsed: true,
+          }));
+          state.nextLexiconId += lexicons.length;
+
+          const successMsg = `Loaded ${lexicons.length} lexicon${lexicons.length === 1 ? "" : "s"} from ${file.name}`;
+          const errorMsg =
+            errors.length > 0
+              ? `\n\nSkipped ${errors.length} file${errors.length === 1 ? "" : "s"}:\n${errors.join("\n")}`
+              : "";
+
+          state.result = {
+            success: true,
+            message: successMsg + errorMsg,
+          };
+
+          renderAllSteps();
+        } catch (e) {
+          state.result = {
+            success: false,
+            message: `Failed to read zip file: ${e.message}`,
+          };
+          renderAllSteps();
+        }
+      }
+
+      // =============================================================================
+      // INIT
+      // =============================================================================
+
+      async function init() {
+        if (typeof honk === "undefined") {
+          document.getElementById("steps-container").innerHTML = `
+            <div class="result result-error" style="margin: 1rem;">✗ Failed to load honk library from CDN. Check your internet connection.</div>
+          `;
+          return;
+        }
+
+        // Handle OAuth callback
+        if (window.location.search.includes("code=")) {
+          try {
+            await initClient();
+            await state.client.handleRedirectCallback();
+            window.history.replaceState({}, "", window.location.pathname);
+          } catch (err) {
+            console.error("OAuth callback error:", err);
+            state.result = { success: false, message: "Authentication failed: " + err.message };
+          }
+        } else {
+          try {
+            await initClient();
+          } catch (err) {
+            console.error("Failed to initialize client:", err);
+          }
+        }
+
+        // Check if authenticated and fetch viewer + published lexicons
+        if (state.client) {
+          try {
+            const isLoggedIn = await state.client.isAuthenticated();
+            if (isLoggedIn) {
+              const result = await state.client.query(`
+                query {
+                  viewer {
+                    did
+                    handle
+                    comAtprotoLexiconSchemaByDid(first: 100) {
+                      edges {
+                        node {
+                          uri
+                          defs
+                          lexicon
+                          indexedAt
+                        }
+                      }
+                    }
+                  }
+                }
+              `);
+              if (result?.viewer) {
+                state.viewer = { did: result.viewer.did, handle: result.viewer.handle };
+                state.publishedLexicons = (result.viewer.comAtprotoLexiconSchemaByDid?.edges || [])
+                  .map(e => {
+                    const uri = e.node.uri;
+                    const rkey = uri.split('/').pop();
+                    return {
+                      uri,
+                      rkey,
+                      defs: e.node.defs,
+                      lexicon: e.node.lexicon,
+                      indexedAt: e.node.indexedAt,
+                    };
+                  });
+
+                // Generate DNS instructions from published lexicons
+                if (state.publishedLexicons.length > 0) {
+                  generateDnsInstructions(state.publishedLexicons.map(l => l.rkey));
+                }
+
+                // Complete step 1 since we're signed in
+                state.stepCompleted[1] = true;
+
+                // If returning user has published lexicons, skip to step 5
+                if (state.publishedLexicons.length > 0) {
+                  state.stepCompleted[2] = true;
+                  state.stepCompleted[3] = true;
+                  state.stepCompleted[4] = true;
+                  state.currentStep = 5;
+                } else {
+                  state.currentStep = 2;
+                }
+              }
+            }
+          } catch (err) {
+            console.error("Auth check error:", err);
+          }
+        }
+
+        renderAllSteps();
+      }
+
+      window.addEventListener("DOMContentLoaded", init);
+    </script>
+  </body>
+</html>