@ibgib/space-gib 0.0.34 → 0.0.36

package/src/client/ui/component/nested-chat/chat/chat.mts

@@ -166,106 +166,21 @@ export class ChatComponentInstance
         const { ib } = getIbAndGib({ ibGibAddr: addr });
 
         if (addr === ROOT_ADDR || ib === 'root' || ib.includes('space-gib')) {
-            this.el.contextTitleEl.textContent = 'Thread: src/index.ts';
+            this.el.contextTitleEl.textContent = 'Thread: Workspace';
         } else if (ib.startsWith('comment')) {
             const pieces = ib.split(' ');
             const preview = pieces.length > 1 ? pieces.slice(1).join(' ') : 'Comment Thread';
             this.el.contextTitleEl.textContent = `Thread: "${preview.slice(0, 24)}..."`;
+        } else if (ib.startsWith('file ')) {
+            const file = ib.replace('file ', '');
+            this.el.contextTitleEl.textContent = `Thread: ${file}`;
         } else {
             this.el.contextTitleEl.textContent = `Thread: ${ib.slice(0, 20)}`;
         }
     }
 
     private loadInitialMessages(): void {
-        const addr = this.ibGibAddr ?? ROOT_ADDR;
-        const { ib } = getIbAndGib({ ibGibAddr: addr });
-
-        if (ib.includes('boundary') || ib.includes('try/catch') || ib.includes('boot')) {
-            // Nested replies for the error boundary comment thread
-            this.messages = [
-                {
-                    id: 'submsg-1',
-                    addr: 'comment boundary-rationale^gib_b1',
-                    author: 'Charlie',
-                    avatar: '👩‍🔬',
-                    role: 'Peer',
-                    timestamp: '3m ago',
-                    text: 'Wrapping boot() in a top-level error boundary prevents uncaught rejections from freezing the virtual canvas.',
-                    replyCount: 1,
-                },
-                {
-                    id: 'submsg-2',
-                    addr: 'comment boundary-event^gib_b2',
-                    author: 'Bob',
-                    avatar: '👨‍🚀',
-                    role: 'Peer',
-                    timestamp: '1m ago',
-                    text: 'Agreed! Let us also dispatch an EVENT_IBGIB_UI_MESSAGE so the status bar shows the error banner.',
-                    replyCount: 0,
-                }
-            ];
-        } else if (ib.includes('rationale') || ib.includes('index.ts') || ib.includes('indexeddb')) {
-            // Nested replies for the architectural rationale comment thread
-            this.messages = [
-                {
-                    id: 'submsg-3',
-                    addr: 'comment offline-merkle^gib_a1',
-                    author: 'Bob',
-                    avatar: '👨‍🚀',
-                    role: 'Peer',
-                    timestamp: '5m ago',
-                    text: 'The local IndexedDB space works completely offline without network roundtrips.',
-                    replyCount: 0,
-                },
-                {
-                    id: 'submsg-4',
-                    addr: 'comment sync-keystone^gib_a2',
-                    author: 'Alice',
-                    avatar: '👩‍💻',
-                    role: 'Keystone',
-                    timestamp: '2m ago',
-                    text: 'Exactly! Remote peer hubs synchronize automatically via WebSockets whenever connectivity is detected.',
-                    replyCount: 0,
-                }
-            ];
-        } else {
-            // Default file / root comments
-            this.messages = [
-                {
-                    id: 'msg-1',
-                    addr: 'comment index-arch-rationale^gib_1',
-                    author: 'Alice',
-                    avatar: '👩‍💻',
-                    role: 'Keystone',
-                    timestamp: '10m ago',
-                    anchor: 'src/index.ts#L1-18',
-                    text: 'Architectural Rationale: This entrypoint initializes the virtual repository workspace within the browser’s local IndexedDB metaspace.',
-                    replyCount: 2,
-                },
-                {
-                    id: 'msg-2',
-                    addr: 'comment index-try-catch^gib_2',
-                    author: 'Bob',
-                    avatar: '👨‍🚀',
-                    role: 'Peer',
-                    timestamp: '6m ago',
-                    anchor: 'src/index.ts#L36-42',
-                    text: 'Looks super clean! Should we add an async try/catch boundary around boot() as well?',
-                    replyCount: 2,
-                },
-                {
-                    id: 'msg-3',
-                    addr: 'comment index-agent-analysis^gib_3',
-                    author: 'Agent',
-                    avatar: '🤖',
-                    role: 'Agent',
-                    timestamp: '4m ago',
-                    anchor: 'src/index.ts#L43-50',
-                    text: 'Static analysis confirms that initOrchestration provides a root failure boundary.',
-                    replyCount: 0,
-                }
-            ];
-        }
+        this.messages = [];
     }
 
     private async initEnterBehavior(): Promise<void> {

package/src/client/ui/component/nested-chat/nested-chat.mts

@@ -99,7 +99,7 @@ export class NestedChatComponentInstance
 
     private ensureValidIbGibAddr(addr: string): IbGibAddr {
         if (!addr || addr === ROOT_ADDR) {
-            return 'file src/index.ts^index_tjp';
+            return ROOT_ADDR;
         }
         if (!addr.includes('^')) {
             return `file ${addr}^${addr.replace(/[^a-zA-Z0-9]/g, '_')}_tjp`;
@@ -123,13 +123,15 @@ export class NestedChatComponentInstance
 
             this.bindEvents();
 
-            // Only activate initial thread if an ibGibAddr was explicitly provided to the component
-            if (this.ibGibAddr) {
+            // Only activate initial thread if an ibGibAddr was explicitly provided (not ROOT_ADDR)
+            if (this.ibGibAddr && this.ibGibAddr !== ROOT_ADDR) {
                 const rootAddr = this.ensureValidIbGibAddr(this.ibGibAddr);
-                setTimeout(async () => {
-                    console.log(`${lc} activating initial root thread: ${rootAddr}`);
-                    await this.activateIbGib({ addr: rootAddr });
-                }, 0);
+                if (rootAddr && rootAddr !== ROOT_ADDR) {
+                    setTimeout(async () => {
+                        console.log(`${lc} activating initial root thread: ${rootAddr}`);
+                        await this.activateIbGib({ addr: rootAddr });
+                    }, 0);
+                }
             }
 
         } catch (error) {
@@ -350,7 +352,7 @@ export class NestedChatComponentInstance
 
         const { ib } = getIbAndGib({ ibGibAddr: addr });
         if (addr === ROOT_ADDR || ib === 'root' || ib.includes('file') || !addr.includes('comment')) {
-            const fileTitle = ib.startsWith('file ') ? ib.replace('file ', '') : 'src/index.ts';
+            const fileTitle = ib.startsWith('file ') ? ib.replace('file ', '') : (ib === 'root' || addr === ROOT_ADDR ? 'Workspace' : ib);
             return {
                 shortTitle: this.formatShortTitle(fileTitle),
                 fullText: `Root Thread: ${fileTitle}`,

package/src/client/ui/component/timeline/timeline.css

@@ -2,15 +2,25 @@
   display: flex;
   flex-direction: column;
   width: 100%;
+  height: 100%;
+  min-height: 0;
   box-sizing: border-box;
   margin: 0;
   padding: 0;
 }
 
+:host([collapsed]) {
+  height: auto !important;
+  flex: 0 0 auto !important;
+}
+
 .timeline-root {
   display: flex;
   flex-direction: column;
   width: 100%;
+  height: 100%;
+  min-height: 0;
+  overflow: hidden;
   user-select: none;
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
   box-sizing: border-box;
@@ -23,7 +33,7 @@
   display: flex;
   align-items: center;
   gap: 0.35rem;
-  padding: 0.4rem 0.6rem;
+  padding: 0.28rem 0.5rem;
   background: rgba(255, 255, 255, 0.04);
   border: 1px solid rgba(255, 255, 255, 0.08);
   border-radius: 6px;
@@ -35,6 +45,8 @@
   outline: none;
   box-sizing: border-box;
   margin: 0;
+  flex: 0 0 auto !important;
+  flex-shrink: 0 !important;
 }
 
 .timeline-header:hover {
@@ -135,6 +147,9 @@
 .timeline-stream-container {
   display: flex;
   flex-direction: column;
+  flex: 1 1 0px;
+  min-height: 0;
+  overflow-y: auto;
   position: relative;
   padding: 0.35rem 0.2rem 0.5rem 0.8rem;
   box-sizing: border-box;

package/src/client/ui/component/timeline/timeline.mts

@@ -87,98 +87,8 @@ export class TimelineComponentInstance
 
     private branchName: string = 'main';
     private isTimelineExpanded: boolean = true;
-    private selectedHash: string = '3e8f1c2';
-
-    private snapshots: TimelineItem[] = [
-        {
-            hash: '3e8f1c2a05d8f99e32b4f17c802e3b4a',
-            shortHash: '3e8f1c2',
-            message: 'feat: implement cosmos navigation and orbital drift',
-            author: 'Bill Raiford <bill@ibgib.space>',
-            timestamp: '2m ago',
-            isTip: true,
-            branch: 'main',
-            parentHash: 'a7b4d90',
-            changedFiles: [
-                { path: 'src/client/ui/component/cosmos-navigator/cosmos-navigator.mts', status: 'M', additions: 18, deletions: 4 },
-                { path: 'src/client/ui/shell/space-gib-shell-service.mts', status: 'M', additions: 32, deletions: 6 },
-                { path: 'src/client/css/layout.css', status: 'M', additions: 14, deletions: 2 },
-            ],
-            diffPreview: `@@ -848,6 +848,20 @@
--        this.launchProjectile({ ... });
-+        // Make activity bar visible BEFORE zoom flight starts
-+        window.dispatchEvent(new CustomEvent('space-gib-activity-bar-expand-requested'));
-+        setTimeout(() => {
-+            this.launchProjectile({ ... });
-+        }, 180);`
-        },
-        {
-            hash: 'a7b4d9089f21c4320b9e8471da329188',
-            shortHash: 'a7b4d90',
-            message: 'style: polish firecracker big bang compression',
-            author: 'Bill Raiford <bill@ibgib.space>',
-            timestamp: '1h ago',
-            branch: 'main',
-            parentHash: 'f2098b1',
-            changedFiles: [
-                { path: 'src/client/ui/component/cosmos-navigator/cosmos-navigator.css', status: 'M', additions: 24, deletions: 11 },
-                { path: 'src/client/ui/component/cosmos-navigator/cosmos-navigator.mts', status: 'M', additions: 12, deletions: 5 },
-            ],
-            diffPreview: `@@ -430,8 +430,12 @@
--        btn.classList.add('compressing');
-+        // Firecracker high velocity rotation
-+        btn.classList.add('compressing');
-+        this.triggerBigBangExplosion();`
-        },
-        {
-            hash: 'f2098b191c4998721fae390c91834789',
-            shortHash: 'f2098b1',
-            message: 'refactor: decouple activity bar and cosmos controls',
-            author: 'Bill Raiford <bill@ibgib.space>',
-            timestamp: 'yesterday',
-            branch: 'main',
-            parentHash: 'c019a4e',
-            changedFiles: [
-                { path: 'src/client/ui/shell/cosmic-big-bang.mts', status: 'M', additions: 40, deletions: 52 },
-                { path: 'src/client/ui/shell/space-gib-shell-service.mts', status: 'M', additions: 75, deletions: 18 },
-            ],
-            diffPreview: `@@ -120,7 +120,7 @@
--    public toggleActivityBar(): void {
-+    public expandActivityBar(): void {`
-        },
-        {
-            hash: 'c019a4ee899201bdcf88132582910fa2',
-            shortHash: 'c019a4e',
-            message: 'feat: primordial singularity and big bang stage',
-            author: 'Bill Raiford <bill@ibgib.space>',
-            timestamp: '3d ago',
-            branch: 'main',
-            parentHash: '0000000',
-            changedFiles: [
-                { path: 'src/client/ui/component/cosmos-navigator/cosmos-navigator.mts', status: 'A', additions: 450, deletions: 0 },
-                { path: 'src/client/ui/component/cosmos-navigator/cosmos-navigator.html', status: 'A', additions: 95, deletions: 0 },
-            ],
-            diffPreview: `@@ -0,0 +1,95 @@
-+<div id="cosmos-nav-root" class="cosmos-nav-root">
-+  <canvas id="bg-canvas"></canvas>
-+</div>`
-        },
-        {
-            hash: '00000000000000000000000000000000',
-            shortHash: '0000000',
-            message: 'Initial commit (empty space genesis)',
-            author: 'Bill Raiford <bill@ibgib.space>',
-            timestamp: '5d ago',
-            branch: 'main',
-            changedFiles: [
-                { path: 'package.json', status: 'A', additions: 35, deletions: 0 },
-                { path: 'README.md', status: 'A', additions: 20, deletions: 0 },
-            ],
-            diffPreview: `@@ -0,0 +1,20 @@
-+# space-gib
-+Decentralized VCS and superspaces.`
-        }
-    ];
+    private selectedHash: string = '';
+    private snapshots: TimelineItem[] = [];
 
     get el(): TimelineElements {
         if (!this.elements) {
@@ -203,6 +113,7 @@ export class TimelineComponentInstance
                 contentEl: shadow.getElementById('timeline-root') as HTMLDivElement,
             };
 
+            this.toggleAttribute('collapsed', !this.isTimelineExpanded);
             this.bindHandlers();
             this.renderSnapshots();
         } catch (error) {
@@ -238,6 +149,15 @@ export class TimelineComponentInstance
         if (!container) { return; }
         container.innerHTML = '';
 
+        if (this.snapshots.length === 0) {
+            container.innerHTML = `
+                <div class="empty-timeline-msg" style="padding: 16px 12px; font-size: 11px; color: #8a99a8; font-style: italic; text-align: center;">
+                    No commits on branch [${this.branchName}] yet.
+                </div>
+            `;
+            return;
+        }
+
         for (const item of this.snapshots) {
             const row = document.createElement('div');
             row.className = `timeline-item ${item.shortHash === this.selectedHash ? 'selected' : ''} ${item.isTip ? 'is-tip' : ''}`;
@@ -268,6 +188,11 @@ export class TimelineComponentInstance
         }
     }
 
+    public setSnapshots(snapshots: TimelineItem[]): void {
+        this.snapshots = snapshots || [];
+        this.renderSnapshots();
+    }
+
     public selectTimelineItem(hash: string): void {
         this.selectedHash = hash;
         const shadow = this.shadowRoot;
@@ -288,8 +213,23 @@ export class TimelineComponentInstance
         }
     }
 
+    public addSnapshot(snapshot: TimelineItem): void {
+        for (const s of this.snapshots) {
+            s.isTip = false;
+        }
+        snapshot.isTip = true;
+        this.snapshots.unshift(snapshot);
+        this.renderSnapshots();
+    }
+
+    public clearSnapshots(): void {
+        this.snapshots = [];
+        this.renderSnapshots();
+    }
+
     public toggleTimelineAccordion(): void {
         this.isTimelineExpanded = !this.isTimelineExpanded;
+        this.toggleAttribute('collapsed', !this.isTimelineExpanded);
         const chevron = this.el.timelineHeaderEl.querySelector('.chevron-icon');
 
         if (this.isTimelineExpanded) {
@@ -301,9 +241,13 @@ export class TimelineComponentInstance
             this.el.timelineHeaderEl.classList.remove('expanded');
             this.el.timelineHeaderEl.classList.add('collapsed');
             this.el.timelineStreamContainerEl.classList.add('hidden');
-            // if (chevron) chevron.textContent = '▶';
             if (chevron) { chevron.textContent = '▼'; }
         }
+        this.dispatchEvent(new CustomEvent('space-gib-accordion-toggled', {
+            detail: { isExpanded: this.isTimelineExpanded },
+            bubbles: true,
+            composed: true,
+        }));
     }
 
     override async disconnected(): Promise<void> {

package/src/client/ui/component/tutorial/index.mts

@@ -0,0 +1,9 @@
+/**
+ * @module tutorial
+ *
+ * Space-Gib Tutorial Runner & Interactive Spotlight Tour framework.
+ */
+
+export * from './tutorial-types.mjs';
+export * from './tutorial-controller.mjs';
+export * from './scripts/pitch-tour-script.mjs';

package/src/client/ui/component/tutorial/scripts/pitch-tour-script.mts

@@ -0,0 +1,265 @@
+/**
+ * @module pitch-tour-script
+ *
+ * The Founder Pitch Tour script for Space-Gib.
+ * Walks through the full ibgib cosmology contrasting each layer against the legacy
+ * Git/GitHub/GitLab stack, with automated in-between mouse click animations,
+ * culminating in a transparent founder investment thesis.
+ */
+
+import { TutorialScript } from '../tutorial-types.mjs';
+import { findElementDeep } from '../tutorial-controller.mjs';
+
+export const PITCH_TOUR_SCRIPT_ID = 'space-gib-founder-pitch-tour';
+
+export const PITCH_TOUR_SCRIPT: TutorialScript = {
+    id: PITCH_TOUR_SCRIPT_ID,
+    title: 'The Post-Git Frontier: Founder Pitch Tour',
+    steps: [
+        // =====================================================================
+        // STEP 1: Introduction & The Post-Git Thesis
+        // =====================================================================
+        {
+            id: 'step-1-thesis',
+            title: 'The Post-Git Frontier: Unlocking Autonomous AI Agents',
+            narration: `
+                <p>The fundamental bottleneck for AI software engineering is <strong>not</strong> the models—it is <strong>Git</strong>.</p>
+                <p>Modern agent harnesses, coding assistants, and CI/CD pipelines are chained to a 2005 architecture designed for human developers emailing diff patches. When autonomous agents code concurrently, the Git stack collapses:</p>
+                <ul>
+                    <li><strong>Git & Worktrees:</strong> Fragile locks, merge conflicts that stop the world, detached HEADs.</li>
+                    <li><strong>Package Managers (npm, PyPI):</strong> External out-of-band registries vulnerable to supply chain hijacking.</li>
+                    <li><strong>Asset Managers (Git LFS):</strong> Fragile pointer files pointing to separate, proprietary blob servers.</li>
+                    <li><strong>External Comms (GitHub Issues, Slack, Discord):</strong> Trapped in centralized corporate silos separated from code history.</li>
+                </ul>
+                <p><strong>The Solution: A Unified Merkle Cosmology.</strong> Let us begin with the birth of our workspace.</p>
+                <p><em>Click [Ignite the Big Bang ➔] to witness the workspace creation.</em></p>
+            `,
+            targetElementId: undefined, // center placement
+            placement: 'center',
+            beaconLabel: 'Begin Pitch ✨',
+            buttonText: 'Ignite the Big Bang ➔',
+            action: async (ctx) => {
+                await ctx.shell?.showCosmos?.();
+            },
+            transitionAction: async (ctx, controller) => {
+                // Ensure Cosmos is showing
+                await ctx.shell?.showCosmos?.();
+                const cosmosNav = ctx.shell?.getCosmosNavigator?.();
+                const singularityBtn = findElementDeep('btn-singularity');
+
+                if (singularityBtn && (!cosmosNav || !cosmosNav.hasBigBangExploded)) {
+                    // Glide virtual mouse to the Singularity button and click it
+                    await controller.animateMouseClick(singularityBtn, { durationMs: 800 });
+
+                    // Trigger the physical Big Bang sequence
+                    await new Promise<void>((resolve) => {
+                        if (cosmosNav?.triggerBigBangSequence) {
+                            cosmosNav.triggerBigBangSequence(() => {
+                                resolve();
+                            });
+                        } else {
+                            singularityBtn.click();
+                            setTimeout(resolve, 1400);
+                        }
+                    });
+                    // Allow the Cosmos stage and revolving satellites to blossom
+                    await new Promise((r) => setTimeout(r, 650));
+                } else {
+                    // Already exploded, ensure Cosmos stage is visible
+                    await ctx.shell?.showCosmos?.();
+                    await new Promise((r) => setTimeout(r, 400));
+                }
+            },
+        },
+
+        // =====================================================================
+        // STEP 2: The Cosmos (Root Container)
+        // =====================================================================
+        {
+            id: 'step-2-cosmos-container',
+            title: '1. The Cosmos: Supercharged Monorepo Container',
+            narration: `
+                <p>Welcome to the <strong>Cosmos</strong>—the root container that replaces multi-repo sprawl and fractured monorepo tooling.</p>
+                <p>In traditional setups, coordinating multiple repositories, Git submodules, or Lerna/Turborepo workspaces requires fragile symlinks, separate CI configs, and constant sync friction.</p>
+                <p>In <code>ibgib</code>, a <strong>Cosmos</strong> is a unified, sovereign Merkle coordinate space. It hosts interconnected <strong>Galaxies</strong>—each with discrete cryptographic boundaries, bound together by inverted soft links.</p>
+                <p>Watch as we spawn our primary workspace: a <strong>Code Galaxy</strong>.</p>
+            `,
+            targetElementId: 'node-superspace-wrapper',
+            placement: 'bottom',
+            beaconLabel: 'Code Galaxy 🚀',
+            buttonText: 'Birth Code Galaxy ➔',
+            action: async (ctx) => {
+                await ctx.shell?.showCosmos?.();
+            },
+            transitionAction: async (ctx, controller) => {
+                const btnSatCode = findElementDeep('btn-sat-code');
+                const cosmosNav = ctx.shell?.getCosmosNavigator?.();
+
+                if (btnSatCode) {
+                    // Move virtual mouse cursor to the revolving Code Galaxy satellite
+                    await controller.animateMouseClick(btnSatCode, { durationMs: 800 });
+                }
+
+                // Trigger programmatic launch of the Code Galaxy projectile
+                if (cosmosNav?.launchCodeGalaxyProgrammatic) {
+                    await cosmosNav.launchCodeGalaxyProgrammatic('code-1');
+                    // Wait for the projectile to fly across the screen, dock into the activity bar, and expand panels
+                    await new Promise((r) => setTimeout(r, 1800));
+                } else {
+                    ctx.shell?.expandActivityBar?.();
+                    ctx.shell?.expandLeftPanel?.();
+                    ctx.shell?.showLeftPanelView?.('code', 'code-1');
+                    await new Promise((r) => setTimeout(r, 600));
+                }
+            },
+        },
+
+        // =====================================================================
+        // STEP 3: Class I: Code Galaxy (The Git Replacement)
+        // =====================================================================
+        {
+            id: 'step-3-code-galaxy',
+            title: '2. Code Galaxy: Accretive Merkle Branches & Zero Push Rejections',
+            narration: `
+                <p>The <strong>Code Galaxy</strong> is our native replacement for a Git repository.</p>
+                <p>Notice the File Explorer on the left. In <code>ibgib</code>, every file, folder, and branch is an immutable, content-addressed Merkle node.</p>
+                <p><strong>Why this defeats Git for AI Agents:</strong></p>
+                <ul>
+                    <li><strong>Accretive 3-Way Graft Merging:</strong> In Git, concurrent agent pushes fail with non-fast-forward push rejections. In <code>ibgib</code>, concurrent agent commits graft accretively without blocking repository state.</li>
+                    <li><strong>No Detached HEADs:</strong> Timelines are monotonic and cryptographically sovereign.</li>
+                    <li><strong>Instant Worktrees:</strong> Multiple agents can branch and execute simultaneously in-memory without cloning gigabytes of files to disk.</li>
+                </ul>
+            `,
+            targetElementId: 'code-file-explorer-container',
+            placement: 'right',
+            beaconLabel: 'Code Substrate 📁',
+            buttonText: 'Inspect In-Band Discourse ➔',
+            action: async (ctx) => {
+                ctx.shell?.expandLeftPanel?.();
+                ctx.shell?.showLeftPanelView?.('code', ctx.galaxyName || 'code-1');
+            },
+            transitionAction: async (ctx, controller) => {
+                // Select a file in the explorer and open editor & right companion panel
+                const files = ['README.md', 'app.ts', 'index.ts'];
+                for (const f of files) {
+                    try {
+                        ctx.shell?.fileExplorerInstance?.selectFile?.(f);
+                        break;
+                    } catch { /* continue */ }
+                }
+                await ctx.shell?.showCode?.();
+                ctx.shell?.expandRightPanel?.();
+                await new Promise((r) => setTimeout(r, 650));
+            },
+        },
+
+        // =====================================================================
+        // STEP 4: Class IV: Metatext Galaxy (In-Band Discourse)
+        // =====================================================================
+        {
+            id: 'step-4-metatext-galaxy',
+            title: '3. Metatext Galaxy: In-Band Discourse & Reviews (.ib.*.md)',
+            narration: `
+                <p>Look at the right panel. In legacy software engineering, code lives in Git, but discussions, PR reviews, bug reports, and agent rationale are locked in proprietary third-party silos: <strong>GitHub Issues, Jira, Slack, or Discord</strong>.</p>
+                <p>When an AI agent writes code, its reasoning and discussion are lost from the repository's cryptographic history.</p>
+                <p>In <code>ibgib</code>, <strong>Metatext Galaxies</strong> embed discussions, companion reviews, and prompt rationale <strong>in-band in the exact same Merkle DAG</strong> using companion files (<code>.ib.*.md</code>).</p>
+                <p>Code and rationale evolve together. You own your code <em>and</em> the conversation that created it.</p>
+            `,
+            targetElementId: 'right-panel',
+            placement: 'left',
+            beaconLabel: 'In-Band State 💬',
+            buttonText: 'Explore Package Galaxy ➔',
+            action: async (ctx) => {
+                ctx.shell?.expandRightPanel?.();
+            },
+            transitionAction: async (ctx, controller) => {
+                ctx.shell?.collapseRightPanel?.();
+                ctx.shell?.expandLeftPanel?.();
+                await new Promise((r) => setTimeout(r, 500));
+            },
+        },
+
+        // =====================================================================
+        // STEP 5: Class II: Package Galaxy (Monotonic Releases)
+        // =====================================================================
+        {
+            id: 'step-5-package-galaxy',
+            title: '4. Package Galaxy: Monotonic Append-Only Releases',
+            narration: `
+                <p>Modern software supply chains rely on centralized registries (<strong>npm, PyPI, Cargo, Crates</strong>) that are vulnerable to token theft, registry outages, and malicious typosquatting.</p>
+                <p>A <strong>Package Galaxy</strong> provides monotonic, append-only cryptographic release checkpoints (<code>v1.0.0</code>, <code>v1.0.1</code>).</p>
+                <p>Each release is an immutable Merkle root signed by the creator's cryptographic Keystone identity.</p>
+                <p>Downstream consumers verify and pull the exact dependency graph directly from sovereign spaces—with zero middlemen, zero spoofing, and zero central points of failure.</p>
+            `,
+            targetElementId: 'code-changes-container',
+            placement: 'right',
+            beaconLabel: 'Package Integrity 📦',
+            buttonText: 'Explore Asset Galaxy ➔',
+            action: async (ctx) => {
+                ctx.shell?.expandLeftPanel?.();
+            },
+            transitionAction: async (ctx, controller) => {
+                const btnClone = findElementDeep('btn-header-clone');
+                if (btnClone) {
+                    await controller.animateMouseClick(btnClone, { durationMs: 700 });
+                }
+                await new Promise((r) => setTimeout(r, 450));
+            },
+        },
+
+        // =====================================================================
+        // STEP 6: Asset Galaxy (Binary Content vs Git LFS)
+        // =====================================================================
+        {
+            id: 'step-6-asset-galaxy',
+            title: '5. Asset Galaxy: Content-Addressed Binary Sovereignty',
+            narration: `
+                <p>Git was never built for binary files. <strong>Git LFS</strong> is a fragile hack: text pointers in Git that point to separate cloud servers. If the LFS server goes down or credentials expire, builds fail completely.</p>
+                <p>In <code>ibgib</code>, <strong>Asset Galaxies</strong> treat large binaries, AI weights, model tensors, datasets, and media as first-class, content-addressed Merkle stones.</p>
+                <p>Deduplication is cryptographic and native.</p>
+                <p>And with <strong>Zero Platform Lock-In</strong>, clicking <strong>Clone</strong> allows you to export raw files, zip archives, or Git repositories directly to disk at any time.</p>
+            `,
+            targetElementId: 'btn-header-clone',
+            placement: 'bottom',
+            beaconLabel: 'Zero Lock-In ⤓',
+            buttonText: 'The Founder Ask ➔',
+            action: async (ctx) => {
+                ctx.shell?.expandLeftPanel?.();
+            },
+            transitionAction: async (ctx, controller) => {
+                await controller.animateMouseClick(
+                    { x: window.innerWidth / 2, y: window.innerHeight / 2 },
+                    { durationMs: 600 }
+                );
+                await new Promise((r) => setTimeout(r, 350));
+            },
+        },
+
+        // =====================================================================
+        // STEP 7: The Founder Ask & Investment Realities
+        // =====================================================================
+        {
+            id: 'step-7-founder-ask',
+            title: 'The Ask: Fueling the Solo Founder Behind the Protocol',
+            narration: `
+                <p>Currently, the live monorepo source code is not served directly through this web client because we are in the process of finalizing the MVP CLI sync pipeline.</p>
+                <p><strong>The Reality:</strong> I am building this entire protocol as a solo founder, currently coding at <strong>50% capacity</strong> due to everyday survival stresses and single-income family debt—competing against well-funded teams with $100Ks or $1Ms in venture investment.</p>
+                <p>A modest seed investment ($50k–$150k) takes me to <strong>100% full-time capacity</strong> to deliver the post-git infrastructure the agentic era urgently demands.</p>
+                <p><strong>Founder Expectations & Terms:</strong></p>
+                <ul>
+                    <li><strong>Talk is cheap:</strong> I have no budget for travel and cannot afford a laptop capable of running Zoom reliably. If an investor wants in-person meetings or video calls, please fund the travel or hardware.</li>
+                    <li><strong>Open-Source Core:</strong> The core protocol <em>must remain open-source</em> (dogfooded in its own decentralized repository).</li>
+                    <li><strong>The Commercial Moat:</strong> The immense business upside lies in the hosted platform, the agentic supply chain infrastructure, and the downstream multi-app cosmology (educational LMS suites, knowledge graphs, and enterprise sync).</li>
+                </ul>
+                <p><em>If you believe that AI agents will do 90% of coding going forward, invest now in the protocol built from the ground up for that future.</em></p>
+                <p style="margin-top:16px; padding:12px; background:rgba(255,215,0,0.1); border-radius:8px; border:1px solid rgba(255,215,0,0.35); text-align:center;">
+                    <strong>Direct Founder Contact:</strong> <a href="mailto:bill@ibgib.space" style="color:#ffd700; text-decoration:underline; font-weight:700;">bill@ibgib.space</a>
+                </p>
+            `,
+            targetElementId: undefined, // center placement
+            placement: 'center',
+            beaconLabel: 'Invest in ibgib 💰',
+            buttonText: 'Complete Tour ✨',
+        },
+    ],
+};