diff --git a/pkg/miniapp/frontend/build.mjs b/pkg/miniapp/frontend/build.mjs
index 943851551..3093decda 100644
--- a/pkg/miniapp/frontend/build.mjs
+++ b/pkg/miniapp/frontend/build.mjs
@@ -10,12 +10,15 @@ await rm(outDir, { recursive: true, force: true });
 await mkdir(outDir, { recursive: true });
 
 const result = await Bun.build({
-  entrypoints: [path.join(srcDir, 'app.js')],
+  entrypoints: [path.join(srcDir, 'index.tsx')],
   outdir: outDir,
   target: 'browser',
   format: 'iife',
   sourcemap: 'none',
   packages: 'bundle',
+  naming: {
+    entry: 'app.[ext]',
+  },
 });
 
 if (!result.success) {
diff --git a/pkg/miniapp/frontend/bun.lock b/pkg/miniapp/frontend/bun.lock
index b8130a079..cc3c31024 100644
--- a/pkg/miniapp/frontend/bun.lock
+++ b/pkg/miniapp/frontend/bun.lock
@@ -7,6 +7,7 @@
       "dependencies": {
         "highlight.js": "^11.11.1",
         "marked": "^17.0.4",
+        "preact": "^10.25.0",
       },
       "devDependencies": {
         "happy-dom": "^16.8.1",
@@ -173,6 +174,8 @@
 
     "postcss": ["postcss@8.5.8", "", { "dependencies": { "nanoid": "3.3.11", "picocolors": "1.1.1", "source-map-js": "1.2.1" } }, "sha512-OW/rX8O/jXnm82Ey1k44pObPtdblfiuWnrd8X7GJ7emImCOstunGbXUpp7HdBrFQX6rJzn3sPT397Wp5aCwCHg=="],
 
+    "preact": ["preact@10.29.0", "", {}, "sha512-wSAGyk2bYR1c7t3SZ3jHcM6xy0lcBcDel6lODcs9ME6Th++Dx2KU+6D3HD8wMMKGA8Wpw7OMd3/4RGzYRpzwRg=="],
+
     "rollup": ["rollup@4.59.0", "", { "dependencies": { "@types/estree": "1.0.8" }, "optionalDependencies": { "@rollup/rollup-android-arm-eabi": "4.59.0", "@rollup/rollup-android-arm64": "4.59.0", "@rollup/rollup-darwin-arm64": "4.59.0", "@rollup/rollup-darwin-x64": "4.59.0", "@rollup/rollup-freebsd-arm64": "4.59.0", "@rollup/rollup-freebsd-x64": "4.59.0", "@rollup/rollup-linux-arm-gnueabihf": "4.59.0", "@rollup/rollup-linux-arm-musleabihf": "4.59.0", "@rollup/rollup-linux-arm64-gnu": "4.59.0", "@rollup/rollup-linux-arm64-musl": "4.59.0", "@rollup/rollup-linux-loong64-gnu": "4.59.0", "@rollup/rollup-linux-loong64-musl": "4.59.0", "@rollup/rollup-linux-ppc64-gnu": "4.59.0", "@rollup/rollup-linux-ppc64-musl": "4.59.0", "@rollup/rollup-linux-riscv64-gnu": "4.59.0", "@rollup/rollup-linux-riscv64-musl": "4.59.0", "@rollup/rollup-linux-s390x-gnu": "4.59.0", "@rollup/rollup-linux-x64-gnu": "4.59.0", "@rollup/rollup-linux-x64-musl": "4.59.0", "@rollup/rollup-openbsd-x64": "4.59.0", "@rollup/rollup-openharmony-arm64": "4.59.0", "@rollup/rollup-win32-arm64-msvc": "4.59.0", "@rollup/rollup-win32-ia32-msvc": "4.59.0", "@rollup/rollup-win32-x64-gnu": "4.59.0", "@rollup/rollup-win32-x64-msvc": "4.59.0", "fsevents": "2.3.3" }, "bin": { "rollup": "dist/bin/rollup" } }, "sha512-2oMpl67a3zCH9H79LeMcbDhXW/UmWG/y2zuqnF2jQq5uq9TbM9TVyXvA4+t+ne2IIkBdrLpAaRQAvo7YI/Yyeg=="],
 
     "siginfo": ["siginfo@2.0.0", "", {}, "sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g=="],
diff --git a/pkg/miniapp/frontend/package.json b/pkg/miniapp/frontend/package.json
index 4a6497882..e56d3af10 100644
--- a/pkg/miniapp/frontend/package.json
+++ b/pkg/miniapp/frontend/package.json
@@ -12,6 +12,7 @@
   },
   "dependencies": {
     "highlight.js": "^11.11.1",
-    "marked": "^17.0.4"
+    "marked": "^17.0.4",
+    "preact": "^10.25.0"
   }
 }
diff --git a/pkg/miniapp/frontend/src/app.tsx b/pkg/miniapp/frontend/src/app.tsx
new file mode 100644
index 000000000..0837a7e21
--- /dev/null
+++ b/pkg/miniapp/frontend/src/app.tsx
@@ -0,0 +1,60 @@
+import { useEffect, useState, useCallback, useRef } from 'preact/hooks';
+import { useSSE } from './hooks/use-sse';
+import { PlanTab } from './components/plan/plan-tab';
+import { WorkTab } from './components/work/work-tab';
+import { ToolsTab } from './components/tools/tools-tab';
+import { DevTab } from './components/dev/dev-tab';
+
+const TABS = [
+  { id: 'plan', label: 'Plan' },
+  { id: 'work', label: 'Work' },
+  { id: 'tools', label: 'Tools' },
+  { id: 'dev', label: 'Dev' },
+] as const;
+
+type TabId = (typeof TABS)[number]['id'];
+
+export function App() {
+  const [activeTab, setActiveTab] = useState<TabId>('plan');
+  const indicatorRef = useRef<HTMLDivElement>(null);
+  const sse = useSSE();
+
+  const switchTab = useCallback((id: TabId, index: number) => {
+    setActiveTab(id);
+    if (indicatorRef.current) {
+      indicatorRef.current.style.transform = `translateX(${index * 100}%)`;
+    }
+  }, []);
+
+  return (
+    <>
+      <div class="tabs">
+        <div class="tabs-inner">
+          <div class="tab-indicator" ref={indicatorRef} />
+          {TABS.map((tab, i) => (
+            <button
+              key={tab.id}
+              class={`tab${activeTab === tab.id ? ' active' : ''}`}
+              onClick={() => switchTab(tab.id, i)}
+            >
+              {tab.label}
+            </button>
+          ))}
+        </div>
+      </div>
+
+      <div class={`panel${activeTab === 'plan' ? ' active' : ''}`}>
+        <PlanTab active={activeTab === 'plan'} sse={sse} />
+      </div>
+      <div class={`panel${activeTab === 'work' ? ' active' : ''}`}>
+        <WorkTab active={activeTab === 'work'} sse={sse} />
+      </div>
+      <div class={`panel${activeTab === 'tools' ? ' active' : ''}`}>
+        <ToolsTab active={activeTab === 'tools'} sse={sse} />
+      </div>
+      <div class={`panel${activeTab === 'dev' ? ' active' : ''}`}>
+        <DevTab active={activeTab === 'dev'} sse={sse} />
+      </div>
+    </>
+  );
+}
diff --git a/pkg/miniapp/frontend/src/components/dev/dev-tab.tsx b/pkg/miniapp/frontend/src/components/dev/dev-tab.tsx
new file mode 100644
index 000000000..45da307f5
--- /dev/null
+++ b/pkg/miniapp/frontend/src/components/dev/dev-tab.tsx
@@ -0,0 +1,121 @@
+import { useEffect, useState, useCallback } from 'preact/hooks';
+import type { SSEHook } from '../../hooks/use-sse';
+import { apiFetch, apiPost } from '../../hooks/use-api';
+import { isFresh } from '../../utils';
+
+interface DevTabProps {
+  active: boolean;
+  sse: SSEHook;
+}
+
+export function DevTab({ active, sse }: DevTabProps) {
+  const [data, setData] = useState<any>(null);
+
+  const loadDev = useCallback(async () => {
+    try {
+      const d = await apiFetch('/miniapp/api/dev');
+      setData(d);
+    } catch {}
+  }, []);
+
+  useEffect(() => {
+    if (sse.dev) setData(sse.dev);
+  }, [sse.dev]);
+
+  useEffect(() => {
+    if (active && !isFresh(sse.lastUpdate, 'dev')) loadDev();
+  }, [active]);
+
+  const targets = data?.targets || [];
+  const activeId = data?.active_id || '';
+  const isActive = !!data?.active;
+
+  const handleToggle = async (id: string) => {
+    const action = id === activeId ? 'deactivate' : 'activate';
+    const body =
+      action === 'activate'
+        ? { action: 'activate', id }
+        : { action: 'deactivate' };
+    try {
+      const d = await apiPost('/miniapp/api/dev', body);
+      if (!d.error) setData(d);
+    } catch {}
+  };
+
+  const handleDelete = async (id: string, name: string) => {
+    if (!confirm('Remove "' + name + '"?')) return;
+    try {
+      const d = await apiPost('/miniapp/api/dev', {
+        action: 'unregister',
+        id,
+      });
+      if (!d.error) setData(d);
+    } catch {}
+  };
+
+  const iframeSrc = isActive ? location.origin + '/miniapp/dev/' : '';
+  const targetDisplay = data?.target
+    ? data.target.replace(/^https?:\/\//, '')
+    : '';
+
+  return (
+    <>
+      <div class="dev-header">
+        <span class={`dev-target-dot${isActive ? ' on' : ''}`} />
+        <span class="dev-header-title">Dev Preview</span>
+        <span class="dev-header-target">{targetDisplay}</span>
+      </div>
+
+      {targets.length === 0 ? (
+        <div class="empty-state">
+          No targets registered.
+          <br />
+          Ask the agent to start a dev server.
+        </div>
+      ) : (
+        targets.map((t: any) => {
+          const isTargetActive = t.id === activeId;
+          const displayUrl = t.target.replace(/^https?:\/\//, '');
+          return (
+            <div
+              key={t.id}
+              class={`dev-target-item glass glass-interactive${isTargetActive ? ' active' : ''}`}
+              onClick={() => handleToggle(t.id)}
+            >
+              <span
+                class={`dev-target-dot${isTargetActive ? ' on' : ''}`}
+              />
+              <span class="dev-target-name">{t.name}</span>
+              <span class="dev-target-url">{displayUrl}</span>
+              <span
+                class="dev-target-delete"
+                onClick={(e) => {
+                  e.stopPropagation();
+                  handleDelete(t.id, t.name);
+                }}
+              >
+                {'\u00D7'}
+              </span>
+            </div>
+          );
+        })
+      )}
+
+      {isActive && (
+        <div style={{ marginTop: '8px' }}>
+          <div class="card glass" style={{ padding: 0, overflow: 'hidden' }}>
+            <iframe
+              src={iframeSrc}
+              style={{
+                width: '100%',
+                height: '70vh',
+                border: 'none',
+                borderRadius: '16px',
+              }}
+            />
+          </div>
+        </div>
+      )}
+    </>
+  );
+}
diff --git a/pkg/miniapp/frontend/src/components/plan/orch-canvas.tsx b/pkg/miniapp/frontend/src/components/plan/orch-canvas.tsx
new file mode 100644
index 000000000..d2742db63
--- /dev/null
+++ b/pkg/miniapp/frontend/src/components/plan/orch-canvas.tsx
@@ -0,0 +1,513 @@
+import { useEffect, useRef } from 'preact/hooks';
+
+// Orch canvas character system - ported from vanilla JS
+// All character/animation state is kept in module-level vars (same as original)
+
+const BOB = [0, -1, -2, -1];
+const FRAME_MS: Record<string, number> = {
+  idle: 450,
+  waiting: 650,
+  toolcall: 90,
+  talking: 280,
+  entering: 220,
+  exiting: 220,
+};
+const WALK = 55;
+
+interface Char {
+  id: string;
+  emoji: string;
+  x: number;
+  y: number;
+  home: { x: number; y: number };
+  target: { x: number; y: number } | null;
+  state: string;
+  frame: number;
+  frameTimer: number;
+  bubble: { text: string; ttl: number } | null;
+  alive: boolean;
+  _onArrive: (() => void) | null;
+  statusText?: string | null;
+  facing?: number;
+  flipTimer?: number;
+}
+
+let conductor: Char;
+let secretary: Char;
+let heartbeat: Char;
+let subagents: Char[];
+let slots: Record<string, Char> = {};
+let freeSlots: Char[] = [];
+let inited = false;
+let orchWs: WebSocket | null = null;
+let orchReconnectTimer: any = null;
+let lastTs: number | null = null;
+
+function makeChar(
+  id: string,
+  emoji: string,
+  home: { x: number; y: number },
+): Char {
+  return {
+    id,
+    emoji,
+    x: home.x,
+    y: home.y,
+    home,
+    target: null,
+    state: 'idle',
+    frame: 0,
+    frameTimer: 0,
+    bubble: null,
+    alive: false,
+    _onArrive: null,
+  };
+}
+
+function initChars() {
+  const MAP = window.MAP_POSITIONS;
+  conductor = makeChar('conductor', '\u{1F451}', MAP.conductor);
+  secretary = makeChar('secretary', '\u{1F469}\u{200D}\u{1F4BC}', MAP.secretary);
+  heartbeat = makeChar('heartbeat', '\u{1F54A}\uFE0F', MAP.heartbeat || { x: 230, y: 58 });
+  conductor.alive = true;
+  secretary.alive = false;
+  heartbeat.alive = true;
+  conductor.statusText = null;
+  heartbeat.facing = 1;
+  heartbeat.flipTimer = 0;
+
+  const ps = [
+    { id: 's0', emoji: '\u{1F50D}' },
+    { id: 's1', emoji: '\u{1F4CA}' },
+    { id: 's2', emoji: '\u{1F4BB}' },
+    { id: 's3', emoji: '\u{1F527}' },
+    { id: 's4', emoji: '\u{1F3AF}' },
+  ];
+  subagents = ps.map((p, i) => {
+    const c = makeChar(p.id, p.emoji, MAP.stations[i]);
+    c.x = MAP.door.x;
+    c.y = MAP.door.y;
+    return c;
+  });
+  slots = {};
+  freeSlots = subagents.slice();
+}
+
+function allChars(): Char[] {
+  return [conductor, secretary, heartbeat, ...subagents];
+}
+
+function syncBadge(id: string, state: string, alive: boolean) {
+  const el = document.getElementById('orch-badge-' + id);
+  if (!el) return;
+  el.className =
+    'orch-badge' +
+    (alive ? ' alive' : '') +
+    (state === 'talking' ? ' talking' : '') +
+    (state === 'toolcall' ? ' toolcall' : '') +
+    (state === 'waiting' ? ' waiting' : '');
+}
+
+function setState(c: Char, state: string) {
+  c.state = state;
+  syncBadge(c.id, state, c.alive);
+  if (c === conductor) {
+    if (state === 'waiting') c.statusText = '\u{1F914}';
+    else if (state === 'toolcall') c.statusText = '\u2328';
+    else if (state === 'user_waiting') c.statusText = '\u23F3';
+    else if (state === 'plan_interviewing') c.statusText = '\u{1F4CB}';
+    else if (state === 'plan_review') c.statusText = '\u{1F50D}';
+    else if (state === 'plan_executing') c.statusText = '\u25B6\uFE0F';
+    else if (state === 'plan_completed') c.statusText = '\u2705';
+    else c.statusText = null;
+
+    const inPlan = state.indexOf('plan_') === 0;
+    if (secretary.alive !== inPlan) {
+      secretary.alive = inPlan;
+      syncBadge('secretary', secretary.state, secretary.alive);
+    }
+  }
+}
+
+function moveTo(c: Char, pos: { x: number; y: number }, cb?: () => void) {
+  c.target = pos;
+  c._onArrive = cb || null;
+}
+
+function say(c: Char, text: string, ttl = 2200) {
+  c.bubble = { text, ttl };
+}
+
+function charForId(id: string): Char {
+  if (id === 'heartbeat') return heartbeat;
+  if (slots[id]) return slots[id];
+  return conductor;
+}
+
+function spawn(id: string) {
+  if (/^subagent-/.test(id)) {
+    const c = freeSlots.shift();
+    if (!c) return;
+    slots[id] = c;
+    c.alive = true;
+    c.x = window.MAP_POSITIONS.door.x;
+    c.y = window.MAP_POSITIONS.door.y;
+    setState(c, 'entering');
+    moveTo(c, c.home, () => setState(c, 'idle'));
+  } else {
+    const ch = charForId(id);
+    ch.alive = true;
+    setState(ch, 'waiting');
+  }
+}
+
+function gc(id: string) {
+  if (/^subagent-/.test(id)) {
+    const c = slots[id];
+    if (!c) return;
+    delete slots[id];
+    freeSlots.push(c);
+    setState(c, 'exiting');
+    moveTo(c, window.MAP_POSITIONS.door, () => {
+      c.alive = false;
+      setState(c, 'idle');
+    });
+  } else {
+    const ch = charForId(id);
+    if (ch === heartbeat) {
+      setState(ch, 'idle');
+    } else if (ch === conductor) {
+      setState(ch, 'user_waiting');
+    } else {
+      ch.alive = false;
+      setState(ch, 'idle');
+    }
+  }
+}
+
+function converse(fromId: string, toId: string, text: string) {
+  const from = charForId(fromId);
+  const to = charForId(toId);
+  if (!from || !to || from === to) return;
+  const label = (text || '').slice(0, 18);
+  const mid = { x: (from.x + to.x) / 2, y: (from.y + to.y) / 2 };
+  setState(from, 'talking');
+  setState(to, 'talking');
+  moveTo(from, { x: mid.x - 18, y: mid.y }, () => say(from, label, 2400));
+  moveTo(to, { x: mid.x + 18, y: mid.y }, () => {
+    setTimeout(() => {
+      moveTo(from, from.home, () => setState(from, 'idle'));
+      moveTo(to, to.home, () => setState(to, 'idle'));
+    }, 2600);
+  });
+}
+
+function update(dt: number) {
+  allChars().forEach((c) => {
+    if (!c.alive && c.state !== 'entering') return;
+    if (c === heartbeat) {
+      if (c.state === 'idle') {
+        c.frame = 0;
+      } else {
+        c.frameTimer += dt;
+        const pDur = c.state === 'toolcall' ? 130 : 380;
+        if (c.frameTimer >= pDur) {
+          c.frame = (c.frame + 1) % 4;
+          c.frameTimer -= pDur;
+        }
+      }
+    } else {
+      c.frameTimer += dt;
+      const dur = FRAME_MS[c.state] || 450;
+      if (c.frameTimer >= dur) {
+        c.frame = (c.frame + 1) % 4;
+        c.frameTimer -= dur;
+      }
+    }
+    if (c.target) {
+      const dx = c.target.x - c.x;
+      const dy = c.target.y - c.y;
+      const dist = Math.sqrt(dx * dx + dy * dy);
+      if (dist > 1.5) {
+        const spd = (WALK * dt) / 1000;
+        c.x += (dx / dist) * spd;
+        c.y += (dy / dist) * spd;
+      } else {
+        c.x = c.target.x;
+        c.y = c.target.y;
+        c.target = null;
+        if (c._onArrive) {
+          c._onArrive();
+          c._onArrive = null;
+        }
+      }
+    }
+    if (c.bubble) {
+      c.bubble.ttl -= dt;
+      if (c.bubble.ttl <= 0) c.bubble = null;
+    }
+    if (c === heartbeat) {
+      if (c.target) {
+        const pdx = c.target.x - c.x;
+        if (Math.abs(pdx) > 1) c.facing = pdx > 0 ? 1 : -1;
+      } else {
+        const flipRate =
+          c.state === 'toolcall' ? 280 : c.state === 'waiting' ? 600 : 2800;
+        c.flipTimer = (c.flipTimer || 0) + dt;
+        if (c.flipTimer >= flipRate) {
+          c.flipTimer -= flipRate;
+          c.facing = -(c.facing || 1);
+        }
+      }
+    }
+  });
+}
+
+function drawStatus(ctx: CanvasRenderingContext2D, c: Char) {
+  if (!c.statusText) return;
+  const yOff = BOB[c.frame];
+  const cx = Math.floor(c.x);
+  const cy = Math.floor(c.y + yOff) - 20;
+  ctx.font = '11px serif';
+  ctx.textAlign = 'center';
+  ctx.textBaseline = 'middle';
+  ctx.fillText(c.statusText, cx, cy);
+}
+
+function drawBubble(ctx: CanvasRenderingContext2D, c: Char) {
+  if (!c.bubble) return;
+  const yOff = BOB[c.frame];
+  const bx = c.x;
+  const by = c.y + yOff - 18;
+  ctx.font = '7px Silkscreen,monospace';
+  const tw = ctx.measureText(c.bubble.text).width;
+  const pw = tw + 8;
+  const ph = 12;
+  const lx = Math.max(4, Math.min(316 - pw, bx - pw / 2));
+  ctx.fillStyle = '#facc15';
+  ctx.fillRect(Math.floor(lx), Math.floor(by - ph), Math.ceil(pw), Math.ceil(ph));
+  ctx.fillRect(Math.floor(bx) - 1, Math.floor(by), 3, 3);
+  ctx.fillStyle = '#0a0a00';
+  ctx.textAlign = 'left';
+  ctx.textBaseline = 'middle';
+  ctx.fillText(c.bubble.text, Math.floor(lx + 4), Math.floor(by - ph / 2));
+}
+
+function drawChar(ctx: CanvasRenderingContext2D, c: Char) {
+  if (!c.alive && c.state !== 'entering' && c.state !== 'exiting') return;
+  const yOff = BOB[c.frame];
+  const cx = Math.floor(c.x);
+  const cy = Math.floor(c.y + yOff);
+
+  if (c.state === 'toolcall') {
+    ctx.fillStyle = 'rgba(251,146,60,0.35)';
+    ctx.beginPath();
+    ctx.arc(cx, cy, 13, 0, Math.PI * 2);
+    ctx.fill();
+  } else if (c.state === 'waiting') {
+    ctx.fillStyle = 'rgba(96,165,250,0.25)';
+    ctx.beginPath();
+    ctx.arc(cx, cy, 11, 0, Math.PI * 2);
+    ctx.fill();
+  } else if (c.state === 'user_waiting' || c.state === 'plan_review') {
+    ctx.fillStyle = 'rgba(167,139,250,0.18)';
+    ctx.beginPath();
+    ctx.arc(cx, cy, 10, 0, Math.PI * 2);
+    ctx.fill();
+  } else if (c.state === 'plan_executing') {
+    ctx.fillStyle = 'rgba(74,222,128,0.18)';
+    ctx.beginPath();
+    ctx.arc(cx, cy, 10, 0, Math.PI * 2);
+    ctx.fill();
+  }
+
+  ctx.font = '18px serif';
+  ctx.textAlign = 'center';
+  ctx.textBaseline = 'middle';
+  if (c.facing === -1) {
+    ctx.save();
+    ctx.translate(cx, cy);
+    ctx.scale(-1, 1);
+    ctx.fillText(c.emoji, 0, 0);
+    ctx.restore();
+  } else {
+    ctx.fillText(c.emoji, cx, cy);
+  }
+  ctx.font = '6px Silkscreen,monospace';
+  ctx.textAlign = 'center';
+  ctx.textBaseline = 'top';
+  ctx.fillStyle = c.state === 'talking' ? '#facc15' : '#3a4a7a';
+  ctx.fillText(c.id.toUpperCase(), cx, cy + 11);
+  drawStatus(ctx, c);
+  drawBubble(ctx, c);
+}
+
+interface OrchCanvasProps {
+  active: boolean;
+}
+
+export function OrchCanvas({ active }: OrchCanvasProps) {
+  const canvasRef = useRef<HTMLCanvasElement>(null);
+  const animRef = useRef<number>(0);
+
+  useEffect(() => {
+    if (!active) {
+      // Disconnect WS when not active
+      if (orchReconnectTimer) {
+        clearTimeout(orchReconnectTimer);
+        orchReconnectTimer = null;
+      }
+      if (orchWs) {
+        orchWs.close();
+        orchWs = null;
+      }
+      if (animRef.current) {
+        cancelAnimationFrame(animRef.current);
+        animRef.current = 0;
+      }
+      return;
+    }
+
+    const canvas = canvasRef.current;
+    if (!canvas) return;
+    const ctx = canvas.getContext('2d');
+    if (!ctx) return;
+
+    // Init characters once
+    if (!inited) {
+      inited = true;
+      initChars();
+    }
+
+    // Start render loop
+    lastTs = null;
+    function renderLoop(ts: number) {
+      if (lastTs === null) lastTs = ts;
+      const dt = Math.min(ts - lastTs, 80);
+      lastTs = ts;
+      update(dt);
+      ctx!.imageSmoothingEnabled = false;
+      window.drawMap(ctx!);
+      allChars().forEach((c) => drawChar(ctx!, c));
+      animRef.current = requestAnimationFrame(renderLoop);
+    }
+
+    window.loadMapAsset(() => {
+      lastTs = null;
+      animRef.current = requestAnimationFrame(renderLoop);
+    });
+
+    // Connect orchestration WebSocket
+    connectOrchWs();
+
+    return () => {
+      if (animRef.current) {
+        cancelAnimationFrame(animRef.current);
+        animRef.current = 0;
+      }
+    };
+  }, [active]);
+
+  return (
+    <div class="card glass" style={{ marginTop: '16px', padding: '0' }}>
+      <div class="orch-room-row">
+        <div class="orch-side" id="orch-panel-left">
+          <div class="orch-badge alive" id="orch-badge-conductor">
+            <div class="orch-badge-emoji">{'\u{1F451}'}</div>
+            <div class="orch-badge-label">CNDR</div>
+            <div class="orch-badge-dot" />
+          </div>
+          <div class="orch-badge" id="orch-badge-secretary">
+            <div class="orch-badge-emoji">{'\u{1F469}\u{200D}\u{1F4BC}'}</div>
+            <div class="orch-badge-label">SEC</div>
+            <div class="orch-badge-dot" />
+          </div>
+          <div class="orch-badge alive" id="orch-badge-heartbeat">
+            <div class="orch-badge-emoji">{'\u{1F54A}\uFE0F'}</div>
+            <div class="orch-badge-label">HB</div>
+            <div class="orch-badge-dot" />
+          </div>
+        </div>
+        <div class="orch-canvas-wrap">
+          <canvas ref={canvasRef} id="orch-canvas" width="320" height="320" />
+        </div>
+        <div class="orch-side" id="orch-panel-right">
+          {[
+            { id: 's0', emoji: '\u{1F50D}', label: 'SCOUT' },
+            { id: 's1', emoji: '\u{1F4CA}', label: 'ANLY' },
+            { id: 's2', emoji: '\u{1F4BB}', label: 'CODE' },
+            { id: 's3', emoji: '\u{1F527}', label: 'WRKR' },
+            { id: 's4', emoji: '\u{1F3AF}', label: 'CORD' },
+          ].map((s) => (
+            <div class="orch-badge" id={`orch-badge-${s.id}`} key={s.id}>
+              <div class="orch-badge-emoji">{s.emoji}</div>
+              <div class="orch-badge-label">{s.label}</div>
+              <div class="orch-badge-dot" />
+            </div>
+          ))}
+        </div>
+      </div>
+      <div class="orch-status">
+        <span class="orch-dot" id="orch-status-dot" />
+        <span id="orch-status-text">Connecting...</span>
+      </div>
+    </div>
+  );
+}
+
+function connectOrchWs() {
+  if (orchWs && orchWs.readyState <= 1) return;
+  const initData = window.Telegram?.WebApp?.initData || '';
+  const proto = location.protocol === 'https:' ? 'wss:' : 'ws:';
+  const url =
+    proto +
+    '//' +
+    location.host +
+    '/miniapp/api/orchestration/ws?initData=' +
+    encodeURIComponent(initData);
+  orchWs = new WebSocket(url);
+
+  orchWs.onopen = () => {
+    const dot = document.getElementById('orch-status-dot');
+    const txt = document.getElementById('orch-status-text');
+    if (dot) dot.classList.add('on');
+    if (txt) txt.textContent = 'Live';
+  };
+
+  orchWs.onmessage = (e) => {
+    let msg: any;
+    try {
+      msg = JSON.parse(e.data);
+    } catch {
+      return;
+    }
+    if (msg.type === 'init') {
+      (msg.agents || []).forEach((info: any) => {
+        spawn(info.id);
+        if (info.state && info.state !== 'idle') {
+          const c = charForId(info.id);
+          if (c) setState(c, info.state);
+        }
+      });
+    } else if (msg.type === 'event') {
+      const ev = msg.event || {};
+      if (ev.type === 'agent_spawn') spawn(ev.id);
+      if (ev.type === 'agent_state') {
+        const c = charForId(ev.id);
+        if (c) setState(c, ev.state);
+      }
+      if (ev.type === 'agent_gc') gc(ev.id);
+      if (ev.type === 'conversation') converse(ev.from, ev.to, ev.text);
+    }
+  };
+
+  orchWs.onclose = () => {
+    const dot = document.getElementById('orch-status-dot');
+    const txt = document.getElementById('orch-status-text');
+    if (dot) dot.classList.remove('on');
+    if (txt) txt.textContent = 'Disconnected';
+    orchWs = null;
+  };
+
+  orchWs.onerror = () => {};
+}
diff --git a/pkg/miniapp/frontend/src/components/plan/plan-tab.tsx b/pkg/miniapp/frontend/src/components/plan/plan-tab.tsx
new file mode 100644
index 000000000..2e405ebb5
--- /dev/null
+++ b/pkg/miniapp/frontend/src/components/plan/plan-tab.tsx
@@ -0,0 +1,205 @@
+import { useEffect, useState, useCallback } from 'preact/hooks';
+import type { SSEHook } from '../../hooks/use-sse';
+import { apiFetch, sendCommand } from '../../hooks/use-api';
+import { escapeHtml, isFresh } from '../../utils';
+import { renderMarkdown } from '../../markdown';
+import { SlideApprove } from './slide-approve';
+import { OrchCanvas } from './orch-canvas';
+
+interface PlanTabProps {
+  active: boolean;
+  sse: SSEHook;
+}
+
+export function PlanTab({ active, sse }: PlanTabProps) {
+  const [plan, setPlan] = useState<any>(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(false);
+
+  const loadPlan = useCallback(async () => {
+    setLoading(true);
+    setError(false);
+    try {
+      const data = await apiFetch('/miniapp/api/plan');
+      setPlan(data);
+    } catch {
+      setError(true);
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+
+  // SSE updates
+  useEffect(() => {
+    if (sse.plan) {
+      setPlan(sse.plan);
+      setLoading(false);
+    }
+  }, [sse.plan]);
+
+  // Load on tab switch if not fresh
+  useEffect(() => {
+    if (active && !isFresh(sse.lastUpdate, 'plan')) {
+      loadPlan();
+    }
+  }, [active]);
+
+  // Initial load
+  useEffect(() => {
+    loadPlan();
+  }, []);
+
+  if (loading && !plan) return <div class="loading">Loading plan...</div>;
+  if (error && !plan) return <div class="loading">Failed to load plan.</div>;
+  if (!plan) return null;
+
+  return (
+    <>
+      <PlanContent plan={plan} />
+      {window.ORCH_ENABLED && <OrchCanvas active={active} />}
+    </>
+  );
+}
+
+function PlanContent({ plan }: { plan: any }) {
+  if (!plan.has_plan) {
+    return <NoPlan />;
+  }
+
+  const isInterviewOrReview =
+    plan.status === 'interviewing' || plan.status === 'review';
+
+  return (
+    <>
+      <div class="card glass">
+        <div class="card-title">Status</div>
+        <div class="card-value">{plan.status}</div>
+        <div style={{ color: 'var(--hint)', marginTop: '4px' }}>
+          Phase {plan.current_phase} / {plan.total_phases}
+        </div>
+      </div>
+
+      {isInterviewOrReview && plan.memory && (
+        <div
+          class="memory-view glass"
+          dangerouslySetInnerHTML={{ __html: renderMarkdown(plan.memory) }}
+        />
+      )}
+
+      {plan.status === 'review' && (
+        <>
+          <SlideApprove label="Slide to Approve" cmd="/plan start" />
+          <SlideApprove
+            label="Approve & Clear History"
+            cmd="/plan start clear"
+            warn
+          />
+        </>
+      )}
+
+      {!isInterviewOrReview && plan.phases && plan.phases.length > 0 && (
+        <Phases phases={plan.phases} currentPhase={plan.current_phase} />
+      )}
+    </>
+  );
+}
+
+function NoPlan() {
+  const [task, setTask] = useState('');
+
+  const handleStart = async () => {
+    const t = task.trim();
+    if (!t) return;
+    const ok = await sendCommand('/plan ' + t);
+    if (ok) setTask('');
+  };
+
+  return (
+    <>
+      <div class="empty-state">No active plan.</div>
+      <div class="card glass" style={{ marginTop: '16px' }}>
+        <div class="card-title">Start a Plan</div>
+        <div style={{ display: 'flex', gap: '8px', marginTop: '8px' }}>
+          <input
+            class="send-input glass glass-interactive"
+            placeholder="Describe your task..."
+            value={task}
+            onInput={(e) => setTask((e.target as HTMLInputElement).value)}
+            onKeyDown={(e) => e.key === 'Enter' && handleStart()}
+          />
+          <button class="send-btn" onClick={handleStart}>
+            Start
+          </button>
+        </div>
+      </div>
+    </>
+  );
+}
+
+function Phases({
+  phases,
+  currentPhase,
+}: {
+  phases: any[];
+  currentPhase: number;
+}) {
+  const onStepClick = (phaseNum: number, stepIdx: number, done: boolean) => {
+    if (done) return;
+    sendCommand('/plan done ' + stepIdx);
+  };
+
+  return (
+    <>
+      {phases.map((phase) => {
+        const doneCount = phase.steps.filter((s: any) => s.done).length;
+        const total = phase.steps.length;
+
+        let indicatorClass: string;
+        let indicator: string;
+        if (
+          phase.number < currentPhase ||
+          (total > 0 && doneCount === total)
+        ) {
+          indicatorClass = 'done';
+          indicator = '\u2713';
+        } else if (phase.number === currentPhase) {
+          indicatorClass = 'current';
+          indicator = String(phase.number);
+        } else {
+          indicatorClass = 'pending';
+          indicator = String(phase.number);
+        }
+
+        return (
+          <div class="phase" key={phase.number}>
+            <div class="phase-header">
+              <div class={`phase-indicator ${indicatorClass}`}>{indicator}</div>
+              <span class="phase-title">
+                {phase.title || 'Phase ' + phase.number}
+              </span>
+              {total > 0 && (
+                <span class="phase-progress">
+                  {doneCount}/{total}
+                </span>
+              )}
+            </div>
+            {phase.steps.map((step: any) => (
+              <div
+                key={step.index}
+                class={`step${step.done ? ' step-done' : ''}`}
+                onClick={() =>
+                  onStepClick(phase.number, step.index, step.done)
+                }
+              >
+                <div class={`step-check${step.done ? ' done' : ''}`} />
+                <div class={`step-text${step.done ? ' done' : ''}`}>
+                  {step.description}
+                </div>
+              </div>
+            ))}
+          </div>
+        );
+      })}
+    </>
+  );
+}
diff --git a/pkg/miniapp/frontend/src/components/plan/slide-approve.tsx b/pkg/miniapp/frontend/src/components/plan/slide-approve.tsx
new file mode 100644
index 000000000..fe5cdc41b
--- /dev/null
+++ b/pkg/miniapp/frontend/src/components/plan/slide-approve.tsx
@@ -0,0 +1,123 @@
+import { useRef, useEffect } from 'preact/hooks';
+import { sendCommand } from '../../hooks/use-api';
+
+interface SlideApproveProps {
+  label: string;
+  cmd: string;
+  warn?: boolean;
+}
+
+export function SlideApprove({ label, cmd, warn }: SlideApproveProps) {
+  const trackRef = useRef<HTMLDivElement>(null);
+  const thumbRef = useRef<HTMLDivElement>(null);
+  const labelRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    const track = trackRef.current;
+    const thumb = thumbRef.current;
+    if (!track || !thumb) return;
+
+    const ac = new AbortController();
+    const signal = ac.signal;
+
+    let dragging = false;
+    let startX = 0;
+    let thumbStartLeft = 0;
+
+    function getMaxLeft() {
+      return track!.offsetWidth - thumb!.offsetWidth - 6;
+    }
+
+    function markApproved() {
+      track!.classList.add('approved');
+      if (labelRef.current) labelRef.current.textContent = 'Approved!';
+      thumb!.classList.add('hidden');
+    }
+
+    function onStart(e: MouseEvent | TouchEvent) {
+      if (track!.classList.contains('approved')) return;
+      dragging = true;
+      thumb!.classList.add('dragging');
+      const clientX =
+        'touches' in e ? e.touches[0].clientX : e.clientX;
+      startX = clientX;
+      thumbStartLeft = thumb!.offsetLeft - 3;
+      e.preventDefault();
+    }
+
+    function onMove(e: MouseEvent | TouchEvent) {
+      if (!dragging) return;
+      const clientX =
+        'touches' in e ? e.touches[0].clientX : e.clientX;
+      const dx = clientX - startX;
+      const newLeft = Math.max(
+        0,
+        Math.min(thumbStartLeft + dx, getMaxLeft()),
+      );
+      thumb!.style.left = newLeft + 3 + 'px';
+      e.preventDefault();
+    }
+
+    function onEnd() {
+      if (!dragging) return;
+      dragging = false;
+      thumb!.classList.remove('dragging');
+      const currentLeft = thumb!.offsetLeft - 3;
+      const maxLeft = getMaxLeft();
+      if (currentLeft >= maxLeft * 0.8) {
+        markApproved();
+        sendCommand(cmd);
+      } else {
+        thumb!.style.left = '3px';
+      }
+    }
+
+    thumb.addEventListener('touchstart', onStart, {
+      passive: false,
+      signal,
+    });
+    thumb.addEventListener('mousedown', onStart, { signal });
+    document.addEventListener('touchmove', onMove, {
+      passive: false,
+      signal,
+    });
+    document.addEventListener('mousemove', onMove, { signal });
+    document.addEventListener('touchend', onEnd, { signal });
+    document.addEventListener('mouseup', onEnd, { signal });
+
+    return () => ac.abort();
+  }, [cmd]);
+
+  const borderStyle = warn
+    ? { borderColor: 'var(--warn, #ff9800)' }
+    : undefined;
+  const thumbStyle = warn
+    ? { background: 'var(--warn, #ff9800)' }
+    : undefined;
+
+  return (
+    <div class="slide-approve-wrap">
+      <div
+        class="slide-approve-track glass glass-interactive"
+        ref={trackRef}
+        style={borderStyle}
+      >
+        <div class="slide-approve-thumb" ref={thumbRef} style={thumbStyle}>
+          <svg viewBox="0 0 24 24">
+            <path
+              d="M5 12h14m-6-6 6 6-6 6"
+              stroke="currentColor"
+              stroke-width="2.5"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              fill="none"
+            />
+          </svg>
+        </div>
+        <div class="slide-approve-label" ref={labelRef}>
+          {label}
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/pkg/miniapp/frontend/src/components/tools/commands-section.tsx b/pkg/miniapp/frontend/src/components/tools/commands-section.tsx
new file mode 100644
index 000000000..cae0fdc08
--- /dev/null
+++ b/pkg/miniapp/frontend/src/components/tools/commands-section.tsx
@@ -0,0 +1,62 @@
+import { useState, useRef } from 'preact/hooks';
+import { sendCommand } from '../../hooks/use-api';
+import { flashSent } from '../../utils';
+
+const QUICK_CMDS = ['/session', '/skills', '/plan clear'];
+
+export function CommandsSection() {
+  const [customCmd, setCustomCmd] = useState('');
+  const btnRef = useRef<HTMLButtonElement>(null);
+
+  const handleQuick = async (cmd: string, e: MouseEvent) => {
+    const ok = await sendCommand(cmd);
+    if (ok) flashSent(e.currentTarget as HTMLElement);
+  };
+
+  const handleCustom = async () => {
+    const cmd = customCmd.trim();
+    if (!cmd || !cmd.startsWith('/')) return;
+    const ok = await sendCommand(cmd);
+    if (ok) {
+      setCustomCmd('');
+      if (btnRef.current) flashSent(btnRef.current);
+    }
+  };
+
+  return (
+    <>
+      <div class="card glass">
+        <div class="card-title">Quick Commands</div>
+        <div class="cmd-tiles">
+          {QUICK_CMDS.map((cmd) => (
+            <button
+              key={cmd}
+              class="cmd-tile glass glass-interactive"
+              onClick={(e) => handleQuick(cmd, e)}
+            >
+              {cmd}
+            </button>
+          ))}
+        </div>
+      </div>
+      <div class="card glass">
+        <div class="card-title">Custom Command</div>
+        <div style={{ display: 'flex', gap: '8px', marginTop: '8px' }}>
+          <input
+            class="send-input glass glass-interactive"
+            placeholder="/command args..."
+            value={customCmd}
+            onInput={(e) =>
+              setCustomCmd((e.target as HTMLInputElement).value)
+            }
+            onKeyDown={(e) => e.key === 'Enter' && handleCustom()}
+            style={{ flex: 1 }}
+          />
+          <button class="send-btn" ref={btnRef} onClick={handleCustom}>
+            Send
+          </button>
+        </div>
+      </div>
+    </>
+  );
+}
diff --git a/pkg/miniapp/frontend/src/components/tools/logs-section.tsx b/pkg/miniapp/frontend/src/components/tools/logs-section.tsx
new file mode 100644
index 000000000..53773ea51
--- /dev/null
+++ b/pkg/miniapp/frontend/src/components/tools/logs-section.tsx
@@ -0,0 +1,179 @@
+import { useEffect, useRef, useState, useCallback } from 'preact/hooks';
+import { renderLogs as renderLogsView } from '../../logs_view.js';
+
+const LOGS_PAGE_SIZE = 60;
+
+interface LogsSectionProps {
+  active: boolean;
+}
+
+export function LogsSection({ active }: LogsSectionProps) {
+  const [entries, setEntries] = useState<any[]>([]);
+  const [component, setComponent] = useState('');
+  const [page, setPage] = useState(1);
+  const [connected, setConnected] = useState(false);
+  const wsRef = useRef<WebSocket | null>(null);
+  const reconnectRef = useRef<any>(null);
+  const containerRef = useRef<HTMLDivElement>(null);
+
+  const connect = useCallback(() => {
+    if (wsRef.current && wsRef.current.readyState <= 1) return;
+    const initData = window.Telegram?.WebApp?.initData || '';
+    const proto = location.protocol === 'https:' ? 'wss:' : 'ws:';
+    let url =
+      proto +
+      '//' +
+      location.host +
+      '/miniapp/api/logs/ws?initData=' +
+      encodeURIComponent(initData);
+    if (component) url += '&component=' + encodeURIComponent(component);
+
+    const ws = new WebSocket(url);
+    wsRef.current = ws;
+
+    ws.onopen = () => setConnected(true);
+    ws.onmessage = (e) => {
+      const msg = JSON.parse(e.data);
+      if (msg.type === 'init') {
+        setEntries(msg.entries || []);
+        setPage(1);
+      } else if (msg.type === 'entry') {
+        setEntries((prev) => {
+          const next = [...prev, msg.entry];
+          return next.length > 200 ? next.slice(1) : next;
+        });
+      }
+    };
+    ws.onclose = () => {
+      setConnected(false);
+      wsRef.current = null;
+      if (active) {
+        reconnectRef.current = setTimeout(connect, 3000);
+      }
+    };
+    ws.onerror = () => {};
+  }, [component, active]);
+
+  const disconnect = useCallback(() => {
+    if (reconnectRef.current) {
+      clearTimeout(reconnectRef.current);
+      reconnectRef.current = null;
+    }
+    if (wsRef.current) {
+      wsRef.current.close();
+      wsRef.current = null;
+    }
+    setConnected(false);
+  }, []);
+
+  useEffect(() => {
+    if (active) {
+      connect();
+    } else {
+      disconnect();
+    }
+    return disconnect;
+  }, [active, component]);
+
+  const handleFilterChange = (comp: string) => {
+    setComponent(comp);
+    setPage(1);
+    setEntries([]);
+    disconnect();
+    // Will reconnect via useEffect when component changes
+  };
+
+  const view = renderLogsView(entries, {
+    component,
+    page,
+    pageSize: LOGS_PAGE_SIZE,
+  });
+
+  const handleSaveSnapshot = async () => {
+    try {
+      const initData = window.Telegram?.WebApp?.initData || '';
+      const res = await fetch(
+        location.origin +
+          '/miniapp/api/logs/snapshot?initData=' +
+          encodeURIComponent(initData),
+        { method: 'POST' },
+      );
+      if (!res.ok) return;
+      const data = await res.json();
+      if (data.download_url) {
+        const a = document.createElement('a');
+        a.href =
+          location.origin +
+          data.download_url +
+          '?initData=' +
+          encodeURIComponent(initData);
+        a.download = '';
+        document.body.appendChild(a);
+        a.click();
+        document.body.removeChild(a);
+      }
+    } catch {}
+  };
+
+  return (
+    <div class="card glass">
+      <div
+        style={{
+          display: 'flex',
+          alignItems: 'center',
+          gap: '8px',
+          marginBottom: '8px',
+        }}
+      >
+        <span class="card-title" style={{ margin: 0 }}>
+          Logs
+        </span>
+        <span class={`dev-target-dot${connected ? ' on' : ''}`} />
+      </div>
+      <div class="log-filter-chips">
+        {[
+          { label: 'All', comp: '' },
+          { label: 'Telego', comp: 'telego' },
+          { label: 'Console', comp: 'dev-console' },
+        ].map((f) => (
+          <button
+            key={f.comp}
+            class={`log-filter-chip${component === f.comp ? ' active' : ''}`}
+            onClick={() => handleFilterChange(f.comp)}
+          >
+            {f.label}
+          </button>
+        ))}
+      </div>
+      <div
+        ref={containerRef}
+        id="logs-content"
+        dangerouslySetInnerHTML={{ __html: view.html || '<div class="empty-state">No logs.</div>' }}
+      />
+      <div class="log-pagination">
+        <button
+          class="log-page-btn"
+          disabled={view.currentPage <= 1}
+          onClick={() => setPage((p) => Math.max(1, p - 1))}
+        >
+          Newer
+        </button>
+        <span>
+          {view.currentPage}/{view.totalPages} ({view.totalItems})
+        </span>
+        <button
+          class="log-page-btn"
+          disabled={view.currentPage >= view.totalPages}
+          onClick={() => setPage((p) => p + 1)}
+        >
+          Older
+        </button>
+      </div>
+      <div class="log-actions">
+        <button class="log-snap-btn" onClick={handleSaveSnapshot}>
+          Save Snapshot
+        </button>
+      </div>
+    </div>
+  );
+}
diff --git a/pkg/miniapp/frontend/src/components/tools/research-section.tsx b/pkg/miniapp/frontend/src/components/tools/research-section.tsx
new file mode 100644
index 000000000..52de7edb8
--- /dev/null
+++ b/pkg/miniapp/frontend/src/components/tools/research-section.tsx
@@ -0,0 +1,584 @@
+import { useEffect, useState, useCallback } from 'preact/hooks';
+import { apiFetch, apiPost } from '../../hooks/use-api';
+import { escapeHtml } from '../../utils';
+import { renderMarkdown } from '../../markdown';
+
+const STATUS_COLORS: Record<string, { bg: string; text: string }> = {
+  pending: { bg: 'rgba(234,179,8,0.15)', text: '#ca8a04' },
+  active: { bg: 'rgba(59,130,246,0.15)', text: '#2563eb' },
+  completed: { bg: 'rgba(34,197,94,0.15)', text: '#16a34a' },
+  failed: { bg: 'rgba(239,68,68,0.15)', text: '#dc2626' },
+  canceled: { bg: 'rgba(107,114,128,0.15)', text: '#6b7280' },
+};
+
+interface ResearchSectionProps {
+  active: boolean;
+}
+
+export function ResearchSection({ active }: ResearchSectionProps) {
+  const [tasks, setTasks] = useState<any[] | null>(null);
+  const [loading, setLoading] = useState(false);
+  const [showForm, setShowForm] = useState(false);
+  const [detailId, setDetailId] = useState<string | null>(null);
+
+  const loadTasks = useCallback(async () => {
+    setLoading(true);
+    try {
+      const data = await apiFetch('/miniapp/api/research');
+      setTasks(data);
+    } catch {
+      setTasks(null);
+    }
+    setLoading(false);
+  }, []);
+
+  useEffect(() => {
+    if (active) loadTasks();
+  }, [active]);
+
+  if (detailId) {
+    return (
+      <TaskDetail
+        taskId={detailId}
+        onBack={() => {
+          setDetailId(null);
+          loadTasks();
+        }}
+      />
+    );
+  }
+
+  return (
+    <div class="card glass">
+      <div
+        style={{
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'space-between',
+          marginBottom: '12px',
+        }}
+      >
+        <span class="card-title" style={{ margin: 0 }}>
+          Research Tasks
+        </span>
+        <button
+          class="send-btn"
+          style={{ padding: '6px 14px', fontSize: '13px' }}
+          onClick={() => setShowForm(true)}
+        >
+          + New
+        </button>
+      </div>
+      {showForm && (
+        <NewTaskForm
+          onCreated={() => {
+            setShowForm(false);
+            loadTasks();
+          }}
+          onCancel={() => setShowForm(false)}
+        />
+      )}
+      {loading && !tasks ? (
+        <div class="loading" style={{ padding: '12px' }}>
+          Loading tasks...
+        </div>
+      ) : !tasks || tasks.length === 0 ? (
+        <div class="empty-state" style={{ padding: '24px' }}>
+          No research tasks yet.
+        </div>
+      ) : (
+        tasks.map((t) => {
+          const sc = STATUS_COLORS[t.status] || STATUS_COLORS.pending;
+          return (
+            <div
+              key={t.id}
+              class="card glass glass-interactive"
+              style={{
+                cursor: 'pointer',
+                padding: '14px',
+                ...(t.focused
+                  ? { borderLeft: '3px solid #a855f7' }
+                  : {}),
+              }}
+              onClick={() => setDetailId(t.id)}
+            >
+              <div
+                style={{
+                  display: 'flex',
+                  alignItems: 'center',
+                  justifyContent: 'space-between',
+                  gap: '8px',
+                }}
+              >
+                <span style={{ fontWeight: 600, fontSize: '15px' }}>
+                  {t.title}
+                </span>
+                <div
+                  style={{
+                    display: 'flex',
+                    gap: '4px',
+                    alignItems: 'center',
+                  }}
+                >
+                  {t.focused && (
+                    <span
+                      style={{
+                        fontSize: '10px',
+                        fontWeight: 600,
+                        padding: '2px 6px',
+                        borderRadius: '8px',
+                        background: 'rgba(168,85,247,0.2)',
+                        color: '#a855f7',
+                      }}
+                    >
+                      focused
+                    </span>
+                  )}
+                  <span
+                    style={{
+                      fontSize: '11px',
+                      fontWeight: 600,
+                      padding: '2px 8px',
+                      borderRadius: '10px',
+                      background: sc.bg,
+                      color: sc.text,
+                    }}
+                  >
+                    {t.status}
+                  </span>
+                </div>
+              </div>
+              {t.description && (
+                <div
+                  style={{
+                    color: 'var(--hint)',
+                    fontSize: '13px',
+                    marginTop: '4px',
+                    lineHeight: 1.4,
+                  }}
+                >
+                  {t.description.substring(0, 120)}
+                </div>
+              )}
+              <div
+                style={{
+                  color: 'var(--hint)',
+                  fontSize: '11px',
+                  marginTop: '6px',
+                }}
+              >
+                {t.document_count} docs{' \u00B7 \u23F1 '}
+                {(t.interval === '24h' ? '1d' : t.interval) || '1d'}
+                {t.last_researched_at &&
+                  ' \u00B7 last: ' +
+                    new Date(t.last_researched_at).toLocaleDateString()}
+              </div>
+            </div>
+          );
+        })
+      )}
+    </div>
+  );
+}
+
+function NewTaskForm({
+  onCreated,
+  onCancel,
+}: {
+  onCreated: () => void;
+  onCancel: () => void;
+}) {
+  const [title, setTitle] = useState('');
+  const [desc, setDesc] = useState('');
+
+  const handleCreate = async () => {
+    const t = title.trim();
+    if (!t) return;
+    try {
+      await apiPost('/miniapp/api/research', {
+        title: t,
+        description: desc.trim(),
+      });
+      onCreated();
+    } catch {}
+  };
+
+  return (
+    <div class="card glass" style={{ padding: '12px', marginBottom: '12px' }}>
+      <input
+        class="send-input glass glass-interactive"
+        placeholder="Task title..."
+        value={title}
+        onInput={(e) => setTitle((e.target as HTMLInputElement).value)}
+        style={{ width: '100%', marginBottom: '8px' }}
+      />
+      <textarea
+        class="send-input glass glass-interactive"
+        placeholder="Description (optional)..."
+        value={desc}
+        onInput={(e) => setDesc((e.target as HTMLTextAreaElement).value)}
+        style={{
+          width: '100%',
+          minHeight: '60px',
+          resize: 'vertical',
+          marginBottom: '8px',
+          borderRadius: '12px',
+          padding: '10px 16px',
+        }}
+      />
+      <div style={{ display: 'flex', gap: '8px', justifyContent: 'flex-end' }}>
+        <button
+          class="send-btn"
+          style={{
+            padding: '6px 14px',
+            fontSize: '13px',
+            background: 'var(--hint)',
+          }}
+          onClick={onCancel}
+        >
+          Cancel
+        </button>
+        <button
+          class="send-btn"
+          style={{ padding: '6px 14px', fontSize: '13px' }}
+          onClick={handleCreate}
+        >
+          Create
+        </button>
+      </div>
+    </div>
+  );
+}
+
+function TaskDetail({
+  taskId,
+  onBack,
+}: {
+  taskId: string;
+  onBack: () => void;
+}) {
+  const [task, setTask] = useState<any>(null);
+  const [loading, setLoading] = useState(true);
+
+  const load = useCallback(async () => {
+    setLoading(true);
+    try {
+      const data = await apiFetch('/miniapp/api/research/' + taskId);
+      setTask(data);
+    } catch {}
+    setLoading(false);
+  }, [taskId]);
+
+  useEffect(() => {
+    load();
+  }, [taskId]);
+
+  const handleAction = async (action: string) => {
+    try {
+      await apiPost('/miniapp/api/research/' + taskId, { action });
+      load();
+    } catch {}
+  };
+
+  const handleFocus = async (recall: boolean) => {
+    try {
+      await apiPost('/miniapp/api/research/focus', {
+        action: recall ? 'recall' : 'forget',
+        task_id: taskId,
+      });
+      load();
+    } catch {}
+  };
+
+  const handleInterval = async (interval: string) => {
+    try {
+      await apiPost('/miniapp/api/research/' + taskId, {
+        action: 'set_interval',
+        interval,
+      });
+      load();
+    } catch {}
+  };
+
+  if (loading || !task) {
+    return (
+      <div class="card glass">
+        <button class="git-back-btn" onClick={onBack}>
+          {'\u2039'} Back
+        </button>
+        <div class="loading">Loading...</div>
+      </div>
+    );
+  }
+
+  const sc = STATUS_COLORS[task.status] || STATUS_COLORS.pending;
+  const canCancel = task.status === 'pending' || task.status === 'active';
+  const canReopen = task.status === 'completed' || task.status === 'failed';
+  const curInterval = (task.interval === '24h' ? '1d' : task.interval) || '1d';
+
+  return (
+    <>
+      <button class="git-back-btn" onClick={onBack}>
+        {'\u2039'} Back
+      </button>
+      <div class="card glass">
+        <div
+          style={{
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'space-between',
+            gap: '8px',
+            marginBottom: '8px',
+          }}
+        >
+          <span style={{ fontWeight: 700, fontSize: '17px' }}>
+            {task.title}
+          </span>
+          <span
+            style={{
+              fontSize: '11px',
+              fontWeight: 600,
+              padding: '2px 8px',
+              borderRadius: '10px',
+              background: sc.bg,
+              color: sc.text,
+            }}
+          >
+            {task.status}
+          </span>
+        </div>
+        {task.description && (
+          <div
+            style={{
+              color: 'var(--hint)',
+              fontSize: '13px',
+              lineHeight: 1.5,
+              marginBottom: '8px',
+              whiteSpace: 'pre-wrap',
+            }}
+          >
+            {task.description}
+          </div>
+        )}
+        <div
+          style={{
+            color: 'var(--hint)',
+            fontSize: '11px',
+            display: 'flex',
+            alignItems: 'center',
+            gap: '6px',
+          }}
+        >
+          <span>Interval:</span>
+          <select
+            value={curInterval}
+            onChange={(e) =>
+              handleInterval((e.target as HTMLSelectElement).value)
+            }
+            style={{
+              fontSize: '11px',
+              padding: '1px 4px',
+              borderRadius: '6px',
+              background: 'var(--tab-track-bg)',
+              color: 'var(--text)',
+              border: '1px solid var(--glass-divider)',
+              outline: 'none',
+            }}
+          >
+            {['30m', '1h', '6h', '12h', '1d', '3d', '7d'].map((v) => (
+              <option key={v} value={v}>
+                {v}
+              </option>
+            ))}
+          </select>
+          <span>
+            {task.last_researched_at
+              ? '\u00B7 Last: ' +
+                new Date(task.last_researched_at).toLocaleString()
+              : '\u00B7 Not yet researched'}
+          </span>
+        </div>
+        <div
+          style={{
+            color: 'var(--hint)',
+            fontSize: '11px',
+            marginTop: '2px',
+          }}
+        >
+          Created: {new Date(task.created_at).toLocaleString()}
+          {task.completed_at &&
+            ' \u00B7 Completed: ' +
+              new Date(task.completed_at).toLocaleString()}
+        </div>
+        <div style={{ marginTop: '10px', display: 'flex', gap: '8px' }}>
+          {task.focused ? (
+            <button
+              class="worktree-btn dispose"
+              style={{
+                background: 'rgba(168,85,247,0.15)',
+                color: '#a855f7',
+                borderColor: '#a855f7',
+              }}
+              onClick={() => handleFocus(false)}
+            >
+              Forget
+            </button>
+          ) : (
+            <button
+              class="worktree-btn merge"
+              style={{
+                background: 'rgba(168,85,247,0.15)',
+                color: '#a855f7',
+                borderColor: '#a855f7',
+              }}
+              onClick={() => handleFocus(true)}
+            >
+              Recall
+            </button>
+          )}
+          {task.status === 'pending' && (
+            <button
+              class="worktree-btn merge"
+              onClick={() => handleAction('activate')}
+            >
+              Activate
+            </button>
+          )}
+          {task.status === 'active' && (
+            <button
+              class="worktree-btn merge"
+              style={{
+                background: 'rgba(34,197,94,0.15)',
+                color: '#22c55e',
+                borderColor: '#22c55e',
+              }}
+              onClick={() => handleAction('complete')}
+            >
+              Complete
+            </button>
+          )}
+          {canCancel && (
+            <button
+              class="worktree-btn dispose"
+              onClick={() => handleAction('cancel')}
+            >
+              Cancel
+            </button>
+          )}
+          {canReopen && (
+            <button
+              class="worktree-btn merge"
+              onClick={() => handleAction('reopen')}
+            >
+              Reopen
+            </button>
+          )}
+        </div>
+      </div>
+
+      <div class="card-title" style={{ marginTop: '12px' }}>
+        Documents ({task.documents.length})
+      </div>
+      {task.documents.length === 0 ? (
+        <div class="empty-state" style={{ padding: '24px' }}>
+          No documents yet.
+        </div>
+      ) : (
+        task.documents.map((d: any) => (
+          <DocCard key={d.id} doc={d} taskId={taskId} />
+        ))
+      )}
+    </>
+  );
+}
+
+function DocCard({ doc, taskId }: { doc: any; taskId: string }) {
+  const [expanded, setExpanded] = useState(false);
+  const [content, setContent] = useState<string | null>(null);
+  const [loading, setLoading] = useState(false);
+
+  const toggle = async () => {
+    if (expanded) {
+      setExpanded(false);
+      return;
+    }
+    setExpanded(true);
+    if (content !== null) return;
+    setLoading(true);
+    try {
+      const data = await apiFetch(
+        '/miniapp/api/research/' + taskId + '/doc/' + doc.id,
+      );
+      setContent(data.content);
+    } catch {
+      setContent('Failed to load document.');
+    }
+    setLoading(false);
+  };
+
+  return (
+    <div
+      class="card glass"
+      style={{ padding: '12px', cursor: 'pointer' }}
+      onClick={toggle}
+    >
+      <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
+        <span
+          style={{
+            color: 'var(--hint)',
+            fontFamily: 'monospace',
+            fontSize: '12px',
+          }}
+        >
+          #{doc.seq}
+        </span>
+        <span style={{ fontWeight: 600, fontSize: '14px', flex: 1 }}>
+          {doc.title}
+        </span>
+        <span
+          style={{
+            fontSize: '10px',
+            padding: '2px 6px',
+            borderRadius: '8px',
+            background: 'var(--tab-track-bg)',
+            color: 'var(--hint)',
+          }}
+        >
+          {doc.doc_type}
+        </span>
+      </div>
+      {doc.summary && (
+        <div
+          style={{
+            color: 'var(--hint)',
+            fontSize: '12px',
+            marginTop: '4px',
+          }}
+        >
+          {doc.summary}
+        </div>
+      )}
+      {expanded && (
+        <div
+          style={{
+            marginTop: '8px',
+            borderTop: '1px solid var(--glass-divider)',
+            paddingTop: '8px',
+          }}
+        >
+          {loading ? (
+            <div class="loading" style={{ padding: '12px' }}>
+              Loading...
+            </div>
+          ) : content ? (
+            <div
+              class="md-rendered"
+              style={{ maxHeight: '50vh', overflow: 'auto', padding: '8px 0' }}
+              dangerouslySetInnerHTML={{ __html: renderMarkdown(content) }}
+            />
+          ) : null}
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/pkg/miniapp/frontend/src/components/tools/skills-section.tsx b/pkg/miniapp/frontend/src/components/tools/skills-section.tsx
new file mode 100644
index 000000000..bba552e8f
--- /dev/null
+++ b/pkg/miniapp/frontend/src/components/tools/skills-section.tsx
@@ -0,0 +1,106 @@
+import { useEffect, useState } from 'preact/hooks';
+import type { SSEHook } from '../../hooks/use-sse';
+import { apiFetch, sendCommand } from '../../hooks/use-api';
+import { isFresh, flashSent } from '../../utils';
+
+interface SkillsSectionProps {
+  active: boolean;
+  sse: SSEHook;
+}
+
+export function SkillsSection({ active, sse }: SkillsSectionProps) {
+  const [skills, setSkills] = useState<any[] | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [selected, setSelected] = useState<string | null>(null);
+  const [msg, setMsg] = useState('');
+
+  const loadSkills = async () => {
+    setLoading(true);
+    try {
+      const data = await apiFetch('/miniapp/api/skills');
+      setSkills(data);
+    } catch {}
+    setLoading(false);
+  };
+
+  useEffect(() => {
+    if (sse.skills) {
+      setSkills(sse.skills);
+      setLoading(false);
+    }
+  }, [sse.skills]);
+
+  useEffect(() => {
+    if (active && !isFresh(sse.lastUpdate, 'skills')) loadSkills();
+  }, [active]);
+
+  const handleSend = async () => {
+    if (!selected) return;
+    const m = msg.trim();
+    const cmd = m ? '/skill ' + selected + ' ' + m : '/skill ' + selected;
+    const ok = await sendCommand(cmd);
+    if (ok) setMsg('');
+  };
+
+  return (
+    <div class="card glass">
+      <div class="card-title">Skills</div>
+      {loading && !skills ? (
+        <div class="loading" style={{ padding: '12px' }}>
+          Loading skills...
+        </div>
+      ) : !skills || skills.length === 0 ? (
+        <div
+          class="empty-state"
+          style={{ padding: '12px 0' }}
+        >
+          No skills installed.
+        </div>
+      ) : (
+        <>
+          {skills.map((s) => (
+            <div
+              key={s.name}
+              class={`skill-item glass glass-interactive${selected === s.name ? ' selected' : ''}`}
+              onClick={() => {
+                setSelected(selected === s.name ? null : s.name);
+              }}
+            >
+              <div class="skill-body">
+                <div class="skill-name">{s.name}</div>
+                <div class="skill-desc">
+                  {s.description || 'No description'}
+                </div>
+                <span class="skill-source">{s.source}</span>
+              </div>
+              <span class="skill-arrow">{'\u203A'}</span>
+            </div>
+          ))}
+          {selected && (
+            <div
+              style={{
+                display: 'flex',
+                gap: '8px',
+                marginTop: '10px',
+              }}
+            >
+              <input
+                class="send-input glass glass-interactive"
+                placeholder={`Message for /${selected}...`}
+                value={msg}
+                onInput={(e) =>
+                  setMsg((e.target as HTMLInputElement).value)
+                }
+                onKeyDown={(e) => e.key === 'Enter' && handleSend()}
+                style={{ flex: 1 }}
+              />
+              <button class="send-btn" onClick={handleSend}>
+                Send
+              </button>
+            </div>
+          )}
+        </>
+      )}
+    </div>
+  );
+}
diff --git a/pkg/miniapp/frontend/src/components/tools/tools-tab.tsx b/pkg/miniapp/frontend/src/components/tools/tools-tab.tsx
new file mode 100644
index 000000000..c7409895e
--- /dev/null
+++ b/pkg/miniapp/frontend/src/components/tools/tools-tab.tsx
@@ -0,0 +1,23 @@
+import { useEffect, useState } from 'preact/hooks';
+import type { SSEHook } from '../../hooks/use-sse';
+import { isFresh } from '../../utils';
+import { SkillsSection } from './skills-section';
+import { CommandsSection } from './commands-section';
+import { LogsSection } from './logs-section';
+import { ResearchSection } from './research-section';
+
+interface ToolsTabProps {
+  active: boolean;
+  sse: SSEHook;
+}
+
+export function ToolsTab({ active, sse }: ToolsTabProps) {
+  return (
+    <>
+      <SkillsSection active={active} sse={sse} />
+      <CommandsSection />
+      <LogsSection active={active} />
+      <ResearchSection active={active} />
+    </>
+  );
+}
diff --git a/pkg/miniapp/frontend/src/components/work/git-section.tsx b/pkg/miniapp/frontend/src/components/work/git-section.tsx
new file mode 100644
index 000000000..c0b931e24
--- /dev/null
+++ b/pkg/miniapp/frontend/src/components/work/git-section.tsx
@@ -0,0 +1,289 @@
+import { useState, useCallback } from 'preact/hooks';
+import { apiFetch, apiPost } from '../../hooks/use-api';
+import { escapeHtml } from '../../utils';
+
+interface GitSectionProps {
+  repos: any[] | null;
+  worktrees: any[];
+  onReload: () => void;
+}
+
+export function GitSection({ repos, worktrees, onReload }: GitSectionProps) {
+  const [detailRepo, setDetailRepo] = useState<any>(null);
+  const [detailName, setDetailName] = useState<string | null>(null);
+  const [loadingDetail, setLoadingDetail] = useState(false);
+
+  const loadDetail = useCallback(async (name: string) => {
+    setDetailName(name);
+    setLoadingDetail(true);
+    try {
+      const data = await apiFetch(
+        '/miniapp/api/git?repo=' + encodeURIComponent(name),
+      );
+      setDetailRepo(data);
+    } catch {}
+    setLoadingDetail(false);
+  }, []);
+
+  const goBack = useCallback(() => {
+    setDetailRepo(null);
+    setDetailName(null);
+    onReload();
+  }, [onReload]);
+
+  if (detailName) {
+    return (
+      <RepoDetail
+        repo={detailRepo}
+        name={detailName}
+        loading={loadingDetail}
+        onBack={goBack}
+      />
+    );
+  }
+
+  return (
+    <>
+      <Worktrees items={worktrees} onReload={onReload} />
+      <RepoList repos={repos} onSelect={loadDetail} />
+    </>
+  );
+}
+
+function Worktrees({
+  items,
+  onReload,
+}: {
+  items: any[];
+  onReload: () => void;
+}) {
+  const [busy, setBusy] = useState<string | null>(null);
+
+  const handleAction = async (
+    action: string,
+    name: string,
+    isDirty: boolean,
+  ) => {
+    let force = false;
+    if (action === 'merge') {
+      if (!confirm('Merge "' + name + '" into base branch?')) return;
+    } else if (action === 'dispose') {
+      if (isDirty) {
+        if (
+          !confirm(
+            '"' +
+              name +
+              '" has uncommitted changes. Force dispose and auto-commit before removal?',
+          )
+        )
+          return;
+        force = true;
+      } else if (!confirm('Dispose worktree "' + name + '"?')) {
+        return;
+      }
+    }
+
+    setBusy(name + ':' + action);
+    try {
+      await apiPost('/miniapp/api/worktrees', { action, name, force });
+      onReload();
+    } catch (err: any) {
+      alert(err.message || 'Action failed');
+    }
+    setBusy(null);
+  };
+
+  return (
+    <div class="card glass">
+      <div class="card-title">Worktrees</div>
+      {items.length === 0 ? (
+        <div class="empty-state" style={{ padding: '12px 0 4px' }}>
+          No active worktrees.
+        </div>
+      ) : (
+        <div class="worktree-list">
+          {items.map((wt) => {
+            let last = '(no commits)';
+            if (wt.last_commit_hash) {
+              last =
+                wt.last_commit_hash +
+                ' ' +
+                (wt.last_commit_subject || '');
+              if (wt.last_commit_age) last += ' (' + wt.last_commit_age + ')';
+            }
+
+            return (
+              <div
+                class={`worktree-item${wt.has_uncommitted ? ' dirty' : ''}`}
+                key={wt.name}
+              >
+                <div class="worktree-main">
+                  <div class="worktree-name-row">
+                    <span class="worktree-name">{wt.name}</span>
+                    {wt.has_uncommitted ? (
+                      <span class="worktree-dirty">DIRTY</span>
+                    ) : (
+                      <span class="worktree-clean">CLEAN</span>
+                    )}
+                  </div>
+                  <div class="worktree-branch">{wt.branch || '?'}</div>
+                  <div class="worktree-last">{last}</div>
+                </div>
+                <div class="worktree-actions">
+                  <button
+                    class="worktree-btn merge"
+                    disabled={busy === wt.name + ':merge'}
+                    onClick={() =>
+                      handleAction('merge', wt.name, wt.has_uncommitted)
+                    }
+                  >
+                    {busy === wt.name + ':merge' ? 'Merging...' : 'Merge'}
+                  </button>
+                  <button
+                    class="worktree-btn dispose"
+                    disabled={busy === wt.name + ':dispose'}
+                    onClick={() =>
+                      handleAction('dispose', wt.name, wt.has_uncommitted)
+                    }
+                  >
+                    {busy === wt.name + ':dispose'
+                      ? 'Disposing...'
+                      : 'Dispose'}
+                  </button>
+                </div>
+              </div>
+            );
+          })}
+        </div>
+      )}
+    </div>
+  );
+}
+
+function RepoList({
+  repos,
+  onSelect,
+}: {
+  repos: any[] | null;
+  onSelect: (name: string) => void;
+}) {
+  if (!repos || repos.length === 0) {
+    return (
+      <div class="empty-state" style={{ marginTop: '12px' }}>
+        No git repositories found.
+      </div>
+    );
+  }
+
+  return (
+    <>
+      <div
+        style={{
+          padding: '10px 4px 8px',
+          fontSize: '12px',
+          color: 'var(--hint)',
+        }}
+      >
+        Repositories
+      </div>
+      {repos.map((r) => (
+        <div
+          key={r.name}
+          class="git-repo-item glass glass-interactive"
+          onClick={() => onSelect(r.name)}
+        >
+          <div class="git-repo-body">
+            <div class="git-repo-name">{r.name}</div>
+            <div class="git-repo-branch">{r.branch || '?'}</div>
+          </div>
+          <span class="git-repo-arrow">{'\u203A'}</span>
+        </div>
+      ))}
+    </>
+  );
+}
+
+function RepoDetail({
+  repo,
+  name,
+  loading,
+  onBack,
+}: {
+  repo: any;
+  name: string;
+  loading: boolean;
+  onBack: () => void;
+}) {
+  if (loading || !repo) {
+    return (
+      <>
+        <button class="git-back-btn" onClick={onBack}>
+          {'\u2190'} {name}
+        </button>
+        <div class="loading">Loading {name}...</div>
+      </>
+    );
+  }
+
+  return (
+    <>
+      <button class="git-back-btn" onClick={onBack}>
+        {'\u2190'} {repo.name || name}
+      </button>
+      <div class="card glass">
+        <div class="card-title">
+          {repo.name} &mdash; {repo.branch || '?'}
+        </div>
+
+        {repo.modified && repo.modified.length > 0 && (
+          <>
+            <div
+              style={{
+                padding: '4px 12px 8px',
+                fontSize: '12px',
+                color: 'var(--hint)',
+              }}
+            >
+              Changes ({repo.modified.length})
+            </div>
+            {repo.modified.map((f: any, i: number) => (
+              <div class="git-commit" key={i}>
+                <span
+                  class={`git-status git-status-${f.status === '??' ? 'u' : f.status.toLowerCase()}`}
+                >
+                  {f.status}
+                </span>
+                <span class="git-subject">{f.path}</span>
+              </div>
+            ))}
+          </>
+        )}
+
+        {repo.commits && repo.commits.length > 0 ? (
+          <>
+            <div
+              style={{
+                padding: '4px 12px 8px',
+                fontSize: '12px',
+                color: 'var(--hint)',
+              }}
+            >
+              Commits
+            </div>
+            {repo.commits.map((c: any, i: number) => (
+              <div class="git-commit" key={i}>
+                <span class="git-hash">{c.hash}</span>
+                <span class="git-subject">{c.subject}</span>
+                <span class="git-meta">{c.date}</span>
+              </div>
+            ))}
+          </>
+        ) : (
+          <div style={{ padding: '12px', color: 'var(--hint)' }}>
+            No commits found.
+          </div>
+        )}
+      </div>
+    </>
+  );
+}
diff --git a/pkg/miniapp/frontend/src/components/work/session-section.tsx b/pkg/miniapp/frontend/src/components/work/session-section.tsx
new file mode 100644
index 000000000..d4f1c2f36
--- /dev/null
+++ b/pkg/miniapp/frontend/src/components/work/session-section.tsx
@@ -0,0 +1,386 @@
+import { useState } from 'preact/hooks';
+import { apiFetch } from '../../hooks/use-api';
+import { formatAge, formatTokens, formatSessionLabel, escapeHtml } from '../../utils';
+
+interface SessionSectionProps {
+  sessions: any[] | null;
+  stats: any;
+  graph: any;
+  context: any;
+}
+
+export function SessionSection({
+  sessions,
+  stats,
+  graph,
+  context,
+}: SessionSectionProps) {
+  return (
+    <>
+      <ActiveSessions sessions={sessions} />
+      <StatsCards stats={stats} />
+      {context && <ContextCard context={context} />}
+      {graph && <SessionGraph graph={graph} />}
+    </>
+  );
+}
+
+function ActiveSessions({ sessions }: { sessions: any[] | null }) {
+  if (!sessions || sessions.length === 0) {
+    return (
+      <div class="card glass">
+        <div class="card-title">Active Sessions</div>
+        <div style={{ color: 'var(--hint)', fontSize: '13px' }}>
+          No active sessions
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <div class="card glass">
+      <div class="card-title">Active Sessions</div>
+      {sessions.map((s) => {
+        const label = formatSessionLabel(s.session_key);
+        const isHeartbeat = s.session_key.startsWith('heartbeat:');
+        const latestMsg = s.latest_message || null;
+
+        return (
+          <div
+            key={s.session_key}
+            style={{
+              padding: '8px 0',
+              borderBottom: '1px solid var(--secondary-bg)',
+            }}
+          >
+            <div
+              style={{
+                display: 'flex',
+                alignItems: 'center',
+                gap: '6px',
+              }}
+            >
+              <span
+                style={{
+                  color: isHeartbeat ? 'var(--link)' : 'var(--done)',
+                  fontSize: '10px',
+                }}
+              >
+                {isHeartbeat ? '\u{1F916}' : '\u25CF'}
+              </span>
+              <span style={{ fontWeight: 600, fontSize: '14px', flex: 1 }}>
+                {label}
+              </span>
+              <span
+                style={{
+                  color: 'var(--hint)',
+                  fontSize: '12px',
+                  flexShrink: 0,
+                }}
+              >
+                {s.turn_count || 0} turns
+              </span>
+              <span
+                style={{
+                  marginLeft: '4px',
+                  color: 'var(--hint)',
+                  fontSize: '12px',
+                }}
+              >
+                {formatAge(s.age_sec)}
+              </span>
+            </div>
+            {latestMsg && (
+              <div
+                style={{
+                  color: 'var(--hint)',
+                  fontSize: '12px',
+                  paddingLeft: '22px',
+                  marginTop: '2px',
+                  overflow: 'hidden',
+                  textOverflow: 'ellipsis',
+                  whiteSpace: 'nowrap',
+                }}
+              >
+                {latestMsg}
+              </div>
+            )}
+          </div>
+        );
+      })}
+    </div>
+  );
+}
+
+function StatsCards({ stats }: { stats: any }) {
+  if (!stats || stats.status === 'stats not enabled') {
+    return (
+      <div class="empty-state">
+        Stats tracking not enabled.
+        <br />
+        Start gateway with --stats flag.
+      </div>
+    );
+  }
+
+  const since = stats.since
+    ? new Date(stats.since).toLocaleDateString()
+    : 'N/A';
+  const today = stats.today || {};
+
+  return (
+    <>
+      <div class="card glass">
+        <div class="card-title">Today</div>
+        <div class="stat-row">
+          <span class="stat-label">Prompts</span>
+          <span class="stat-value">{today.prompts || 0}</span>
+        </div>
+        <div class="stat-row">
+          <span class="stat-label">Requests</span>
+          <span class="stat-value">{today.requests || 0}</span>
+        </div>
+        <div class="stat-row">
+          <span class="stat-label">Tokens</span>
+          <span class="stat-value">
+            {formatTokens(today.total_tokens || 0)}
+          </span>
+        </div>
+      </div>
+      <div class="card glass">
+        <div class="card-title">All Time (since {since})</div>
+        <div class="stat-row">
+          <span class="stat-label">Prompts</span>
+          <span class="stat-value">{stats.total_prompts || 0}</span>
+        </div>
+        <div class="stat-row">
+          <span class="stat-label">Requests</span>
+          <span class="stat-value">{stats.total_requests || 0}</span>
+        </div>
+        <div class="stat-row">
+          <span class="stat-label">Total Tokens</span>
+          <span class="stat-value">
+            {formatTokens(stats.total_tokens || 0)}
+          </span>
+        </div>
+        <div class="stat-row">
+          <span class="stat-label">Prompt Tokens</span>
+          <span class="stat-value">
+            {formatTokens(stats.total_prompt_tokens || 0)}
+          </span>
+        </div>
+        <div class="stat-row">
+          <span class="stat-label">Completion Tokens</span>
+          <span class="stat-value">
+            {formatTokens(stats.total_completion_tokens || 0)}
+          </span>
+        </div>
+      </div>
+    </>
+  );
+}
+
+function ContextCard({ context }: { context: any }) {
+  const [showPrompt, setShowPrompt] = useState(false);
+  const [promptText, setPromptText] = useState<string | null>(null);
+  const [promptLoading, setPromptLoading] = useState(false);
+
+  const togglePrompt = async () => {
+    if (showPrompt) {
+      setShowPrompt(false);
+      return;
+    }
+    setPromptLoading(true);
+    try {
+      const data = await apiFetch('/miniapp/api/prompt');
+      setPromptText(data.prompt || '(empty)');
+      setShowPrompt(true);
+    } catch {}
+    setPromptLoading(false);
+  };
+
+  const wd = context.work_dir || '\u2014';
+  const pwd = context.plan_work_dir || '\u2014';
+  const ws = context.workspace || '\u2014';
+
+  return (
+    <div class="card glass">
+      <div class="card-title">Context</div>
+      <div style={{ fontSize: '12px' }}>
+        <div class="stat-row">
+          <span class="stat-label">workDir</span>
+          <span
+            class="stat-value"
+            style={{
+              fontSize: '12px',
+              overflow: 'hidden',
+              textOverflow: 'ellipsis',
+            }}
+            title={wd}
+          >
+            {wd}
+          </span>
+        </div>
+        <div class="stat-row">
+          <span class="stat-label">planWorkDir</span>
+          <span
+            class="stat-value"
+            style={{
+              fontSize: '12px',
+              overflow: 'hidden',
+              textOverflow: 'ellipsis',
+            }}
+            title={pwd}
+          >
+            {pwd}
+          </span>
+        </div>
+        <div class="stat-row">
+          <span class="stat-label">workspace</span>
+          <span
+            class="stat-value"
+            style={{
+              fontSize: '12px',
+              overflow: 'hidden',
+              textOverflow: 'ellipsis',
+            }}
+            title={ws}
+          >
+            {ws}
+          </span>
+        </div>
+      </div>
+      {context.bootstrap && context.bootstrap.length > 0 && (
+        <div style={{ marginTop: '8px' }}>
+          {context.bootstrap.map((b: any, i: number) => {
+            const path = b.path || '\u2014';
+            const scope = b.scope === 'global' ? 'global' : 'project';
+            return (
+              <div
+                key={i}
+                style={{
+                  display: 'flex',
+                  gap: '8px',
+                  padding: '2px 0',
+                  fontSize: '12px',
+                }}
+              >
+                <span
+                  style={{
+                    minWidth: '90px',
+                    fontWeight: 600,
+                    color: b.path ? 'var(--text)' : 'var(--hint)',
+                  }}
+                >
+                  {b.name}
+                </span>
+                <span
+                  style={{
+                    color: 'var(--hint)',
+                    flex: 1,
+                    overflow: 'hidden',
+                    textOverflow: 'ellipsis',
+                    whiteSpace: 'nowrap',
+                  }}
+                  title={path}
+                >
+                  {path}
+                </span>
+                <span style={{ color: 'var(--hint)', fontSize: '11px' }}>
+                  {scope}
+                </span>
+              </div>
+            );
+          })}
+        </div>
+      )}
+      <div style={{ marginTop: '8px', textAlign: 'center' }}>
+        <button
+          onClick={togglePrompt}
+          style={{
+            background: 'var(--secondary-bg)',
+            color: 'var(--text)',
+            border: 'none',
+            padding: '6px 12px',
+            borderRadius: '8px',
+            fontSize: '12px',
+            cursor: 'pointer',
+          }}
+        >
+          {promptLoading
+            ? 'Loading...'
+            : showPrompt
+              ? 'Hide System Prompt'
+              : 'Show System Prompt'}
+        </button>
+      </div>
+      {showPrompt && promptText && (
+        <pre
+          style={{
+            marginTop: '8px',
+            fontSize: '11px',
+            maxHeight: '400px',
+            overflow: 'auto',
+            background: 'var(--secondary-bg)',
+            padding: '8px',
+            borderRadius: '6px',
+            whiteSpace: 'pre-wrap',
+            wordBreak: 'break-word',
+          }}
+        >
+          {promptText}
+        </pre>
+      )}
+    </div>
+  );
+}
+
+function SessionGraph({ graph }: { graph: any }) {
+  if (!graph || !graph.nodes || graph.nodes.length === 0) return null;
+
+  // Build parent->children map
+  const childrenMap: Record<string, string[]> = {};
+  const nodeMap: Record<string, any> = {};
+  const roots: string[] = [];
+
+  graph.nodes.forEach((n: any) => {
+    childrenMap[n.key] = [];
+    nodeMap[n.key] = n;
+  });
+  graph.edges.forEach((e: any) => {
+    if (childrenMap[e.from]) childrenMap[e.from].push(e.to);
+  });
+  graph.nodes.forEach((n: any) => {
+    const isChild = graph.edges.some((e: any) => e.to === n.key);
+    if (!isChild) roots.push(n.key);
+  });
+
+  function renderNode(key: string): any {
+    const n = nodeMap[key];
+    if (!n) return null;
+    const icon = n.status === 'completed' ? '\u2713' : '\u25CF';
+    const iconClass = n.status === 'completed' ? 'completed' : 'active';
+    const label = n.label || n.short_key || n.key;
+    const kids = childrenMap[key] || [];
+
+    return (
+      <li class="session-tree-node" key={key}>
+        <span class={`session-tree-icon ${iconClass}`}>{icon}</span>
+        <span class="session-tree-label">{label}</span>
+        <span class="session-tree-meta">turns={n.turn_count}</span>
+        {kids.length > 0 && (
+          <ul class="session-tree-children">
+            {kids.map(renderNode)}
+          </ul>
+        )}
+      </li>
+    );
+  }
+
+  return (
+    <div class="card glass">
+      <div class="card-title">Session Graph</div>
+      <ul class="session-tree">{roots.map(renderNode)}</ul>
+    </div>
+  );
+}
diff --git a/pkg/miniapp/frontend/src/components/work/work-tab.tsx b/pkg/miniapp/frontend/src/components/work/work-tab.tsx
new file mode 100644
index 000000000..0936f1357
--- /dev/null
+++ b/pkg/miniapp/frontend/src/components/work/work-tab.tsx
@@ -0,0 +1,75 @@
+import { useEffect, useState, useCallback } from 'preact/hooks';
+import type { SSEHook } from '../../hooks/use-sse';
+import { apiFetch } from '../../hooks/use-api';
+import { isFresh } from '../../utils';
+import { GitSection } from './git-section';
+import { SessionSection } from './session-section';
+
+interface WorkTabProps {
+  active: boolean;
+  sse: SSEHook;
+}
+
+export function WorkTab({ active, sse }: WorkTabProps) {
+  const [gitRepos, setGitRepos] = useState<any[] | null>(null);
+  const [worktrees, setWorktrees] = useState<any[]>([]);
+  const [sessions, setSessions] = useState<any[] | null>(null);
+  const [stats, setStats] = useState<any>(null);
+  const [graph, setGraph] = useState<any>(null);
+  const [context, setContext] = useState<any>(null);
+  const [loading, setLoading] = useState(true);
+
+  const loadAll = useCallback(async () => {
+    setLoading(true);
+    try {
+      const [gitData, wtData, sessionData, sessionsData, ctxData, graphData] =
+        await Promise.all([
+          apiFetch('/miniapp/api/git'),
+          apiFetch('/miniapp/api/worktrees').catch(() => []),
+          apiFetch('/miniapp/api/session'),
+          apiFetch('/miniapp/api/sessions').catch(() => []),
+          apiFetch('/miniapp/api/context').catch(() => null),
+          apiFetch('/miniapp/api/sessions/graph').catch(() => null),
+        ]);
+      setGitRepos(gitData);
+      setWorktrees(wtData);
+      setStats(sessionData);
+      setSessions(sessionsData);
+      setContext(ctxData);
+      setGraph(graphData);
+    } catch {}
+    setLoading(false);
+  }, []);
+
+  // SSE session updates
+  useEffect(() => {
+    if (sse.session) {
+      setSessions(sse.session.sessions || []);
+      setStats(sse.session.stats || null);
+      if (sse.session.graph) setGraph(sse.session.graph);
+    }
+  }, [sse.session]);
+
+  useEffect(() => {
+    if (sse.context) setContext(sse.context);
+  }, [sse.context]);
+
+  useEffect(() => {
+    if (active) loadAll();
+  }, [active]);
+
+  if (loading && !gitRepos && !sessions)
+    return <div class="loading">Loading...</div>;
+
+  return (
+    <>
+      <GitSection repos={gitRepos} worktrees={worktrees} onReload={loadAll} />
+      <SessionSection
+        sessions={sessions}
+        stats={stats}
+        graph={graph}
+        context={context}
+      />
+    </>
+  );
+}
diff --git a/pkg/miniapp/frontend/src/hooks/use-api.ts b/pkg/miniapp/frontend/src/hooks/use-api.ts
new file mode 100644
index 000000000..136e65e32
--- /dev/null
+++ b/pkg/miniapp/frontend/src/hooks/use-api.ts
@@ -0,0 +1,48 @@
+const API_BASE = location.origin;
+
+function getInitData(): string {
+  return window.Telegram?.WebApp?.initData || '';
+}
+
+export async function apiFetch<T = any>(path: string): Promise<T> {
+  const sep = path.includes('?') ? '&' : '?';
+  const res = await fetch(
+    API_BASE + path + sep + 'initData=' + encodeURIComponent(getInitData()),
+  );
+  if (!res.ok) throw new Error('API error: ' + res.status);
+  return res.json();
+}
+
+export async function apiPost<T = any>(
+  path: string,
+  body: Record<string, any>,
+): Promise<T> {
+  const sep = path.includes('?') ? '&' : '?';
+  const res = await fetch(
+    API_BASE + path + sep + 'initData=' + encodeURIComponent(getInitData()),
+    {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify(body),
+    },
+  );
+  if (!res.ok) {
+    let errMsg = 'API error: ' + res.status;
+    try {
+      const data = await res.json();
+      if (data.error) errMsg = data.error;
+    } catch {}
+    throw new Error(errMsg);
+  }
+  return res.json();
+}
+
+export async function sendCommand(cmd: string): Promise<boolean> {
+  if (!cmd.startsWith('/')) return false;
+  try {
+    await apiPost('/miniapp/api/command', { command: cmd });
+    return true;
+  } catch {
+    return false;
+  }
+}
diff --git a/pkg/miniapp/frontend/src/hooks/use-sse.ts b/pkg/miniapp/frontend/src/hooks/use-sse.ts
new file mode 100644
index 000000000..58ee0ad90
--- /dev/null
+++ b/pkg/miniapp/frontend/src/hooks/use-sse.ts
@@ -0,0 +1,85 @@
+import { useEffect, useRef, useState } from 'preact/hooks';
+
+export interface SSEData {
+  plan: any | null;
+  session: any | null;
+  skills: any[] | null;
+  dev: any | null;
+  context: any | null;
+  prompt: string | null;
+}
+
+export interface SSEHook extends SSEData {
+  lastUpdate: Record<string, number>;
+}
+
+export function useSSE(): SSEHook {
+  const [data, setData] = useState<SSEData>({
+    plan: null,
+    session: null,
+    skills: null,
+    dev: null,
+    context: null,
+    prompt: null,
+  });
+  const lastUpdate = useRef<Record<string, number>>({});
+
+  useEffect(() => {
+    const initData = window.Telegram?.WebApp?.initData || '';
+    const url =
+      location.origin +
+      '/miniapp/api/events?initData=' +
+      encodeURIComponent(initData);
+    const es = new EventSource(url);
+
+    es.addEventListener('plan', (e: any) => {
+      try {
+        const d = JSON.parse(e.data);
+        lastUpdate.current.plan = Date.now();
+        setData((prev) => ({ ...prev, plan: d }));
+      } catch {}
+    });
+
+    es.addEventListener('session', (e: any) => {
+      try {
+        const d = JSON.parse(e.data);
+        lastUpdate.current.session = Date.now();
+        setData((prev) => ({ ...prev, session: d }));
+      } catch {}
+    });
+
+    es.addEventListener('skills', (e: any) => {
+      try {
+        const d = JSON.parse(e.data);
+        lastUpdate.current.skills = Date.now();
+        setData((prev) => ({ ...prev, skills: d }));
+      } catch {}
+    });
+
+    es.addEventListener('dev', (e: any) => {
+      try {
+        const d = JSON.parse(e.data);
+        lastUpdate.current.dev = Date.now();
+        setData((prev) => ({ ...prev, dev: d }));
+      } catch {}
+    });
+
+    es.addEventListener('context', (e: any) => {
+      try {
+        const d = JSON.parse(e.data);
+        setData((prev) => ({ ...prev, context: d }));
+      } catch {}
+    });
+
+    es.addEventListener('prompt', (e: any) => {
+      try {
+        const d = JSON.parse(e.data);
+        setData((prev) => ({ ...prev, prompt: d.prompt || null }));
+      } catch {}
+    });
+
+    return () => es.close();
+  }, []);
+
+  return { ...data, lastUpdate: lastUpdate.current };
+}
diff --git a/pkg/miniapp/frontend/src/index.tsx b/pkg/miniapp/frontend/src/index.tsx
new file mode 100644
index 000000000..cd8196cba
--- /dev/null
+++ b/pkg/miniapp/frontend/src/index.tsx
@@ -0,0 +1,22 @@
+import './styles.css';
+import 'highlight.js/styles/github-dark.min.css';
+import { render } from 'preact';
+import { App } from './app';
+
+declare global {
+  interface Window {
+    Telegram: { WebApp: any };
+    ORCH_ENABLED: boolean;
+    MAP_POSITIONS: any;
+    loadMapAsset: (cb: () => void) => void;
+    drawMap: (ctx: CanvasRenderingContext2D) => void;
+  }
+}
+
+const tg = window.Telegram.WebApp;
+tg.ready();
+
+const root = document.getElementById('app');
+if (root) {
+  render(<App />, root);
+}
diff --git a/pkg/miniapp/frontend/src/markdown.ts b/pkg/miniapp/frontend/src/markdown.ts
new file mode 100644
index 000000000..6193402ce
--- /dev/null
+++ b/pkg/miniapp/frontend/src/markdown.ts
@@ -0,0 +1,47 @@
+import { marked } from 'marked';
+import hljs from 'highlight.js/lib/core';
+import javascript from 'highlight.js/lib/languages/javascript';
+import python from 'highlight.js/lib/languages/python';
+import go from 'highlight.js/lib/languages/go';
+import bash from 'highlight.js/lib/languages/bash';
+import json from 'highlight.js/lib/languages/json';
+import yaml from 'highlight.js/lib/languages/yaml';
+import typescript from 'highlight.js/lib/languages/typescript';
+import sql from 'highlight.js/lib/languages/sql';
+import xml from 'highlight.js/lib/languages/xml';
+import css from 'highlight.js/lib/languages/css';
+import markdown from 'highlight.js/lib/languages/markdown';
+
+hljs.registerLanguage('javascript', javascript);
+hljs.registerLanguage('js', javascript);
+hljs.registerLanguage('python', python);
+hljs.registerLanguage('py', python);
+hljs.registerLanguage('go', go);
+hljs.registerLanguage('bash', bash);
+hljs.registerLanguage('sh', bash);
+hljs.registerLanguage('json', json);
+hljs.registerLanguage('yaml', yaml);
+hljs.registerLanguage('yml', yaml);
+hljs.registerLanguage('typescript', typescript);
+hljs.registerLanguage('ts', typescript);
+hljs.registerLanguage('sql', sql);
+hljs.registerLanguage('xml', xml);
+hljs.registerLanguage('html', xml);
+hljs.registerLanguage('css', css);
+hljs.registerLanguage('markdown', markdown);
+hljs.registerLanguage('md', markdown);
+
+marked.setOptions({
+  highlight: function (code: string, lang: string) {
+    if (lang && hljs.getLanguage(lang)) {
+      return hljs.highlight(code, { language: lang }).value;
+    }
+    return hljs.highlightAuto(code).value;
+  },
+  breaks: true,
+  gfm: true,
+});
+
+export function renderMarkdown(text: string): string {
+  return marked.parse(text) as string;
+}
diff --git a/pkg/miniapp/frontend/src/styles.css b/pkg/miniapp/frontend/src/styles.css
index d4d0fa026..3ececd55a 100644
--- a/pkg/miniapp/frontend/src/styles.css
+++ b/pkg/miniapp/frontend/src/styles.css
@@ -76,7 +76,7 @@
     top: 2px;
     bottom: 2px;
     left: 2px;
-    width: calc(100% / var(--tab-count, 8) - 2px);
+    width: calc(100% / var(--tab-count, 4) - 2px);
     border-radius: 8px;
     background: var(--tab-pill-bg);
     box-shadow: 0 0.5px 2px rgba(0,0,0,0.12), 0 0.5px 1px rgba(0,0,0,0.08);
diff --git a/pkg/miniapp/frontend/src/utils.ts b/pkg/miniapp/frontend/src/utils.ts
new file mode 100644
index 000000000..6af5c8ca2
--- /dev/null
+++ b/pkg/miniapp/frontend/src/utils.ts
@@ -0,0 +1,53 @@
+export function escapeHtml(s: string | null | undefined): string {
+  if (!s) return '';
+  return s
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;');
+}
+
+export function escapeAttr(s: string | null | undefined): string {
+  if (!s) return '';
+  return s
+    .replace(/&/g, '&amp;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#39;');
+}
+
+export function formatAge(sec: number): string {
+  if (sec < 60) return sec + 's ago';
+  if (sec < 3600) return Math.floor(sec / 60) + 'm ago';
+  return Math.floor(sec / 3600) + 'h ago';
+}
+
+export function formatTokens(n: number): string {
+  if (n >= 1000000) return (n / 1000000).toFixed(1) + 'M';
+  if (n >= 1000) return (n / 1000).toFixed(1) + 'K';
+  return String(n);
+}
+
+export function flashSent(el: HTMLElement) {
+  el.classList.add('sent');
+  setTimeout(() => el.classList.remove('sent'), 600);
+}
+
+export function formatSessionLabel(key: string): string {
+  if (key.startsWith('heartbeat:')) return 'Heartbeat';
+  const parts = key.split(':');
+  if (parts.length >= 4) {
+    const channel = parts[2]; // "telegram"
+    const scope = parts[3]; // "group" or "dm"
+    return capitalize(channel) + ' ' + capitalize(scope);
+  }
+  if (parts.length > 2) return parts.slice(2).join(':');
+  return key;
+}
+
+function capitalize(s: string): string {
+  return s.charAt(0).toUpperCase() + s.slice(1);
+}
+
+export function isFresh(lastUpdate: Record<string, number>, key: string, ms = 5000): boolean {
+  return !!lastUpdate[key] && Date.now() - lastUpdate[key] < ms;
+}
diff --git a/pkg/miniapp/frontend/tsconfig.json b/pkg/miniapp/frontend/tsconfig.json
new file mode 100644
index 000000000..3bef4b013
--- /dev/null
+++ b/pkg/miniapp/frontend/tsconfig.json
@@ -0,0 +1,14 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "jsx": "react-jsx",
+    "jsxImportSource": "preact",
+    "strict": true,
+    "noEmit": true,
+    "skipLibCheck": true,
+    "allowJs": true
+  },
+  "include": ["src"]
+}
diff --git a/pkg/miniapp/frontend/vitest.config.mjs b/pkg/miniapp/frontend/vitest.config.mjs
index 67a3bd7ac..21dd68992 100644
--- a/pkg/miniapp/frontend/vitest.config.mjs
+++ b/pkg/miniapp/frontend/vitest.config.mjs
@@ -3,6 +3,6 @@ import { defineConfig } from 'vitest/config';
 export default defineConfig({
   test: {
     environment: 'happy-dom',
-    include: ['src/**/*.test.js'],
+    include: ['src/**/*.test.{js,ts,tsx}'],
   },
 });
diff --git a/pkg/miniapp/static/dist/app.css b/pkg/miniapp/static/dist/app.css
index f4b1900b1..1233fd676 100644
--- a/pkg/miniapp/static/dist/app.css
+++ b/pkg/miniapp/static/dist/app.css
@@ -76,7 +76,7 @@ body {
 
 .tab-indicator {
   position: absolute;
-  width: calc(100% / var(--tab-count, 8)  - 2px);
+  width: calc(100% / var(--tab-count, 4)  - 2px);
   background: var(--tab-pill-bg);
   z-index: 0;
   border-radius: 8px;
diff --git a/pkg/miniapp/static/dist/app.js b/pkg/miniapp/static/dist/app.js
index 67d8bcb02..c703fdf92 100644
--- a/pkg/miniapp/static/dist/app.js
+++ b/pkg/miniapp/static/dist/app.js
@@ -92,7 +92,7 @@
         const pieces = name.split(".");
         return [
           `${prefix}${pieces.shift()}`,
-          ...pieces.map((x2, i) => `${x2}${"_".repeat(i + 1)}`)
+          ...pieces.map((x3, i3) => `${x3}${"_".repeat(i3 + 1)}`)
         ].join(" ");
       }
       return `${prefix}${name}`;
@@ -240,7 +240,7 @@
       return concat("(?:", re2, ")?");
     }
     function concat(...args) {
-      const joined = args.map((x2) => source(x2)).join("");
+      const joined = args.map((x3) => source(x3)).join("");
       return joined;
     }
     function stripOptionsFromArgs(args) {
@@ -254,7 +254,7 @@
     }
     function either(...args) {
       const opts = stripOptionsFromArgs(args);
-      const joined = "(" + (opts.capture ? "" : "?:") + args.map((x2) => source(x2)).join("|") + ")";
+      const joined = "(" + (opts.capture ? "" : "?:") + args.map((x3) => source(x3)).join("|") + ")";
       return joined;
     }
     function countMatchGroups(re2) {
@@ -309,8 +309,8 @@
         begin: beginShebang,
         end: /$/,
         relevance: 0,
-        "on:begin": (m2, resp) => {
-          if (m2.index !== 0)
+        "on:begin": (m4, resp) => {
+          if (m4.index !== 0)
             resp.ignoreMatch();
         }
       }, opts);
@@ -404,11 +404,11 @@
     };
     var END_SAME_AS_BEGIN = function(mode) {
       return Object.assign(mode, {
-        "on:begin": (m2, resp) => {
-          resp.data._beginMatch = m2[1];
+        "on:begin": (m4, resp) => {
+          resp.data._beginMatch = m4[1];
         },
-        "on:end": (m2, resp) => {
-          if (resp.data._beginMatch !== m2[1])
+        "on:end": (m4, resp) => {
+          if (resp.data._beginMatch !== m4[1])
             resp.ignoreMatch();
         }
       });
@@ -529,7 +529,7 @@
       return compiledKeywords;
       function compileList(scopeName2, keywordList) {
         if (caseInsensitive) {
-          keywordList = keywordList.map((x2) => x2.toLowerCase());
+          keywordList = keywordList.map((x3) => x3.toLowerCase());
         }
         keywordList.forEach(function(keyword) {
           const pair = keyword.split("|");
@@ -565,10 +565,10 @@
       const scopeNames = mode[key];
       const emit = {};
       const positions = {};
-      for (let i = 1;i <= regexes.length; i++) {
-        positions[i + offset] = scopeNames[i];
-        emit[i + offset] = true;
-        offset += countMatchGroups(regexes[i - 1]);
+      for (let i3 = 1;i3 <= regexes.length; i3++) {
+        positions[i3 + offset] = scopeNames[i3];
+        emit[i3 + offset] = true;
+        offset += countMatchGroups(regexes[i3 - 1]);
       }
       mode[key] = positions;
       mode[key]._emit = emit;
@@ -645,15 +645,15 @@
           this.matcherRe = langRe(_rewriteBackreferences(terminators, { joinWith: "|" }), true);
           this.lastIndex = 0;
         }
-        exec(s) {
+        exec(s3) {
           this.matcherRe.lastIndex = this.lastIndex;
-          const match = this.matcherRe.exec(s);
+          const match = this.matcherRe.exec(s3);
           if (!match) {
             return null;
           }
-          const i = match.findIndex((el, i2) => i2 > 0 && el !== undefined);
-          const matchData = this.matchIndexes[i];
-          match.splice(0, i);
+          const i3 = match.findIndex((el, i4) => i4 > 0 && el !== undefined);
+          const matchData = this.matchIndexes[i3];
+          match.splice(0, i3);
           return Object.assign(match, matchData);
         }
       }
@@ -686,17 +686,17 @@
           if (opts.type === "begin")
             this.count++;
         }
-        exec(s) {
-          const m2 = this.getMatcher(this.regexIndex);
-          m2.lastIndex = this.lastIndex;
-          let result = m2.exec(s);
+        exec(s3) {
+          const m4 = this.getMatcher(this.regexIndex);
+          m4.lastIndex = this.lastIndex;
+          let result = m4.exec(s3);
           if (this.resumingScanAtSamePosition()) {
             if (result && result.index === this.lastIndex)
               ;
             else {
               const m22 = this.getMatcher(0);
               m22.lastIndex = this.lastIndex + 1;
-              result = m22.exec(s);
+              result = m22.exec(s3);
             }
           }
           if (result) {
@@ -765,11 +765,11 @@
           cmode.illegalRe = langRe(mode.illegal);
         if (!mode.contains)
           mode.contains = [];
-        mode.contains = [].concat(...mode.contains.map(function(c) {
-          return expandOrCloneMode(c === "self" ? mode : c);
+        mode.contains = [].concat(...mode.contains.map(function(c3) {
+          return expandOrCloneMode(c3 === "self" ? mode : c3);
         }));
-        mode.contains.forEach(function(c) {
-          compileMode(c, cmode);
+        mode.contains.forEach(function(c3) {
+          compileMode(c3, cmode);
         });
         if (mode.starts) {
           compileMode(mode.starts, parent);
@@ -956,15 +956,15 @@ https://github.com/highlightjs/highlight.js/issues/2277`);
           emitter.endScope();
         }
         function emitMultiClass(scope, match) {
-          let i = 1;
+          let i3 = 1;
           const max = match.length - 1;
-          while (i <= max) {
-            if (!scope._emit[i]) {
-              i++;
+          while (i3 <= max) {
+            if (!scope._emit[i3]) {
+              i3++;
               continue;
             }
-            const klass = language.classNameAliases[scope[i]] || scope[i];
-            const text = match[i];
+            const klass = language.classNameAliases[scope[i3]] || scope[i3];
+            const text = match[i3];
             if (klass) {
               emitKeyword(text, klass);
             } else {
@@ -972,7 +972,7 @@ https://github.com/highlightjs/highlight.js/issues/2277`);
               processKeywords();
               modeBuffer = "";
             }
-            i++;
+            i3++;
           }
         }
         function startNewMode(mode, match) {
@@ -1232,13 +1232,13 @@ https://github.com/highlightjs/highlight.js/issues/2277`);
         const plaintext = justTextHighlightResult(code);
         const results = languageSubset.filter(getLanguage).filter(autoDetection).map((name) => _highlight(name, code, false));
         results.unshift(plaintext);
-        const sorted = results.sort((a, b2) => {
-          if (a.relevance !== b2.relevance)
-            return b2.relevance - a.relevance;
-          if (a.language && b2.language) {
-            if (getLanguage(a.language).supersetOf === b2.language) {
+        const sorted = results.sort((a3, b2) => {
+          if (a3.relevance !== b2.relevance)
+            return b2.relevance - a3.relevance;
+          if (a3.language && b2.language) {
+            if (getLanguage(a3.language).supersetOf === b2.language) {
               return 1;
-            } else if (getLanguage(b2.language).supersetOf === a.language) {
+            } else if (getLanguage(b2.language).supersetOf === a3.language) {
               return -1;
             }
           }
@@ -1452,21 +1452,623 @@ https://github.com/highlightjs/highlight.js/issues/2277`);
     highlight.default = highlight;
   });
 
+  // node_modules/preact/dist/preact.module.js
+  var n;
+  var l;
+  var u;
+  var t;
+  var i;
+  var r;
+  var o;
+  var e;
+  var f;
+  var c;
+  var s;
+  var a;
+  var h;
+  var p = {};
+  var v = [];
+  var y = /acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i;
+  var d = Array.isArray;
+  function w(n2, l2) {
+    for (var u2 in l2)
+      n2[u2] = l2[u2];
+    return n2;
+  }
+  function g(n2) {
+    n2 && n2.parentNode && n2.parentNode.removeChild(n2);
+  }
+  function _(l2, u2, t2) {
+    var i2, r2, o2, e2 = {};
+    for (o2 in u2)
+      o2 == "key" ? i2 = u2[o2] : o2 == "ref" ? r2 = u2[o2] : e2[o2] = u2[o2];
+    if (arguments.length > 2 && (e2.children = arguments.length > 3 ? n.call(arguments, 2) : t2), typeof l2 == "function" && l2.defaultProps != null)
+      for (o2 in l2.defaultProps)
+        e2[o2] === undefined && (e2[o2] = l2.defaultProps[o2]);
+    return m(l2, e2, i2, r2, null);
+  }
+  function m(n2, t2, i2, r2, o2) {
+    var e2 = { type: n2, props: t2, key: i2, ref: r2, __k: null, __: null, __b: 0, __e: null, __c: null, constructor: undefined, __v: o2 == null ? ++u : o2, __i: -1, __u: 0 };
+    return o2 == null && l.vnode != null && l.vnode(e2), e2;
+  }
+  function k(n2) {
+    return n2.children;
+  }
+  function x(n2, l2) {
+    this.props = n2, this.context = l2;
+  }
+  function S(n2, l2) {
+    if (l2 == null)
+      return n2.__ ? S(n2.__, n2.__i + 1) : null;
+    for (var u2;l2 < n2.__k.length; l2++)
+      if ((u2 = n2.__k[l2]) != null && u2.__e != null)
+        return u2.__e;
+    return typeof n2.type == "function" ? S(n2) : null;
+  }
+  function C(n2) {
+    if (n2.__P && n2.__d) {
+      var u2 = n2.__v, t2 = u2.__e, i2 = [], r2 = [], o2 = w({}, u2);
+      o2.__v = u2.__v + 1, l.vnode && l.vnode(o2), z(n2.__P, o2, u2, n2.__n, n2.__P.namespaceURI, 32 & u2.__u ? [t2] : null, i2, t2 == null ? S(u2) : t2, !!(32 & u2.__u), r2), o2.__v = u2.__v, o2.__.__k[o2.__i] = o2, V(i2, o2, r2), u2.__e = u2.__ = null, o2.__e != t2 && M(o2);
+    }
+  }
+  function M(n2) {
+    if ((n2 = n2.__) != null && n2.__c != null)
+      return n2.__e = n2.__c.base = null, n2.__k.some(function(l2) {
+        if (l2 != null && l2.__e != null)
+          return n2.__e = n2.__c.base = l2.__e;
+      }), M(n2);
+  }
+  function $(n2) {
+    (!n2.__d && (n2.__d = true) && i.push(n2) && !I.__r++ || r != l.debounceRendering) && ((r = l.debounceRendering) || o)(I);
+  }
+  function I() {
+    try {
+      for (var n2, l2 = 1;i.length; )
+        i.length > l2 && i.sort(e), n2 = i.shift(), l2 = i.length, C(n2);
+    } finally {
+      i.length = I.__r = 0;
+    }
+  }
+  function P(n2, l2, u2, t2, i2, r2, o2, e2, f2, c2, s2) {
+    var a2, h2, y2, d2, w2, g2, _2, m2 = t2 && t2.__k || v, b = l2.length;
+    for (f2 = A(u2, l2, m2, f2, b), a2 = 0;a2 < b; a2++)
+      (y2 = u2.__k[a2]) != null && (h2 = y2.__i != -1 && m2[y2.__i] || p, y2.__i = a2, g2 = z(n2, y2, h2, i2, r2, o2, e2, f2, c2, s2), d2 = y2.__e, y2.ref && h2.ref != y2.ref && (h2.ref && D(h2.ref, null, y2), s2.push(y2.ref, y2.__c || d2, y2)), w2 == null && d2 != null && (w2 = d2), (_2 = !!(4 & y2.__u)) || h2.__k === y2.__k ? f2 = H(y2, f2, n2, _2) : typeof y2.type == "function" && g2 !== undefined ? f2 = g2 : d2 && (f2 = d2.nextSibling), y2.__u &= -7);
+    return u2.__e = w2, f2;
+  }
+  function A(n2, l2, u2, t2, i2) {
+    var r2, o2, e2, f2, c2, s2 = u2.length, a2 = s2, h2 = 0;
+    for (n2.__k = new Array(i2), r2 = 0;r2 < i2; r2++)
+      (o2 = l2[r2]) != null && typeof o2 != "boolean" && typeof o2 != "function" ? (typeof o2 == "string" || typeof o2 == "number" || typeof o2 == "bigint" || o2.constructor == String ? o2 = n2.__k[r2] = m(null, o2, null, null, null) : d(o2) ? o2 = n2.__k[r2] = m(k, { children: o2 }, null, null, null) : o2.constructor === undefined && o2.__b > 0 ? o2 = n2.__k[r2] = m(o2.type, o2.props, o2.key, o2.ref ? o2.ref : null, o2.__v) : n2.__k[r2] = o2, f2 = r2 + h2, o2.__ = n2, o2.__b = n2.__b + 1, e2 = null, (c2 = o2.__i = T(o2, u2, f2, a2)) != -1 && (a2--, (e2 = u2[c2]) && (e2.__u |= 2)), e2 == null || e2.__v == null ? (c2 == -1 && (i2 > s2 ? h2-- : i2 < s2 && h2++), typeof o2.type != "function" && (o2.__u |= 4)) : c2 != f2 && (c2 == f2 - 1 ? h2-- : c2 == f2 + 1 ? h2++ : (c2 > f2 ? h2-- : h2++, o2.__u |= 4))) : n2.__k[r2] = null;
+    if (a2)
+      for (r2 = 0;r2 < s2; r2++)
+        (e2 = u2[r2]) != null && (2 & e2.__u) == 0 && (e2.__e == t2 && (t2 = S(e2)), E(e2, e2));
+    return t2;
+  }
+  function H(n2, l2, u2, t2) {
+    var i2, r2;
+    if (typeof n2.type == "function") {
+      for (i2 = n2.__k, r2 = 0;i2 && r2 < i2.length; r2++)
+        i2[r2] && (i2[r2].__ = n2, l2 = H(i2[r2], l2, u2, t2));
+      return l2;
+    }
+    n2.__e != l2 && (t2 && (l2 && n2.type && !l2.parentNode && (l2 = S(n2)), u2.insertBefore(n2.__e, l2 || null)), l2 = n2.__e);
+    do {
+      l2 = l2 && l2.nextSibling;
+    } while (l2 != null && l2.nodeType == 8);
+    return l2;
+  }
+  function T(n2, l2, u2, t2) {
+    var i2, r2, o2, e2 = n2.key, f2 = n2.type, c2 = l2[u2], s2 = c2 != null && (2 & c2.__u) == 0;
+    if (c2 === null && e2 == null || s2 && e2 == c2.key && f2 == c2.type)
+      return u2;
+    if (t2 > (s2 ? 1 : 0)) {
+      for (i2 = u2 - 1, r2 = u2 + 1;i2 >= 0 || r2 < l2.length; )
+        if ((c2 = l2[o2 = i2 >= 0 ? i2-- : r2++]) != null && (2 & c2.__u) == 0 && e2 == c2.key && f2 == c2.type)
+          return o2;
+    }
+    return -1;
+  }
+  function j(n2, l2, u2) {
+    l2[0] == "-" ? n2.setProperty(l2, u2 == null ? "" : u2) : n2[l2] = u2 == null ? "" : typeof u2 != "number" || y.test(l2) ? u2 : u2 + "px";
+  }
+  function F(n2, l2, u2, t2, i2) {
+    var r2, o2;
+    n:
+      if (l2 == "style")
+        if (typeof u2 == "string")
+          n2.style.cssText = u2;
+        else {
+          if (typeof t2 == "string" && (n2.style.cssText = t2 = ""), t2)
+            for (l2 in t2)
+              u2 && l2 in u2 || j(n2.style, l2, "");
+          if (u2)
+            for (l2 in u2)
+              t2 && u2[l2] == t2[l2] || j(n2.style, l2, u2[l2]);
+        }
+      else if (l2[0] == "o" && l2[1] == "n")
+        r2 = l2 != (l2 = l2.replace(f, "$1")), o2 = l2.toLowerCase(), l2 = o2 in n2 || l2 == "onFocusOut" || l2 == "onFocusIn" ? o2.slice(2) : l2.slice(2), n2.l || (n2.l = {}), n2.l[l2 + r2] = u2, u2 ? t2 ? u2.u = t2.u : (u2.u = c, n2.addEventListener(l2, r2 ? a : s, r2)) : n2.removeEventListener(l2, r2 ? a : s, r2);
+      else {
+        if (i2 == "http://www.w3.org/2000/svg")
+          l2 = l2.replace(/xlink(H|:h)/, "h").replace(/sName$/, "s");
+        else if (l2 != "width" && l2 != "height" && l2 != "href" && l2 != "list" && l2 != "form" && l2 != "tabIndex" && l2 != "download" && l2 != "rowSpan" && l2 != "colSpan" && l2 != "role" && l2 != "popover" && l2 in n2)
+          try {
+            n2[l2] = u2 == null ? "" : u2;
+            break n;
+          } catch (n3) {}
+        typeof u2 == "function" || (u2 == null || u2 === false && l2[4] != "-" ? n2.removeAttribute(l2) : n2.setAttribute(l2, l2 == "popover" && u2 == 1 ? "" : u2));
+      }
+  }
+  function O(n2) {
+    return function(u2) {
+      if (this.l) {
+        var t2 = this.l[u2.type + n2];
+        if (u2.t == null)
+          u2.t = c++;
+        else if (u2.t < t2.u)
+          return;
+        return t2(l.event ? l.event(u2) : u2);
+      }
+    };
+  }
+  function z(n2, u2, t2, i2, r2, o2, e2, f2, c2, s2) {
+    var a2, h2, p2, y2, _2, m2, b, S2, C2, M2, $2, I2, A2, H2, L, T2 = u2.type;
+    if (u2.constructor !== undefined)
+      return null;
+    128 & t2.__u && (c2 = !!(32 & t2.__u), o2 = [f2 = u2.__e = t2.__e]), (a2 = l.__b) && a2(u2);
+    n:
+      if (typeof T2 == "function")
+        try {
+          if (S2 = u2.props, C2 = T2.prototype && T2.prototype.render, M2 = (a2 = T2.contextType) && i2[a2.__c], $2 = a2 ? M2 ? M2.props.value : a2.__ : i2, t2.__c ? b = (h2 = u2.__c = t2.__c).__ = h2.__E : (C2 ? u2.__c = h2 = new T2(S2, $2) : (u2.__c = h2 = new x(S2, $2), h2.constructor = T2, h2.render = G), M2 && M2.sub(h2), h2.state || (h2.state = {}), h2.__n = i2, p2 = h2.__d = true, h2.__h = [], h2._sb = []), C2 && h2.__s == null && (h2.__s = h2.state), C2 && T2.getDerivedStateFromProps != null && (h2.__s == h2.state && (h2.__s = w({}, h2.__s)), w(h2.__s, T2.getDerivedStateFromProps(S2, h2.__s))), y2 = h2.props, _2 = h2.state, h2.__v = u2, p2)
+            C2 && T2.getDerivedStateFromProps == null && h2.componentWillMount != null && h2.componentWillMount(), C2 && h2.componentDidMount != null && h2.__h.push(h2.componentDidMount);
+          else {
+            if (C2 && T2.getDerivedStateFromProps == null && S2 !== y2 && h2.componentWillReceiveProps != null && h2.componentWillReceiveProps(S2, $2), u2.__v == t2.__v || !h2.__e && h2.shouldComponentUpdate != null && h2.shouldComponentUpdate(S2, h2.__s, $2) === false) {
+              u2.__v != t2.__v && (h2.props = S2, h2.state = h2.__s, h2.__d = false), u2.__e = t2.__e, u2.__k = t2.__k, u2.__k.some(function(n3) {
+                n3 && (n3.__ = u2);
+              }), v.push.apply(h2.__h, h2._sb), h2._sb = [], h2.__h.length && e2.push(h2);
+              break n;
+            }
+            h2.componentWillUpdate != null && h2.componentWillUpdate(S2, h2.__s, $2), C2 && h2.componentDidUpdate != null && h2.__h.push(function() {
+              h2.componentDidUpdate(y2, _2, m2);
+            });
+          }
+          if (h2.context = $2, h2.props = S2, h2.__P = n2, h2.__e = false, I2 = l.__r, A2 = 0, C2)
+            h2.state = h2.__s, h2.__d = false, I2 && I2(u2), a2 = h2.render(h2.props, h2.state, h2.context), v.push.apply(h2.__h, h2._sb), h2._sb = [];
+          else
+            do {
+              h2.__d = false, I2 && I2(u2), a2 = h2.render(h2.props, h2.state, h2.context), h2.state = h2.__s;
+            } while (h2.__d && ++A2 < 25);
+          h2.state = h2.__s, h2.getChildContext != null && (i2 = w(w({}, i2), h2.getChildContext())), C2 && !p2 && h2.getSnapshotBeforeUpdate != null && (m2 = h2.getSnapshotBeforeUpdate(y2, _2)), H2 = a2 != null && a2.type === k && a2.key == null ? q(a2.props.children) : a2, f2 = P(n2, d(H2) ? H2 : [H2], u2, t2, i2, r2, o2, e2, f2, c2, s2), h2.base = u2.__e, u2.__u &= -161, h2.__h.length && e2.push(h2), b && (h2.__E = h2.__ = null);
+        } catch (n3) {
+          if (u2.__v = null, c2 || o2 != null)
+            if (n3.then) {
+              for (u2.__u |= c2 ? 160 : 128;f2 && f2.nodeType == 8 && f2.nextSibling; )
+                f2 = f2.nextSibling;
+              o2[o2.indexOf(f2)] = null, u2.__e = f2;
+            } else {
+              for (L = o2.length;L--; )
+                g(o2[L]);
+              N(u2);
+            }
+          else
+            u2.__e = t2.__e, u2.__k = t2.__k, n3.then || N(u2);
+          l.__e(n3, u2, t2);
+        }
+      else
+        o2 == null && u2.__v == t2.__v ? (u2.__k = t2.__k, u2.__e = t2.__e) : f2 = u2.__e = B(t2.__e, u2, t2, i2, r2, o2, e2, c2, s2);
+    return (a2 = l.diffed) && a2(u2), 128 & u2.__u ? undefined : f2;
+  }
+  function N(n2) {
+    n2 && (n2.__c && (n2.__c.__e = true), n2.__k && n2.__k.some(N));
+  }
+  function V(n2, u2, t2) {
+    for (var i2 = 0;i2 < t2.length; i2++)
+      D(t2[i2], t2[++i2], t2[++i2]);
+    l.__c && l.__c(u2, n2), n2.some(function(u3) {
+      try {
+        n2 = u3.__h, u3.__h = [], n2.some(function(n3) {
+          n3.call(u3);
+        });
+      } catch (n3) {
+        l.__e(n3, u3.__v);
+      }
+    });
+  }
+  function q(n2) {
+    return typeof n2 != "object" || n2 == null || n2.__b > 0 ? n2 : d(n2) ? n2.map(q) : w({}, n2);
+  }
+  function B(u2, t2, i2, r2, o2, e2, f2, c2, s2) {
+    var a2, h2, v2, y2, w2, _2, m2, b = i2.props || p, k2 = t2.props, x2 = t2.type;
+    if (x2 == "svg" ? o2 = "http://www.w3.org/2000/svg" : x2 == "math" ? o2 = "http://www.w3.org/1998/Math/MathML" : o2 || (o2 = "http://www.w3.org/1999/xhtml"), e2 != null) {
+      for (a2 = 0;a2 < e2.length; a2++)
+        if ((w2 = e2[a2]) && "setAttribute" in w2 == !!x2 && (x2 ? w2.localName == x2 : w2.nodeType == 3)) {
+          u2 = w2, e2[a2] = null;
+          break;
+        }
+    }
+    if (u2 == null) {
+      if (x2 == null)
+        return document.createTextNode(k2);
+      u2 = document.createElementNS(o2, x2, k2.is && k2), c2 && (l.__m && l.__m(t2, e2), c2 = false), e2 = null;
+    }
+    if (x2 == null)
+      b === k2 || c2 && u2.data == k2 || (u2.data = k2);
+    else {
+      if (e2 = e2 && n.call(u2.childNodes), !c2 && e2 != null)
+        for (b = {}, a2 = 0;a2 < u2.attributes.length; a2++)
+          b[(w2 = u2.attributes[a2]).name] = w2.value;
+      for (a2 in b)
+        w2 = b[a2], a2 == "dangerouslySetInnerHTML" ? v2 = w2 : a2 == "children" || (a2 in k2) || a2 == "value" && ("defaultValue" in k2) || a2 == "checked" && ("defaultChecked" in k2) || F(u2, a2, null, w2, o2);
+      for (a2 in k2)
+        w2 = k2[a2], a2 == "children" ? y2 = w2 : a2 == "dangerouslySetInnerHTML" ? h2 = w2 : a2 == "value" ? _2 = w2 : a2 == "checked" ? m2 = w2 : c2 && typeof w2 != "function" || b[a2] === w2 || F(u2, a2, w2, b[a2], o2);
+      if (h2)
+        c2 || v2 && (h2.__html == v2.__html || h2.__html == u2.innerHTML) || (u2.innerHTML = h2.__html), t2.__k = [];
+      else if (v2 && (u2.innerHTML = ""), P(t2.type == "template" ? u2.content : u2, d(y2) ? y2 : [y2], t2, i2, r2, x2 == "foreignObject" ? "http://www.w3.org/1999/xhtml" : o2, e2, f2, e2 ? e2[0] : i2.__k && S(i2, 0), c2, s2), e2 != null)
+        for (a2 = e2.length;a2--; )
+          g(e2[a2]);
+      c2 || (a2 = "value", x2 == "progress" && _2 == null ? u2.removeAttribute("value") : _2 != null && (_2 !== u2[a2] || x2 == "progress" && !_2 || x2 == "option" && _2 != b[a2]) && F(u2, a2, _2, b[a2], o2), a2 = "checked", m2 != null && m2 != u2[a2] && F(u2, a2, m2, b[a2], o2));
+    }
+    return u2;
+  }
+  function D(n2, u2, t2) {
+    try {
+      if (typeof n2 == "function") {
+        var i2 = typeof n2.__u == "function";
+        i2 && n2.__u(), i2 && u2 == null || (n2.__u = n2(u2));
+      } else
+        n2.current = u2;
+    } catch (n3) {
+      l.__e(n3, t2);
+    }
+  }
+  function E(n2, u2, t2) {
+    var i2, r2;
+    if (l.unmount && l.unmount(n2), (i2 = n2.ref) && (i2.current && i2.current != n2.__e || D(i2, null, u2)), (i2 = n2.__c) != null) {
+      if (i2.componentWillUnmount)
+        try {
+          i2.componentWillUnmount();
+        } catch (n3) {
+          l.__e(n3, u2);
+        }
+      i2.base = i2.__P = null;
+    }
+    if (i2 = n2.__k)
+      for (r2 = 0;r2 < i2.length; r2++)
+        i2[r2] && E(i2[r2], u2, t2 || typeof n2.type != "function");
+    t2 || g(n2.__e), n2.__c = n2.__ = n2.__e = undefined;
+  }
+  function G(n2, l2, u2) {
+    return this.constructor(n2, u2);
+  }
+  function J(u2, t2, i2) {
+    var r2, o2, e2, f2;
+    t2 == document && (t2 = document.documentElement), l.__ && l.__(u2, t2), o2 = (r2 = typeof i2 == "function") ? null : i2 && i2.__k || t2.__k, e2 = [], f2 = [], z(t2, u2 = (!r2 && i2 || t2).__k = _(k, null, [u2]), o2 || p, p, t2.namespaceURI, !r2 && i2 ? [i2] : o2 ? null : t2.firstChild ? n.call(t2.childNodes) : null, e2, !r2 && i2 ? i2 : o2 ? o2.__e : t2.firstChild, r2, f2), V(e2, u2, f2);
+  }
+  n = v.slice, l = { __e: function(n2, l2, u2, t2) {
+    for (var i2, r2, o2;l2 = l2.__; )
+      if ((i2 = l2.__c) && !i2.__)
+        try {
+          if ((r2 = i2.constructor) && r2.getDerivedStateFromError != null && (i2.setState(r2.getDerivedStateFromError(n2)), o2 = i2.__d), i2.componentDidCatch != null && (i2.componentDidCatch(n2, t2 || {}), o2 = i2.__d), o2)
+            return i2.__E = i2;
+        } catch (l3) {
+          n2 = l3;
+        }
+    throw n2;
+  } }, u = 0, t = function(n2) {
+    return n2 != null && n2.constructor === undefined;
+  }, x.prototype.setState = function(n2, l2) {
+    var u2;
+    u2 = this.__s != null && this.__s != this.state ? this.__s : this.__s = w({}, this.state), typeof n2 == "function" && (n2 = n2(w({}, u2), this.props)), n2 && w(u2, n2), n2 != null && this.__v && (l2 && this._sb.push(l2), $(this));
+  }, x.prototype.forceUpdate = function(n2) {
+    this.__v && (this.__e = true, n2 && this.__h.push(n2), $(this));
+  }, x.prototype.render = k, i = [], o = typeof Promise == "function" ? Promise.prototype.then.bind(Promise.resolve()) : setTimeout, e = function(n2, l2) {
+    return n2.__v.__b - l2.__v.__b;
+  }, I.__r = 0, f = /(PointerCapture)$|Capture$/i, c = 0, s = O(false), a = O(true), h = 0;
+
+  // node_modules/preact/hooks/dist/hooks.module.js
+  var t2;
+  var r2;
+  var u2;
+  var i2;
+  var o2 = 0;
+  var f2 = [];
+  var c2 = l;
+  var e2 = c2.__b;
+  var a2 = c2.__r;
+  var v2 = c2.diffed;
+  var l2 = c2.__c;
+  var m2 = c2.unmount;
+  var s2 = c2.__;
+  function p2(n2, t3) {
+    c2.__h && c2.__h(r2, n2, o2 || t3), o2 = 0;
+    var u3 = r2.__H || (r2.__H = { __: [], __h: [] });
+    return n2 >= u3.__.length && u3.__.push({}), u3.__[n2];
+  }
+  function d2(n2) {
+    return o2 = 1, h2(D2, n2);
+  }
+  function h2(n2, u3, i3) {
+    var o3 = p2(t2++, 2);
+    if (o3.t = n2, !o3.__c && (o3.__ = [i3 ? i3(u3) : D2(undefined, u3), function(n3) {
+      var t3 = o3.__N ? o3.__N[0] : o3.__[0], r3 = o3.t(t3, n3);
+      t3 !== r3 && (o3.__N = [r3, o3.__[1]], o3.__c.setState({}));
+    }], o3.__c = r2, !r2.__f)) {
+      var f3 = function(n3, t3, r3) {
+        if (!o3.__c.__H)
+          return true;
+        var u4 = o3.__c.__H.__.filter(function(n4) {
+          return n4.__c;
+        });
+        if (u4.every(function(n4) {
+          return !n4.__N;
+        }))
+          return !c3 || c3.call(this, n3, t3, r3);
+        var i4 = o3.__c.props !== n3;
+        return u4.some(function(n4) {
+          if (n4.__N) {
+            var t4 = n4.__[0];
+            n4.__ = n4.__N, n4.__N = undefined, t4 !== n4.__[0] && (i4 = true);
+          }
+        }), c3 && c3.call(this, n3, t3, r3) || i4;
+      };
+      r2.__f = true;
+      var { shouldComponentUpdate: c3, componentWillUpdate: e3 } = r2;
+      r2.componentWillUpdate = function(n3, t3, r3) {
+        if (this.__e) {
+          var u4 = c3;
+          c3 = undefined, f3(n3, t3, r3), c3 = u4;
+        }
+        e3 && e3.call(this, n3, t3, r3);
+      }, r2.shouldComponentUpdate = f3;
+    }
+    return o3.__N || o3.__;
+  }
+  function y2(n2, u3) {
+    var i3 = p2(t2++, 3);
+    !c2.__s && C2(i3.__H, u3) && (i3.__ = n2, i3.u = u3, r2.__H.__h.push(i3));
+  }
+  function A2(n2) {
+    return o2 = 5, T2(function() {
+      return { current: n2 };
+    }, []);
+  }
+  function T2(n2, r3) {
+    var u3 = p2(t2++, 7);
+    return C2(u3.__H, r3) && (u3.__ = n2(), u3.__H = r3, u3.__h = n2), u3.__;
+  }
+  function q2(n2, t3) {
+    return o2 = 8, T2(function() {
+      return n2;
+    }, t3);
+  }
+  function j2() {
+    for (var n2;n2 = f2.shift(); ) {
+      var t3 = n2.__H;
+      if (n2.__P && t3)
+        try {
+          t3.__h.some(z2), t3.__h.some(B2), t3.__h = [];
+        } catch (r3) {
+          t3.__h = [], c2.__e(r3, n2.__v);
+        }
+    }
+  }
+  c2.__b = function(n2) {
+    r2 = null, e2 && e2(n2);
+  }, c2.__ = function(n2, t3) {
+    n2 && t3.__k && t3.__k.__m && (n2.__m = t3.__k.__m), s2 && s2(n2, t3);
+  }, c2.__r = function(n2) {
+    a2 && a2(n2), t2 = 0;
+    var i3 = (r2 = n2.__c).__H;
+    i3 && (u2 === r2 ? (i3.__h = [], r2.__h = [], i3.__.some(function(n3) {
+      n3.__N && (n3.__ = n3.__N), n3.u = n3.__N = undefined;
+    })) : (i3.__h.some(z2), i3.__h.some(B2), i3.__h = [], t2 = 0)), u2 = r2;
+  }, c2.diffed = function(n2) {
+    v2 && v2(n2);
+    var t3 = n2.__c;
+    t3 && t3.__H && (t3.__H.__h.length && (f2.push(t3) !== 1 && i2 === c2.requestAnimationFrame || ((i2 = c2.requestAnimationFrame) || w2)(j2)), t3.__H.__.some(function(n3) {
+      n3.u && (n3.__H = n3.u), n3.u = undefined;
+    })), u2 = r2 = null;
+  }, c2.__c = function(n2, t3) {
+    t3.some(function(n3) {
+      try {
+        n3.__h.some(z2), n3.__h = n3.__h.filter(function(n4) {
+          return !n4.__ || B2(n4);
+        });
+      } catch (r3) {
+        t3.some(function(n4) {
+          n4.__h && (n4.__h = []);
+        }), t3 = [], c2.__e(r3, n3.__v);
+      }
+    }), l2 && l2(n2, t3);
+  }, c2.unmount = function(n2) {
+    m2 && m2(n2);
+    var t3, r3 = n2.__c;
+    r3 && r3.__H && (r3.__H.__.some(function(n3) {
+      try {
+        z2(n3);
+      } catch (n4) {
+        t3 = n4;
+      }
+    }), r3.__H = undefined, t3 && c2.__e(t3, r3.__v));
+  };
+  var k2 = typeof requestAnimationFrame == "function";
+  function w2(n2) {
+    var t3, r3 = function() {
+      clearTimeout(u3), k2 && cancelAnimationFrame(t3), setTimeout(n2);
+    }, u3 = setTimeout(r3, 35);
+    k2 && (t3 = requestAnimationFrame(r3));
+  }
+  function z2(n2) {
+    var t3 = r2, u3 = n2.__c;
+    typeof u3 == "function" && (n2.__c = undefined, u3()), r2 = t3;
+  }
+  function B2(n2) {
+    var t3 = r2;
+    n2.__c = n2.__(), r2 = t3;
+  }
+  function C2(n2, t3) {
+    return !n2 || n2.length !== t3.length || t3.some(function(t4, r3) {
+      return t4 !== n2[r3];
+    });
+  }
+  function D2(n2, t3) {
+    return typeof t3 == "function" ? t3(n2) : t3;
+  }
+
+  // src/hooks/use-sse.ts
+  function useSSE() {
+    const [data, setData] = d2({
+      plan: null,
+      session: null,
+      skills: null,
+      dev: null,
+      context: null,
+      prompt: null
+    });
+    const lastUpdate = A2({});
+    y2(() => {
+      const initData = window.Telegram?.WebApp?.initData || "";
+      const url = location.origin + "/miniapp/api/events?initData=" + encodeURIComponent(initData);
+      const es = new EventSource(url);
+      es.addEventListener("plan", (e3) => {
+        try {
+          const d3 = JSON.parse(e3.data);
+          lastUpdate.current.plan = Date.now();
+          setData((prev) => ({ ...prev, plan: d3 }));
+        } catch {}
+      });
+      es.addEventListener("session", (e3) => {
+        try {
+          const d3 = JSON.parse(e3.data);
+          lastUpdate.current.session = Date.now();
+          setData((prev) => ({ ...prev, session: d3 }));
+        } catch {}
+      });
+      es.addEventListener("skills", (e3) => {
+        try {
+          const d3 = JSON.parse(e3.data);
+          lastUpdate.current.skills = Date.now();
+          setData((prev) => ({ ...prev, skills: d3 }));
+        } catch {}
+      });
+      es.addEventListener("dev", (e3) => {
+        try {
+          const d3 = JSON.parse(e3.data);
+          lastUpdate.current.dev = Date.now();
+          setData((prev) => ({ ...prev, dev: d3 }));
+        } catch {}
+      });
+      es.addEventListener("context", (e3) => {
+        try {
+          const d3 = JSON.parse(e3.data);
+          setData((prev) => ({ ...prev, context: d3 }));
+        } catch {}
+      });
+      es.addEventListener("prompt", (e3) => {
+        try {
+          const d3 = JSON.parse(e3.data);
+          setData((prev) => ({ ...prev, prompt: d3.prompt || null }));
+        } catch {}
+      });
+      return () => es.close();
+    }, []);
+    return { ...data, lastUpdate: lastUpdate.current };
+  }
+
+  // src/hooks/use-api.ts
+  var API_BASE = location.origin;
+  function getInitData() {
+    return window.Telegram?.WebApp?.initData || "";
+  }
+  async function apiFetch(path) {
+    const sep = path.includes("?") ? "&" : "?";
+    const res = await fetch(API_BASE + path + sep + "initData=" + encodeURIComponent(getInitData()));
+    if (!res.ok)
+      throw new Error("API error: " + res.status);
+    return res.json();
+  }
+  async function apiPost(path, body) {
+    const sep = path.includes("?") ? "&" : "?";
+    const res = await fetch(API_BASE + path + sep + "initData=" + encodeURIComponent(getInitData()), {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(body)
+    });
+    if (!res.ok) {
+      let errMsg = "API error: " + res.status;
+      try {
+        const data = await res.json();
+        if (data.error)
+          errMsg = data.error;
+      } catch {}
+      throw new Error(errMsg);
+    }
+    return res.json();
+  }
+  async function sendCommand(cmd) {
+    if (!cmd.startsWith("/"))
+      return false;
+    try {
+      await apiPost("/miniapp/api/command", { command: cmd });
+      return true;
+    } catch {
+      return false;
+    }
+  }
+
+  // src/utils.ts
+  function formatAge(sec) {
+    if (sec < 60)
+      return sec + "s ago";
+    if (sec < 3600)
+      return Math.floor(sec / 60) + "m ago";
+    return Math.floor(sec / 3600) + "h ago";
+  }
+  function formatTokens(n2) {
+    if (n2 >= 1e6)
+      return (n2 / 1e6).toFixed(1) + "M";
+    if (n2 >= 1000)
+      return (n2 / 1000).toFixed(1) + "K";
+    return String(n2);
+  }
+  function flashSent(el) {
+    el.classList.add("sent");
+    setTimeout(() => el.classList.remove("sent"), 600);
+  }
+  function formatSessionLabel(key) {
+    if (key.startsWith("heartbeat:"))
+      return "Heartbeat";
+    const parts = key.split(":");
+    if (parts.length >= 4) {
+      const channel = parts[2];
+      const scope = parts[3];
+      return capitalize(channel) + " " + capitalize(scope);
+    }
+    if (parts.length > 2)
+      return parts.slice(2).join(":");
+    return key;
+  }
+  function capitalize(s3) {
+    return s3.charAt(0).toUpperCase() + s3.slice(1);
+  }
+  function isFresh(lastUpdate, key, ms = 5000) {
+    return !!lastUpdate[key] && Date.now() - lastUpdate[key] < ms;
+  }
+
   // node_modules/marked/lib/marked.esm.js
-  function M() {
+  function M2() {
     return { async: false, breaks: false, extensions: null, gfm: true, hooks: null, pedantic: false, renderer: null, silent: false, tokenizer: null, walkTokens: null };
   }
-  var T = M();
-  function G(u) {
-    T = u;
+  var T3 = M2();
+  function G2(u3) {
+    T3 = u3;
   }
-  var _ = { exec: () => null };
-  function k(u, e = "") {
-    let t = typeof u == "string" ? u : u.source, n = { replace: (r, i) => {
-      let s = typeof i == "string" ? i : i.source;
-      return s = s.replace(m.caret, "$1"), t = t.replace(r, s), n;
-    }, getRegex: () => new RegExp(t, e) };
-    return n;
+  var _2 = { exec: () => null };
+  function k3(u3, e3 = "") {
+    let t3 = typeof u3 == "string" ? u3 : u3.source, n2 = { replace: (r3, i3) => {
+      let s3 = typeof i3 == "string" ? i3 : i3.source;
+      return s3 = s3.replace(m3.caret, "$1"), t3 = t3.replace(r3, s3), n2;
+    }, getRegex: () => new RegExp(t3, e3) };
+    return n2;
   }
   var Re = (() => {
     try {
@@ -1475,1279 +2077,1279 @@ https://github.com/highlightjs/highlight.js/issues/2277`);
       return false;
     }
   })();
-  var m = { codeRemoveIndent: /^(?: {1,4}| {0,3}\t)/gm, outputLinkReplace: /\\([\[\]])/g, indentCodeCompensation: /^(\s+)(?:```)/, beginningSpace: /^\s+/, endingHash: /#$/, startingSpaceChar: /^ /, endingSpaceChar: / $/, nonSpaceChar: /[^ ]/, newLineCharGlobal: /\n/g, tabCharGlobal: /\t/g, multipleSpaceGlobal: /\s+/g, blankLine: /^[ \t]*$/, doubleBlankLine: /\n[ \t]*\n[ \t]*$/, blockquoteStart: /^ {0,3}>/, blockquoteSetextReplace: /\n {0,3}((?:=+|-+) *)(?=\n|$)/g, blockquoteSetextReplace2: /^ {0,3}>[ \t]?/gm, listReplaceNesting: /^ {1,4}(?=( {4})*[^ ])/g, listIsTask: /^\[[ xX]\] +\S/, listReplaceTask: /^\[[ xX]\] +/, listTaskCheckbox: /\[[ xX]\]/, anyLine: /\n.*\n/, hrefBrackets: /^<(.*)>$/, tableDelimiter: /[:|]/, tableAlignChars: /^\||\| *$/g, tableRowBlankLine: /\n[ \t]*$/, tableAlignRight: /^ *-+: *$/, tableAlignCenter: /^ *:-+: *$/, tableAlignLeft: /^ *:-+ *$/, startATag: /^<a /i, endATag: /^<\/a>/i, startPreScriptTag: /^<(pre|code|kbd|script)(\s|>)/i, endPreScriptTag: /^<\/(pre|code|kbd|script)(\s|>)/i, startAngleBracket: /^</, endAngleBracket: />$/, pedanticHrefTitle: /^([^'"]*[^\s])\s+(['"])(.*)\2/, unicodeAlphaNumeric: /[\p{L}\p{N}]/u, escapeTest: /[&<>"']/, escapeReplace: /[&<>"']/g, escapeTestNoEncode: /[<>"']|&(?!(#\d{1,7}|#[Xx][a-fA-F0-9]{1,6}|\w+);)/, escapeReplaceNoEncode: /[<>"']|&(?!(#\d{1,7}|#[Xx][a-fA-F0-9]{1,6}|\w+);)/g, caret: /(^|[^\[])\^/g, percentDecode: /%25/g, findPipe: /\|/g, splitPipe: / \|/, slashPipe: /\\\|/g, carriageReturn: /\r\n|\r/g, spaceLine: /^ +$/gm, notSpaceStart: /^\S*/, endingNewline: /\n$/, listItemRegex: (u) => new RegExp(`^( {0,3}${u})((?:[	 ][^\\n]*)?(?:\\n|$))`), nextBulletRegex: (u) => new RegExp(`^ {0,${Math.min(3, u - 1)}}(?:[*+-]|\\d{1,9}[.)])((?:[ 	][^\\n]*)?(?:\\n|$))`), hrRegex: (u) => new RegExp(`^ {0,${Math.min(3, u - 1)}}((?:- *){3,}|(?:_ *){3,}|(?:\\* *){3,})(?:\\n+|$)`), fencesBeginRegex: (u) => new RegExp(`^ {0,${Math.min(3, u - 1)}}(?:\`\`\`|~~~)`), headingBeginRegex: (u) => new RegExp(`^ {0,${Math.min(3, u - 1)}}#`), htmlBeginRegex: (u) => new RegExp(`^ {0,${Math.min(3, u - 1)}}<(?:[a-z].*>|!--)`, "i"), blockquoteBeginRegex: (u) => new RegExp(`^ {0,${Math.min(3, u - 1)}}>`) };
+  var m3 = { codeRemoveIndent: /^(?: {1,4}| {0,3}\t)/gm, outputLinkReplace: /\\([\[\]])/g, indentCodeCompensation: /^(\s+)(?:```)/, beginningSpace: /^\s+/, endingHash: /#$/, startingSpaceChar: /^ /, endingSpaceChar: / $/, nonSpaceChar: /[^ ]/, newLineCharGlobal: /\n/g, tabCharGlobal: /\t/g, multipleSpaceGlobal: /\s+/g, blankLine: /^[ \t]*$/, doubleBlankLine: /\n[ \t]*\n[ \t]*$/, blockquoteStart: /^ {0,3}>/, blockquoteSetextReplace: /\n {0,3}((?:=+|-+) *)(?=\n|$)/g, blockquoteSetextReplace2: /^ {0,3}>[ \t]?/gm, listReplaceNesting: /^ {1,4}(?=( {4})*[^ ])/g, listIsTask: /^\[[ xX]\] +\S/, listReplaceTask: /^\[[ xX]\] +/, listTaskCheckbox: /\[[ xX]\]/, anyLine: /\n.*\n/, hrefBrackets: /^<(.*)>$/, tableDelimiter: /[:|]/, tableAlignChars: /^\||\| *$/g, tableRowBlankLine: /\n[ \t]*$/, tableAlignRight: /^ *-+: *$/, tableAlignCenter: /^ *:-+: *$/, tableAlignLeft: /^ *:-+ *$/, startATag: /^<a /i, endATag: /^<\/a>/i, startPreScriptTag: /^<(pre|code|kbd|script)(\s|>)/i, endPreScriptTag: /^<\/(pre|code|kbd|script)(\s|>)/i, startAngleBracket: /^</, endAngleBracket: />$/, pedanticHrefTitle: /^([^'"]*[^\s])\s+(['"])(.*)\2/, unicodeAlphaNumeric: /[\p{L}\p{N}]/u, escapeTest: /[&<>"']/, escapeReplace: /[&<>"']/g, escapeTestNoEncode: /[<>"']|&(?!(#\d{1,7}|#[Xx][a-fA-F0-9]{1,6}|\w+);)/, escapeReplaceNoEncode: /[<>"']|&(?!(#\d{1,7}|#[Xx][a-fA-F0-9]{1,6}|\w+);)/g, caret: /(^|[^\[])\^/g, percentDecode: /%25/g, findPipe: /\|/g, splitPipe: / \|/, slashPipe: /\\\|/g, carriageReturn: /\r\n|\r/g, spaceLine: /^ +$/gm, notSpaceStart: /^\S*/, endingNewline: /\n$/, listItemRegex: (u3) => new RegExp(`^( {0,3}${u3})((?:[	 ][^\\n]*)?(?:\\n|$))`), nextBulletRegex: (u3) => new RegExp(`^ {0,${Math.min(3, u3 - 1)}}(?:[*+-]|\\d{1,9}[.)])((?:[ 	][^\\n]*)?(?:\\n|$))`), hrRegex: (u3) => new RegExp(`^ {0,${Math.min(3, u3 - 1)}}((?:- *){3,}|(?:_ *){3,}|(?:\\* *){3,})(?:\\n+|$)`), fencesBeginRegex: (u3) => new RegExp(`^ {0,${Math.min(3, u3 - 1)}}(?:\`\`\`|~~~)`), headingBeginRegex: (u3) => new RegExp(`^ {0,${Math.min(3, u3 - 1)}}#`), htmlBeginRegex: (u3) => new RegExp(`^ {0,${Math.min(3, u3 - 1)}}<(?:[a-z].*>|!--)`, "i"), blockquoteBeginRegex: (u3) => new RegExp(`^ {0,${Math.min(3, u3 - 1)}}>`) };
   var Te = /^(?:[ \t]*(?:\n|$))+/;
   var Oe = /^((?: {4}| {0,3}\t)[^\n]+(?:\n(?:[ \t]*(?:\n|$))*)?)+/;
   var we = /^ {0,3}(`{3,}(?=[^`\n]*(?:\n|$))|~{3,})([^\n]*)(?:\n|$)(?:|([\s\S]*?)(?:\n|$))(?: {0,3}\1[~`]* *(?=\n|$)|$)/;
-  var A = /^ {0,3}((?:-[\t ]*){3,}|(?:_[ \t]*){3,}|(?:\*[ \t]*){3,})(?:\n+|$)/;
+  var A3 = /^ {0,3}((?:-[\t ]*){3,}|(?:_[ \t]*){3,}|(?:\*[ \t]*){3,})(?:\n+|$)/;
   var ye = /^ {0,3}(#{1,6})(?=\s|$)(.*)(?:\n+|$)/;
-  var N = / {0,3}(?:[*+-]|\d{1,9}[.)])/;
+  var N2 = / {0,3}(?:[*+-]|\d{1,9}[.)])/;
   var re = /^(?!bull |blockCode|fences|blockquote|heading|html|table)((?:.|\n(?!\s*?\n|bull |blockCode|fences|blockquote|heading|html|table))+?)\n {0,3}(=+|-+) *(?:\n+|$)/;
-  var se = k(re).replace(/bull/g, N).replace(/blockCode/g, /(?: {4}| {0,3}\t)/).replace(/fences/g, / {0,3}(?:`{3,}|~{3,})/).replace(/blockquote/g, / {0,3}>/).replace(/heading/g, / {0,3}#{1,6}/).replace(/html/g, / {0,3}<[^\n>]+>\n/).replace(/\|table/g, "").getRegex();
-  var Pe = k(re).replace(/bull/g, N).replace(/blockCode/g, /(?: {4}| {0,3}\t)/).replace(/fences/g, / {0,3}(?:`{3,}|~{3,})/).replace(/blockquote/g, / {0,3}>/).replace(/heading/g, / {0,3}#{1,6}/).replace(/html/g, / {0,3}<[^\n>]+>\n/).replace(/table/g, / {0,3}\|?(?:[:\- ]*\|)+[\:\- ]*\n/).getRegex();
+  var se = k3(re).replace(/bull/g, N2).replace(/blockCode/g, /(?: {4}| {0,3}\t)/).replace(/fences/g, / {0,3}(?:`{3,}|~{3,})/).replace(/blockquote/g, / {0,3}>/).replace(/heading/g, / {0,3}#{1,6}/).replace(/html/g, / {0,3}<[^\n>]+>\n/).replace(/\|table/g, "").getRegex();
+  var Pe = k3(re).replace(/bull/g, N2).replace(/blockCode/g, /(?: {4}| {0,3}\t)/).replace(/fences/g, / {0,3}(?:`{3,}|~{3,})/).replace(/blockquote/g, / {0,3}>/).replace(/heading/g, / {0,3}#{1,6}/).replace(/html/g, / {0,3}<[^\n>]+>\n/).replace(/table/g, / {0,3}\|?(?:[:\- ]*\|)+[\:\- ]*\n/).getRegex();
   var Q = /^([^\n]+(?:\n(?!hr|heading|lheading|blockquote|fences|list|html|table| +\n)[^\n]+)*)/;
   var Se = /^[^\n]+/;
-  var j = /(?!\s*\])(?:\\[\s\S]|[^\[\]\\])+/;
-  var $e = k(/^ {0,3}\[(label)\]: *(?:\n[ \t]*)?([^<\s][^\s]*|<.*?>)(?:(?: +(?:\n[ \t]*)?| *\n[ \t]*)(title))? *(?:\n+|$)/).replace("label", j).replace("title", /(?:"(?:\\"?|[^"\\])*"|'[^'\n]*(?:\n[^'\n]+)*\n?'|\([^()]*\))/).getRegex();
-  var _e = k(/^(bull)([ \t][^\n]+?)?(?:\n|$)/).replace(/bull/g, N).getRegex();
-  var q = "address|article|aside|base|basefont|blockquote|body|caption|center|col|colgroup|dd|details|dialog|dir|div|dl|dt|fieldset|figcaption|figure|footer|form|frame|frameset|h[1-6]|head|header|hr|html|iframe|legend|li|link|main|menu|menuitem|meta|nav|noframes|ol|optgroup|option|p|param|search|section|summary|table|tbody|td|tfoot|th|thead|title|tr|track|ul";
-  var F = /<!--(?:-?>|[\s\S]*?(?:-->|$))/;
-  var Le = k("^ {0,3}(?:<(script|pre|style|textarea)[\\s>][\\s\\S]*?(?:</\\1>[^\\n]*\\n+|$)|comment[^\\n]*(\\n+|$)|<\\?[\\s\\S]*?(?:\\?>\\n*|$)|<![A-Z][\\s\\S]*?(?:>\\n*|$)|<!\\[CDATA\\[[\\s\\S]*?(?:\\]\\]>\\n*|$)|</?(tag)(?: +|\\n|/?>)[\\s\\S]*?(?:(?:\\n[ \t]*)+\\n|$)|<(?!script|pre|style|textarea)([a-z][\\w-]*)(?:attribute)*? */?>(?=[ \\t]*(?:\\n|$))[\\s\\S]*?(?:(?:\\n[ \t]*)+\\n|$)|</(?!script|pre|style|textarea)[a-z][\\w-]*\\s*>(?=[ \\t]*(?:\\n|$))[\\s\\S]*?(?:(?:\\n[ \t]*)+\\n|$))", "i").replace("comment", F).replace("tag", q).replace("attribute", / +[a-zA-Z:_][\w.:-]*(?: *= *"[^"\n]*"| *= *'[^'\n]*'| *= *[^\s"'=<>`]+)?/).getRegex();
-  var ie = k(Q).replace("hr", A).replace("heading", " {0,3}#{1,6}(?:\\s|$)").replace("|lheading", "").replace("|table", "").replace("blockquote", " {0,3}>").replace("fences", " {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list", " {0,3}(?:[*+-]|1[.)])[ \\t]").replace("html", "</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag", q).getRegex();
-  var Me = k(/^( {0,3}> ?(paragraph|[^\n]*)(?:\n|$))+/).replace("paragraph", ie).getRegex();
-  var U = { blockquote: Me, code: Oe, def: $e, fences: we, heading: ye, hr: A, html: Le, lheading: se, list: _e, newline: Te, paragraph: ie, table: _, text: Se };
-  var te = k("^ *([^\\n ].*)\\n {0,3}((?:\\| *)?:?-+:? *(?:\\| *:?-+:? *)*(?:\\| *)?)(?:\\n((?:(?! *\\n|hr|heading|blockquote|code|fences|list|html).*(?:\\n|$))*)\\n*|$)").replace("hr", A).replace("heading", " {0,3}#{1,6}(?:\\s|$)").replace("blockquote", " {0,3}>").replace("code", "(?: {4}| {0,3}\t)[^\\n]").replace("fences", " {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list", " {0,3}(?:[*+-]|1[.)])[ \\t]").replace("html", "</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag", q).getRegex();
-  var ze = { ...U, lheading: Pe, table: te, paragraph: k(Q).replace("hr", A).replace("heading", " {0,3}#{1,6}(?:\\s|$)").replace("|lheading", "").replace("table", te).replace("blockquote", " {0,3}>").replace("fences", " {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list", " {0,3}(?:[*+-]|1[.)])[ \\t]").replace("html", "</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag", q).getRegex() };
-  var Ee = { ...U, html: k(`^ *(?:comment *(?:\\n|\\s*$)|<(tag)[\\s\\S]+?</\\1> *(?:\\n{2,}|\\s*$)|<tag(?:"[^"]*"|'[^']*'|\\s[^'"/>\\s]*)*?/?> *(?:\\n{2,}|\\s*$))`).replace("comment", F).replace(/tag/g, "(?!(?:a|em|strong|small|s|cite|q|dfn|abbr|data|time|code|var|samp|kbd|sub|sup|i|b|u|mark|ruby|rt|rp|bdi|bdo|span|br|wbr|ins|del|img)\\b)\\w+(?!:|[^\\w\\s@]*@)\\b").getRegex(), def: /^ *\[([^\]]+)\]: *<?([^\s>]+)>?(?: +(["(][^\n]+[")]))? *(?:\n+|$)/, heading: /^(#{1,6})(.*)(?:\n+|$)/, fences: _, lheading: /^(.+?)\n {0,3}(=+|-+) *(?:\n+|$)/, paragraph: k(Q).replace("hr", A).replace("heading", ` *#{1,6} *[^
+  var j3 = /(?!\s*\])(?:\\[\s\S]|[^\[\]\\])+/;
+  var $e = k3(/^ {0,3}\[(label)\]: *(?:\n[ \t]*)?([^<\s][^\s]*|<.*?>)(?:(?: +(?:\n[ \t]*)?| *\n[ \t]*)(title))? *(?:\n+|$)/).replace("label", j3).replace("title", /(?:"(?:\\"?|[^"\\])*"|'[^'\n]*(?:\n[^'\n]+)*\n?'|\([^()]*\))/).getRegex();
+  var _e = k3(/^(bull)([ \t][^\n]+?)?(?:\n|$)/).replace(/bull/g, N2).getRegex();
+  var q3 = "address|article|aside|base|basefont|blockquote|body|caption|center|col|colgroup|dd|details|dialog|dir|div|dl|dt|fieldset|figcaption|figure|footer|form|frame|frameset|h[1-6]|head|header|hr|html|iframe|legend|li|link|main|menu|menuitem|meta|nav|noframes|ol|optgroup|option|p|param|search|section|summary|table|tbody|td|tfoot|th|thead|title|tr|track|ul";
+  var F2 = /<!--(?:-?>|[\s\S]*?(?:-->|$))/;
+  var Le = k3("^ {0,3}(?:<(script|pre|style|textarea)[\\s>][\\s\\S]*?(?:</\\1>[^\\n]*\\n+|$)|comment[^\\n]*(\\n+|$)|<\\?[\\s\\S]*?(?:\\?>\\n*|$)|<![A-Z][\\s\\S]*?(?:>\\n*|$)|<!\\[CDATA\\[[\\s\\S]*?(?:\\]\\]>\\n*|$)|</?(tag)(?: +|\\n|/?>)[\\s\\S]*?(?:(?:\\n[ \t]*)+\\n|$)|<(?!script|pre|style|textarea)([a-z][\\w-]*)(?:attribute)*? */?>(?=[ \\t]*(?:\\n|$))[\\s\\S]*?(?:(?:\\n[ \t]*)+\\n|$)|</(?!script|pre|style|textarea)[a-z][\\w-]*\\s*>(?=[ \\t]*(?:\\n|$))[\\s\\S]*?(?:(?:\\n[ \t]*)+\\n|$))", "i").replace("comment", F2).replace("tag", q3).replace("attribute", / +[a-zA-Z:_][\w.:-]*(?: *= *"[^"\n]*"| *= *'[^'\n]*'| *= *[^\s"'=<>`]+)?/).getRegex();
+  var ie = k3(Q).replace("hr", A3).replace("heading", " {0,3}#{1,6}(?:\\s|$)").replace("|lheading", "").replace("|table", "").replace("blockquote", " {0,3}>").replace("fences", " {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list", " {0,3}(?:[*+-]|1[.)])[ \\t]").replace("html", "</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag", q3).getRegex();
+  var Me = k3(/^( {0,3}> ?(paragraph|[^\n]*)(?:\n|$))+/).replace("paragraph", ie).getRegex();
+  var U = { blockquote: Me, code: Oe, def: $e, fences: we, heading: ye, hr: A3, html: Le, lheading: se, list: _e, newline: Te, paragraph: ie, table: _2, text: Se };
+  var te = k3("^ *([^\\n ].*)\\n {0,3}((?:\\| *)?:?-+:? *(?:\\| *:?-+:? *)*(?:\\| *)?)(?:\\n((?:(?! *\\n|hr|heading|blockquote|code|fences|list|html).*(?:\\n|$))*)\\n*|$)").replace("hr", A3).replace("heading", " {0,3}#{1,6}(?:\\s|$)").replace("blockquote", " {0,3}>").replace("code", "(?: {4}| {0,3}\t)[^\\n]").replace("fences", " {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list", " {0,3}(?:[*+-]|1[.)])[ \\t]").replace("html", "</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag", q3).getRegex();
+  var ze = { ...U, lheading: Pe, table: te, paragraph: k3(Q).replace("hr", A3).replace("heading", " {0,3}#{1,6}(?:\\s|$)").replace("|lheading", "").replace("table", te).replace("blockquote", " {0,3}>").replace("fences", " {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list", " {0,3}(?:[*+-]|1[.)])[ \\t]").replace("html", "</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag", q3).getRegex() };
+  var Ee = { ...U, html: k3(`^ *(?:comment *(?:\\n|\\s*$)|<(tag)[\\s\\S]+?</\\1> *(?:\\n{2,}|\\s*$)|<tag(?:"[^"]*"|'[^']*'|\\s[^'"/>\\s]*)*?/?> *(?:\\n{2,}|\\s*$))`).replace("comment", F2).replace(/tag/g, "(?!(?:a|em|strong|small|s|cite|q|dfn|abbr|data|time|code|var|samp|kbd|sub|sup|i|b|u|mark|ruby|rt|rp|bdi|bdo|span|br|wbr|ins|del|img)\\b)\\w+(?!:|[^\\w\\s@]*@)\\b").getRegex(), def: /^ *\[([^\]]+)\]: *<?([^\s>]+)>?(?: +(["(][^\n]+[")]))? *(?:\n+|$)/, heading: /^(#{1,6})(.*)(?:\n+|$)/, fences: _2, lheading: /^(.+?)\n {0,3}(=+|-+) *(?:\n+|$)/, paragraph: k3(Q).replace("hr", A3).replace("heading", ` *#{1,6} *[^
 ]`).replace("lheading", se).replace("|table", "").replace("blockquote", " {0,3}>").replace("|fences", "").replace("|list", "").replace("|html", "").replace("|tag", "").getRegex() };
   var Ie = /^\\([!"#$%&'()*+,\-./:;<=>?@\[\]\\^_`{|}~])/;
   var Ae = /^(`+)([^`]|[^`][\s\S]*?[^`])\1(?!`)/;
   var oe = /^( {2,}|\\)\n(?!\s*$)/;
   var Ce = /^(`+|[^`])(?:(?= {2,}\n)|[\s\S]*?(?:(?=[\\<!\[`*_]|\b_|$)|[^ ](?= {2,}\n)))/;
-  var v = /[\p{P}\p{S}]/u;
+  var v3 = /[\p{P}\p{S}]/u;
   var K = /[\s\p{P}\p{S}]/u;
   var ae = /[^\s\p{P}\p{S}]/u;
-  var Be = k(/^((?![*_])punctSpace)/, "u").replace(/punctSpace/g, K).getRegex();
+  var Be = k3(/^((?![*_])punctSpace)/, "u").replace(/punctSpace/g, K).getRegex();
   var le = /(?!~)[\p{P}\p{S}]/u;
   var De = /(?!~)[\s\p{P}\p{S}]/u;
   var qe = /(?:[^\s\p{P}\p{S}]|~)/u;
   var ue = /(?![*_])[\p{P}\p{S}]/u;
   var ve = /(?![*_])[\s\p{P}\p{S}]/u;
   var He = /(?:[^\s\p{P}\p{S}]|[*_])/u;
-  var Ge = k(/link|precode-code|html/, "g").replace("link", /\[(?:[^\[\]`]|(?<a>`+)[^`]+\k<a>(?!`))*?\]\((?:\\[\s\S]|[^\\\(\)]|\((?:\\[\s\S]|[^\\\(\)])*\))*\)/).replace("precode-", Re ? "(?<!`)()" : "(^^|[^`])").replace("code", /(?<b>`+)[^`]+\k<b>(?!`)/).replace("html", /<(?! )[^<>]*?>/).getRegex();
+  var Ge = k3(/link|precode-code|html/, "g").replace("link", /\[(?:[^\[\]`]|(?<a>`+)[^`]+\k<a>(?!`))*?\]\((?:\\[\s\S]|[^\\\(\)]|\((?:\\[\s\S]|[^\\\(\)])*\))*\)/).replace("precode-", Re ? "(?<!`)()" : "(^^|[^`])").replace("code", /(?<b>`+)[^`]+\k<b>(?!`)/).replace("html", /<(?! )[^<>]*?>/).getRegex();
   var pe = /^(?:\*+(?:((?!\*)punct)|[^\s*]))|^_+(?:((?!_)punct)|([^\s_]))/;
-  var Ze = k(pe, "u").replace(/punct/g, v).getRegex();
-  var Ne = k(pe, "u").replace(/punct/g, le).getRegex();
+  var Ze = k3(pe, "u").replace(/punct/g, v3).getRegex();
+  var Ne = k3(pe, "u").replace(/punct/g, le).getRegex();
   var ce = "^[^_*]*?__[^_*]*?\\*[^_*]*?(?=__)|[^*]+(?=[^*])|(?!\\*)punct(\\*+)(?=[\\s]|$)|notPunctSpace(\\*+)(?!\\*)(?=punctSpace|$)|(?!\\*)punctSpace(\\*+)(?=notPunctSpace)|[\\s](\\*+)(?!\\*)(?=punct)|(?!\\*)punct(\\*+)(?!\\*)(?=punct)|notPunctSpace(\\*+)(?=notPunctSpace)";
-  var Qe = k(ce, "gu").replace(/notPunctSpace/g, ae).replace(/punctSpace/g, K).replace(/punct/g, v).getRegex();
-  var je = k(ce, "gu").replace(/notPunctSpace/g, qe).replace(/punctSpace/g, De).replace(/punct/g, le).getRegex();
-  var Fe = k("^[^_*]*?\\*\\*[^_*]*?_[^_*]*?(?=\\*\\*)|[^_]+(?=[^_])|(?!_)punct(_+)(?=[\\s]|$)|notPunctSpace(_+)(?!_)(?=punctSpace|$)|(?!_)punctSpace(_+)(?=notPunctSpace)|[\\s](_+)(?!_)(?=punct)|(?!_)punct(_+)(?!_)(?=punct)", "gu").replace(/notPunctSpace/g, ae).replace(/punctSpace/g, K).replace(/punct/g, v).getRegex();
-  var Ue = k(/^~~?(?:((?!~)punct)|[^\s~])/, "u").replace(/punct/g, ue).getRegex();
+  var Qe = k3(ce, "gu").replace(/notPunctSpace/g, ae).replace(/punctSpace/g, K).replace(/punct/g, v3).getRegex();
+  var je = k3(ce, "gu").replace(/notPunctSpace/g, qe).replace(/punctSpace/g, De).replace(/punct/g, le).getRegex();
+  var Fe = k3("^[^_*]*?\\*\\*[^_*]*?_[^_*]*?(?=\\*\\*)|[^_]+(?=[^_])|(?!_)punct(_+)(?=[\\s]|$)|notPunctSpace(_+)(?!_)(?=punctSpace|$)|(?!_)punctSpace(_+)(?=notPunctSpace)|[\\s](_+)(?!_)(?=punct)|(?!_)punct(_+)(?!_)(?=punct)", "gu").replace(/notPunctSpace/g, ae).replace(/punctSpace/g, K).replace(/punct/g, v3).getRegex();
+  var Ue = k3(/^~~?(?:((?!~)punct)|[^\s~])/, "u").replace(/punct/g, ue).getRegex();
   var Ke = "^[^~]+(?=[^~])|(?!~)punct(~~?)(?=[\\s]|$)|notPunctSpace(~~?)(?!~)(?=punctSpace|$)|(?!~)punctSpace(~~?)(?=notPunctSpace)|[\\s](~~?)(?!~)(?=punct)|(?!~)punct(~~?)(?!~)(?=punct)|notPunctSpace(~~?)(?=notPunctSpace)";
-  var We = k(Ke, "gu").replace(/notPunctSpace/g, He).replace(/punctSpace/g, ve).replace(/punct/g, ue).getRegex();
-  var Xe = k(/\\(punct)/, "gu").replace(/punct/g, v).getRegex();
-  var Je = k(/^<(scheme:[^\s\x00-\x1f<>]*|email)>/).replace("scheme", /[a-zA-Z][a-zA-Z0-9+.-]{1,31}/).replace("email", /[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+(@)[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)+(?![-_])/).getRegex();
-  var Ve = k(F).replace("(?:-->|$)", "-->").getRegex();
-  var Ye = k("^comment|^</[a-zA-Z][\\w:-]*\\s*>|^<[a-zA-Z][\\w-]*(?:attribute)*?\\s*/?>|^<\\?[\\s\\S]*?\\?>|^<![a-zA-Z]+\\s[\\s\\S]*?>|^<!\\[CDATA\\[[\\s\\S]*?\\]\\]>").replace("comment", Ve).replace("attribute", /\s+[a-zA-Z:_][\w.:-]*(?:\s*=\s*"[^"]*"|\s*=\s*'[^']*'|\s*=\s*[^\s"'=<>`]+)?/).getRegex();
-  var D = /(?:\[(?:\\[\s\S]|[^\[\]\\])*\]|\\[\s\S]|`+[^`]*?`+(?!`)|[^\[\]\\`])*?/;
-  var et = k(/^!?\[(label)\]\(\s*(href)(?:(?:[ \t]+(?:\n[ \t]*)?|\n[ \t]*)(title))?\s*\)/).replace("label", D).replace("href", /<(?:\\.|[^\n<>\\])+>|[^ \t\n\x00-\x1f]*/).replace("title", /"(?:\\"?|[^"\\])*"|'(?:\\'?|[^'\\])*'|\((?:\\\)?|[^)\\])*\)/).getRegex();
-  var he = k(/^!?\[(label)\]\[(ref)\]/).replace("label", D).replace("ref", j).getRegex();
-  var ke = k(/^!?\[(ref)\](?:\[\])?/).replace("ref", j).getRegex();
-  var tt = k("reflink|nolink(?!\\()", "g").replace("reflink", he).replace("nolink", ke).getRegex();
+  var We = k3(Ke, "gu").replace(/notPunctSpace/g, He).replace(/punctSpace/g, ve).replace(/punct/g, ue).getRegex();
+  var Xe = k3(/\\(punct)/, "gu").replace(/punct/g, v3).getRegex();
+  var Je = k3(/^<(scheme:[^\s\x00-\x1f<>]*|email)>/).replace("scheme", /[a-zA-Z][a-zA-Z0-9+.-]{1,31}/).replace("email", /[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+(@)[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)+(?![-_])/).getRegex();
+  var Ve = k3(F2).replace("(?:-->|$)", "-->").getRegex();
+  var Ye = k3("^comment|^</[a-zA-Z][\\w:-]*\\s*>|^<[a-zA-Z][\\w-]*(?:attribute)*?\\s*/?>|^<\\?[\\s\\S]*?\\?>|^<![a-zA-Z]+\\s[\\s\\S]*?>|^<!\\[CDATA\\[[\\s\\S]*?\\]\\]>").replace("comment", Ve).replace("attribute", /\s+[a-zA-Z:_][\w.:-]*(?:\s*=\s*"[^"]*"|\s*=\s*'[^']*'|\s*=\s*[^\s"'=<>`]+)?/).getRegex();
+  var D3 = /(?:\[(?:\\[\s\S]|[^\[\]\\])*\]|\\[\s\S]|`+[^`]*?`+(?!`)|[^\[\]\\`])*?/;
+  var et = k3(/^!?\[(label)\]\(\s*(href)(?:(?:[ \t]+(?:\n[ \t]*)?|\n[ \t]*)(title))?\s*\)/).replace("label", D3).replace("href", /<(?:\\.|[^\n<>\\])+>|[^ \t\n\x00-\x1f]*/).replace("title", /"(?:\\"?|[^"\\])*"|'(?:\\'?|[^'\\])*'|\((?:\\\)?|[^)\\])*\)/).getRegex();
+  var he = k3(/^!?\[(label)\]\[(ref)\]/).replace("label", D3).replace("ref", j3).getRegex();
+  var ke = k3(/^!?\[(ref)\](?:\[\])?/).replace("ref", j3).getRegex();
+  var tt = k3("reflink|nolink(?!\\()", "g").replace("reflink", he).replace("nolink", ke).getRegex();
   var ne = /[hH][tT][tT][pP][sS]?|[fF][tT][pP]/;
-  var W = { _backpedal: _, anyPunctuation: Xe, autolink: Je, blockSkip: Ge, br: oe, code: Ae, del: _, delLDelim: _, delRDelim: _, emStrongLDelim: Ze, emStrongRDelimAst: Qe, emStrongRDelimUnd: Fe, escape: Ie, link: et, nolink: ke, punctuation: Be, reflink: he, reflinkSearch: tt, tag: Ye, text: Ce, url: _ };
-  var nt = { ...W, link: k(/^!?\[(label)\]\((.*?)\)/).replace("label", D).getRegex(), reflink: k(/^!?\[(label)\]\s*\[([^\]]*)\]/).replace("label", D).getRegex() };
-  var Z = { ...W, emStrongRDelimAst: je, emStrongLDelim: Ne, delLDelim: Ue, delRDelim: We, url: k(/^((?:protocol):\/\/|www\.)(?:[a-zA-Z0-9\-]+\.?)+[^\s<]*|^email/).replace("protocol", ne).replace("email", /[A-Za-z0-9._+-]+(@)[a-zA-Z0-9-_]+(?:\.[a-zA-Z0-9-_]*[a-zA-Z0-9])+(?![-_])/).getRegex(), _backpedal: /(?:[^?!.,:;*_'"~()&]+|\([^)]*\)|&(?![a-zA-Z0-9]+;$)|[?!.,:;*_'"~)]+(?!$))+/, del: /^(~~?)(?=[^\s~])((?:\\[\s\S]|[^\\])*?(?:\\[\s\S]|[^\s~\\]))\1(?=[^~]|$)/, text: k(/^([`~]+|[^`~])(?:(?= {2,}\n)|(?=[a-zA-Z0-9.!#$%&'*+\/=?_`{\|}~-]+@)|[\s\S]*?(?:(?=[\\<!\[`*~_]|\b_|protocol:\/\/|www\.|$)|[^ ](?= {2,}\n)|[^a-zA-Z0-9.!#$%&'*+\/=?_`{\|}~-](?=[a-zA-Z0-9.!#$%&'*+\/=?_`{\|}~-]+@)))/).replace("protocol", ne).getRegex() };
-  var rt = { ...Z, br: k(oe).replace("{2,}", "*").getRegex(), text: k(Z.text).replace("\\b_", "\\b_| {2,}\\n").replace(/\{2,\}/g, "*").getRegex() };
-  var C = { normal: U, gfm: ze, pedantic: Ee };
-  var z = { normal: W, gfm: Z, breaks: rt, pedantic: nt };
+  var W = { _backpedal: _2, anyPunctuation: Xe, autolink: Je, blockSkip: Ge, br: oe, code: Ae, del: _2, delLDelim: _2, delRDelim: _2, emStrongLDelim: Ze, emStrongRDelimAst: Qe, emStrongRDelimUnd: Fe, escape: Ie, link: et, nolink: ke, punctuation: Be, reflink: he, reflinkSearch: tt, tag: Ye, text: Ce, url: _2 };
+  var nt = { ...W, link: k3(/^!?\[(label)\]\((.*?)\)/).replace("label", D3).getRegex(), reflink: k3(/^!?\[(label)\]\s*\[([^\]]*)\]/).replace("label", D3).getRegex() };
+  var Z = { ...W, emStrongRDelimAst: je, emStrongLDelim: Ne, delLDelim: Ue, delRDelim: We, url: k3(/^((?:protocol):\/\/|www\.)(?:[a-zA-Z0-9\-]+\.?)+[^\s<]*|^email/).replace("protocol", ne).replace("email", /[A-Za-z0-9._+-]+(@)[a-zA-Z0-9-_]+(?:\.[a-zA-Z0-9-_]*[a-zA-Z0-9])+(?![-_])/).getRegex(), _backpedal: /(?:[^?!.,:;*_'"~()&]+|\([^)]*\)|&(?![a-zA-Z0-9]+;$)|[?!.,:;*_'"~)]+(?!$))+/, del: /^(~~?)(?=[^\s~])((?:\\[\s\S]|[^\\])*?(?:\\[\s\S]|[^\s~\\]))\1(?=[^~]|$)/, text: k3(/^([`~]+|[^`~])(?:(?= {2,}\n)|(?=[a-zA-Z0-9.!#$%&'*+\/=?_`{\|}~-]+@)|[\s\S]*?(?:(?=[\\<!\[`*~_]|\b_|protocol:\/\/|www\.|$)|[^ ](?= {2,}\n)|[^a-zA-Z0-9.!#$%&'*+\/=?_`{\|}~-](?=[a-zA-Z0-9.!#$%&'*+\/=?_`{\|}~-]+@)))/).replace("protocol", ne).getRegex() };
+  var rt = { ...Z, br: k3(oe).replace("{2,}", "*").getRegex(), text: k3(Z.text).replace("\\b_", "\\b_| {2,}\\n").replace(/\{2,\}/g, "*").getRegex() };
+  var C3 = { normal: U, gfm: ze, pedantic: Ee };
+  var z3 = { normal: W, gfm: Z, breaks: rt, pedantic: nt };
   var st = { "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" };
-  var de = (u) => st[u];
-  function O(u, e) {
-    if (e) {
-      if (m.escapeTest.test(u))
-        return u.replace(m.escapeReplace, de);
-    } else if (m.escapeTestNoEncode.test(u))
-      return u.replace(m.escapeReplaceNoEncode, de);
-    return u;
+  var de = (u3) => st[u3];
+  function O2(u3, e3) {
+    if (e3) {
+      if (m3.escapeTest.test(u3))
+        return u3.replace(m3.escapeReplace, de);
+    } else if (m3.escapeTestNoEncode.test(u3))
+      return u3.replace(m3.escapeReplaceNoEncode, de);
+    return u3;
   }
-  function X(u) {
+  function X(u3) {
     try {
-      u = encodeURI(u).replace(m.percentDecode, "%");
+      u3 = encodeURI(u3).replace(m3.percentDecode, "%");
     } catch {
       return null;
     }
-    return u;
+    return u3;
   }
-  function J(u, e) {
-    let t = u.replace(m.findPipe, (i, s, a) => {
-      let o = false, l = s;
-      for (;--l >= 0 && a[l] === "\\"; )
-        o = !o;
-      return o ? "|" : " |";
-    }), n = t.split(m.splitPipe), r = 0;
-    if (n[0].trim() || n.shift(), n.length > 0 && !n.at(-1)?.trim() && n.pop(), e)
-      if (n.length > e)
-        n.splice(e);
+  function J2(u3, e3) {
+    let t3 = u3.replace(m3.findPipe, (i3, s3, a3) => {
+      let o3 = false, l3 = s3;
+      for (;--l3 >= 0 && a3[l3] === "\\"; )
+        o3 = !o3;
+      return o3 ? "|" : " |";
+    }), n2 = t3.split(m3.splitPipe), r3 = 0;
+    if (n2[0].trim() || n2.shift(), n2.length > 0 && !n2.at(-1)?.trim() && n2.pop(), e3)
+      if (n2.length > e3)
+        n2.splice(e3);
       else
-        for (;n.length < e; )
-          n.push("");
-    for (;r < n.length; r++)
-      n[r] = n[r].trim().replace(m.slashPipe, "|");
-    return n;
+        for (;n2.length < e3; )
+          n2.push("");
+    for (;r3 < n2.length; r3++)
+      n2[r3] = n2[r3].trim().replace(m3.slashPipe, "|");
+    return n2;
   }
-  function E(u, e, t) {
-    let n = u.length;
-    if (n === 0)
+  function E2(u3, e3, t3) {
+    let n2 = u3.length;
+    if (n2 === 0)
       return "";
-    let r = 0;
-    for (;r < n; ) {
-      let i = u.charAt(n - r - 1);
-      if (i === e && !t)
-        r++;
-      else if (i !== e && t)
-        r++;
+    let r3 = 0;
+    for (;r3 < n2; ) {
+      let i3 = u3.charAt(n2 - r3 - 1);
+      if (i3 === e3 && !t3)
+        r3++;
+      else if (i3 !== e3 && t3)
+        r3++;
       else
         break;
     }
-    return u.slice(0, n - r);
+    return u3.slice(0, n2 - r3);
   }
-  function ge(u, e) {
-    if (u.indexOf(e[1]) === -1)
+  function ge(u3, e3) {
+    if (u3.indexOf(e3[1]) === -1)
       return -1;
-    let t = 0;
-    for (let n = 0;n < u.length; n++)
-      if (u[n] === "\\")
-        n++;
-      else if (u[n] === e[0])
-        t++;
-      else if (u[n] === e[1] && (t--, t < 0))
-        return n;
-    return t > 0 ? -2 : -1;
+    let t3 = 0;
+    for (let n2 = 0;n2 < u3.length; n2++)
+      if (u3[n2] === "\\")
+        n2++;
+      else if (u3[n2] === e3[0])
+        t3++;
+      else if (u3[n2] === e3[1] && (t3--, t3 < 0))
+        return n2;
+    return t3 > 0 ? -2 : -1;
   }
-  function fe(u, e = 0) {
-    let t = e, n = "";
-    for (let r of u)
-      if (r === "\t") {
-        let i = 4 - t % 4;
-        n += " ".repeat(i), t += i;
+  function fe(u3, e3 = 0) {
+    let t3 = e3, n2 = "";
+    for (let r3 of u3)
+      if (r3 === "\t") {
+        let i3 = 4 - t3 % 4;
+        n2 += " ".repeat(i3), t3 += i3;
       } else
-        n += r, t++;
-    return n;
+        n2 += r3, t3++;
+    return n2;
   }
-  function me(u, e, t, n, r) {
-    let i = e.href, s = e.title || null, a = u[1].replace(r.other.outputLinkReplace, "$1");
-    n.state.inLink = true;
-    let o = { type: u[0].charAt(0) === "!" ? "image" : "link", raw: t, href: i, title: s, text: a, tokens: n.inlineTokens(a) };
-    return n.state.inLink = false, o;
+  function me(u3, e3, t3, n2, r3) {
+    let i3 = e3.href, s3 = e3.title || null, a3 = u3[1].replace(r3.other.outputLinkReplace, "$1");
+    n2.state.inLink = true;
+    let o3 = { type: u3[0].charAt(0) === "!" ? "image" : "link", raw: t3, href: i3, title: s3, text: a3, tokens: n2.inlineTokens(a3) };
+    return n2.state.inLink = false, o3;
   }
-  function it(u, e, t) {
-    let n = u.match(t.other.indentCodeCompensation);
-    if (n === null)
-      return e;
-    let r = n[1];
-    return e.split(`
-`).map((i) => {
-      let s = i.match(t.other.beginningSpace);
-      if (s === null)
-        return i;
-      let [a] = s;
-      return a.length >= r.length ? i.slice(r.length) : i;
+  function it(u3, e3, t3) {
+    let n2 = u3.match(t3.other.indentCodeCompensation);
+    if (n2 === null)
+      return e3;
+    let r3 = n2[1];
+    return e3.split(`
+`).map((i3) => {
+      let s3 = i3.match(t3.other.beginningSpace);
+      if (s3 === null)
+        return i3;
+      let [a3] = s3;
+      return a3.length >= r3.length ? i3.slice(r3.length) : i3;
     }).join(`
 `);
   }
-  var w = class {
+  var w3 = class {
     options;
     rules;
     lexer;
-    constructor(e) {
-      this.options = e || T;
+    constructor(e3) {
+      this.options = e3 || T3;
     }
-    space(e) {
-      let t = this.rules.block.newline.exec(e);
-      if (t && t[0].length > 0)
-        return { type: "space", raw: t[0] };
+    space(e3) {
+      let t3 = this.rules.block.newline.exec(e3);
+      if (t3 && t3[0].length > 0)
+        return { type: "space", raw: t3[0] };
     }
-    code(e) {
-      let t = this.rules.block.code.exec(e);
-      if (t) {
-        let n = t[0].replace(this.rules.other.codeRemoveIndent, "");
-        return { type: "code", raw: t[0], codeBlockStyle: "indented", text: this.options.pedantic ? n : E(n, `
+    code(e3) {
+      let t3 = this.rules.block.code.exec(e3);
+      if (t3) {
+        let n2 = t3[0].replace(this.rules.other.codeRemoveIndent, "");
+        return { type: "code", raw: t3[0], codeBlockStyle: "indented", text: this.options.pedantic ? n2 : E2(n2, `
 `) };
       }
     }
-    fences(e) {
-      let t = this.rules.block.fences.exec(e);
-      if (t) {
-        let n = t[0], r = it(n, t[3] || "", this.rules);
-        return { type: "code", raw: n, lang: t[2] ? t[2].trim().replace(this.rules.inline.anyPunctuation, "$1") : t[2], text: r };
+    fences(e3) {
+      let t3 = this.rules.block.fences.exec(e3);
+      if (t3) {
+        let n2 = t3[0], r3 = it(n2, t3[3] || "", this.rules);
+        return { type: "code", raw: n2, lang: t3[2] ? t3[2].trim().replace(this.rules.inline.anyPunctuation, "$1") : t3[2], text: r3 };
       }
     }
-    heading(e) {
-      let t = this.rules.block.heading.exec(e);
-      if (t) {
-        let n = t[2].trim();
-        if (this.rules.other.endingHash.test(n)) {
-          let r = E(n, "#");
-          (this.options.pedantic || !r || this.rules.other.endingSpaceChar.test(r)) && (n = r.trim());
+    heading(e3) {
+      let t3 = this.rules.block.heading.exec(e3);
+      if (t3) {
+        let n2 = t3[2].trim();
+        if (this.rules.other.endingHash.test(n2)) {
+          let r3 = E2(n2, "#");
+          (this.options.pedantic || !r3 || this.rules.other.endingSpaceChar.test(r3)) && (n2 = r3.trim());
         }
-        return { type: "heading", raw: t[0], depth: t[1].length, text: n, tokens: this.lexer.inline(n) };
+        return { type: "heading", raw: t3[0], depth: t3[1].length, text: n2, tokens: this.lexer.inline(n2) };
       }
     }
-    hr(e) {
-      let t = this.rules.block.hr.exec(e);
-      if (t)
-        return { type: "hr", raw: E(t[0], `
+    hr(e3) {
+      let t3 = this.rules.block.hr.exec(e3);
+      if (t3)
+        return { type: "hr", raw: E2(t3[0], `
 `) };
     }
-    blockquote(e) {
-      let t = this.rules.block.blockquote.exec(e);
-      if (t) {
-        let n = E(t[0], `
+    blockquote(e3) {
+      let t3 = this.rules.block.blockquote.exec(e3);
+      if (t3) {
+        let n2 = E2(t3[0], `
 `).split(`
-`), r = "", i = "", s = [];
-        for (;n.length > 0; ) {
-          let a = false, o = [], l;
-          for (l = 0;l < n.length; l++)
-            if (this.rules.other.blockquoteStart.test(n[l]))
-              o.push(n[l]), a = true;
-            else if (!a)
-              o.push(n[l]);
+`), r3 = "", i3 = "", s3 = [];
+        for (;n2.length > 0; ) {
+          let a3 = false, o3 = [], l3;
+          for (l3 = 0;l3 < n2.length; l3++)
+            if (this.rules.other.blockquoteStart.test(n2[l3]))
+              o3.push(n2[l3]), a3 = true;
+            else if (!a3)
+              o3.push(n2[l3]);
             else
               break;
-          n = n.slice(l);
-          let p = o.join(`
-`), c = p.replace(this.rules.other.blockquoteSetextReplace, `
+          n2 = n2.slice(l3);
+          let p3 = o3.join(`
+`), c3 = p3.replace(this.rules.other.blockquoteSetextReplace, `
     $1`).replace(this.rules.other.blockquoteSetextReplace2, "");
-          r = r ? `${r}
-${p}` : p, i = i ? `${i}
-${c}` : c;
-          let d = this.lexer.state.top;
-          if (this.lexer.state.top = true, this.lexer.blockTokens(c, s, true), this.lexer.state.top = d, n.length === 0)
+          r3 = r3 ? `${r3}
+${p3}` : p3, i3 = i3 ? `${i3}
+${c3}` : c3;
+          let d3 = this.lexer.state.top;
+          if (this.lexer.state.top = true, this.lexer.blockTokens(c3, s3, true), this.lexer.state.top = d3, n2.length === 0)
             break;
-          let h = s.at(-1);
-          if (h?.type === "code")
+          let h3 = s3.at(-1);
+          if (h3?.type === "code")
             break;
-          if (h?.type === "blockquote") {
-            let R = h, f = R.raw + `
-` + n.join(`
-`), S = this.blockquote(f);
-            s[s.length - 1] = S, r = r.substring(0, r.length - R.raw.length) + S.raw, i = i.substring(0, i.length - R.text.length) + S.text;
+          if (h3?.type === "blockquote") {
+            let R = h3, f3 = R.raw + `
+` + n2.join(`
+`), S2 = this.blockquote(f3);
+            s3[s3.length - 1] = S2, r3 = r3.substring(0, r3.length - R.raw.length) + S2.raw, i3 = i3.substring(0, i3.length - R.text.length) + S2.text;
             break;
-          } else if (h?.type === "list") {
-            let R = h, f = R.raw + `
-` + n.join(`
-`), S = this.list(f);
-            s[s.length - 1] = S, r = r.substring(0, r.length - h.raw.length) + S.raw, i = i.substring(0, i.length - R.raw.length) + S.raw, n = f.substring(s.at(-1).raw.length).split(`
+          } else if (h3?.type === "list") {
+            let R = h3, f3 = R.raw + `
+` + n2.join(`
+`), S2 = this.list(f3);
+            s3[s3.length - 1] = S2, r3 = r3.substring(0, r3.length - h3.raw.length) + S2.raw, i3 = i3.substring(0, i3.length - R.raw.length) + S2.raw, n2 = f3.substring(s3.at(-1).raw.length).split(`
 `);
             continue;
           }
         }
-        return { type: "blockquote", raw: r, tokens: s, text: i };
+        return { type: "blockquote", raw: r3, tokens: s3, text: i3 };
       }
     }
-    list(e) {
-      let t = this.rules.block.list.exec(e);
-      if (t) {
-        let n = t[1].trim(), r = n.length > 1, i = { type: "list", raw: "", ordered: r, start: r ? +n.slice(0, -1) : "", loose: false, items: [] };
-        n = r ? `\\d{1,9}\\${n.slice(-1)}` : `\\${n}`, this.options.pedantic && (n = r ? n : "[*+-]");
-        let s = this.rules.other.listItemRegex(n), a = false;
-        for (;e; ) {
-          let l = false, p = "", c = "";
-          if (!(t = s.exec(e)) || this.rules.block.hr.test(e))
+    list(e3) {
+      let t3 = this.rules.block.list.exec(e3);
+      if (t3) {
+        let n2 = t3[1].trim(), r3 = n2.length > 1, i3 = { type: "list", raw: "", ordered: r3, start: r3 ? +n2.slice(0, -1) : "", loose: false, items: [] };
+        n2 = r3 ? `\\d{1,9}\\${n2.slice(-1)}` : `\\${n2}`, this.options.pedantic && (n2 = r3 ? n2 : "[*+-]");
+        let s3 = this.rules.other.listItemRegex(n2), a3 = false;
+        for (;e3; ) {
+          let l3 = false, p3 = "", c3 = "";
+          if (!(t3 = s3.exec(e3)) || this.rules.block.hr.test(e3))
             break;
-          p = t[0], e = e.substring(p.length);
-          let d = fe(t[2].split(`
-`, 1)[0], t[1].length), h = e.split(`
-`, 1)[0], R = !d.trim(), f = 0;
-          if (this.options.pedantic ? (f = 2, c = d.trimStart()) : R ? f = t[1].length + 1 : (f = d.search(this.rules.other.nonSpaceChar), f = f > 4 ? 1 : f, c = d.slice(f), f += t[1].length), R && this.rules.other.blankLine.test(h) && (p += h + `
-`, e = e.substring(h.length + 1), l = true), !l) {
-            let S = this.rules.other.nextBulletRegex(f), V = this.rules.other.hrRegex(f), Y = this.rules.other.fencesBeginRegex(f), ee = this.rules.other.headingBeginRegex(f), xe = this.rules.other.htmlBeginRegex(f), be = this.rules.other.blockquoteBeginRegex(f);
-            for (;e; ) {
-              let H = e.split(`
-`, 1)[0], I;
-              if (h = H, this.options.pedantic ? (h = h.replace(this.rules.other.listReplaceNesting, "  "), I = h) : I = h.replace(this.rules.other.tabCharGlobal, "    "), Y.test(h) || ee.test(h) || xe.test(h) || be.test(h) || S.test(h) || V.test(h))
+          p3 = t3[0], e3 = e3.substring(p3.length);
+          let d3 = fe(t3[2].split(`
+`, 1)[0], t3[1].length), h3 = e3.split(`
+`, 1)[0], R = !d3.trim(), f3 = 0;
+          if (this.options.pedantic ? (f3 = 2, c3 = d3.trimStart()) : R ? f3 = t3[1].length + 1 : (f3 = d3.search(this.rules.other.nonSpaceChar), f3 = f3 > 4 ? 1 : f3, c3 = d3.slice(f3), f3 += t3[1].length), R && this.rules.other.blankLine.test(h3) && (p3 += h3 + `
+`, e3 = e3.substring(h3.length + 1), l3 = true), !l3) {
+            let S2 = this.rules.other.nextBulletRegex(f3), V2 = this.rules.other.hrRegex(f3), Y = this.rules.other.fencesBeginRegex(f3), ee = this.rules.other.headingBeginRegex(f3), xe = this.rules.other.htmlBeginRegex(f3), be = this.rules.other.blockquoteBeginRegex(f3);
+            for (;e3; ) {
+              let H2 = e3.split(`
+`, 1)[0], I2;
+              if (h3 = H2, this.options.pedantic ? (h3 = h3.replace(this.rules.other.listReplaceNesting, "  "), I2 = h3) : I2 = h3.replace(this.rules.other.tabCharGlobal, "    "), Y.test(h3) || ee.test(h3) || xe.test(h3) || be.test(h3) || S2.test(h3) || V2.test(h3))
                 break;
-              if (I.search(this.rules.other.nonSpaceChar) >= f || !h.trim())
-                c += `
-` + I.slice(f);
+              if (I2.search(this.rules.other.nonSpaceChar) >= f3 || !h3.trim())
+                c3 += `
+` + I2.slice(f3);
               else {
-                if (R || d.replace(this.rules.other.tabCharGlobal, "    ").search(this.rules.other.nonSpaceChar) >= 4 || Y.test(d) || ee.test(d) || V.test(d))
+                if (R || d3.replace(this.rules.other.tabCharGlobal, "    ").search(this.rules.other.nonSpaceChar) >= 4 || Y.test(d3) || ee.test(d3) || V2.test(d3))
                   break;
-                c += `
-` + h;
+                c3 += `
+` + h3;
               }
-              R = !h.trim(), p += H + `
-`, e = e.substring(H.length + 1), d = I.slice(f);
+              R = !h3.trim(), p3 += H2 + `
+`, e3 = e3.substring(H2.length + 1), d3 = I2.slice(f3);
             }
           }
-          i.loose || (a ? i.loose = true : this.rules.other.doubleBlankLine.test(p) && (a = true)), i.items.push({ type: "list_item", raw: p, task: !!this.options.gfm && this.rules.other.listIsTask.test(c), loose: false, text: c, tokens: [] }), i.raw += p;
+          i3.loose || (a3 ? i3.loose = true : this.rules.other.doubleBlankLine.test(p3) && (a3 = true)), i3.items.push({ type: "list_item", raw: p3, task: !!this.options.gfm && this.rules.other.listIsTask.test(c3), loose: false, text: c3, tokens: [] }), i3.raw += p3;
         }
-        let o = i.items.at(-1);
-        if (o)
-          o.raw = o.raw.trimEnd(), o.text = o.text.trimEnd();
+        let o3 = i3.items.at(-1);
+        if (o3)
+          o3.raw = o3.raw.trimEnd(), o3.text = o3.text.trimEnd();
         else
           return;
-        i.raw = i.raw.trimEnd();
-        for (let l of i.items) {
-          if (this.lexer.state.top = false, l.tokens = this.lexer.blockTokens(l.text, []), l.task) {
-            if (l.text = l.text.replace(this.rules.other.listReplaceTask, ""), l.tokens[0]?.type === "text" || l.tokens[0]?.type === "paragraph") {
-              l.tokens[0].raw = l.tokens[0].raw.replace(this.rules.other.listReplaceTask, ""), l.tokens[0].text = l.tokens[0].text.replace(this.rules.other.listReplaceTask, "");
-              for (let c = this.lexer.inlineQueue.length - 1;c >= 0; c--)
-                if (this.rules.other.listIsTask.test(this.lexer.inlineQueue[c].src)) {
-                  this.lexer.inlineQueue[c].src = this.lexer.inlineQueue[c].src.replace(this.rules.other.listReplaceTask, "");
+        i3.raw = i3.raw.trimEnd();
+        for (let l3 of i3.items) {
+          if (this.lexer.state.top = false, l3.tokens = this.lexer.blockTokens(l3.text, []), l3.task) {
+            if (l3.text = l3.text.replace(this.rules.other.listReplaceTask, ""), l3.tokens[0]?.type === "text" || l3.tokens[0]?.type === "paragraph") {
+              l3.tokens[0].raw = l3.tokens[0].raw.replace(this.rules.other.listReplaceTask, ""), l3.tokens[0].text = l3.tokens[0].text.replace(this.rules.other.listReplaceTask, "");
+              for (let c3 = this.lexer.inlineQueue.length - 1;c3 >= 0; c3--)
+                if (this.rules.other.listIsTask.test(this.lexer.inlineQueue[c3].src)) {
+                  this.lexer.inlineQueue[c3].src = this.lexer.inlineQueue[c3].src.replace(this.rules.other.listReplaceTask, "");
                   break;
                 }
             }
-            let p = this.rules.other.listTaskCheckbox.exec(l.raw);
-            if (p) {
-              let c = { type: "checkbox", raw: p[0] + " ", checked: p[0] !== "[ ]" };
-              l.checked = c.checked, i.loose ? l.tokens[0] && ["paragraph", "text"].includes(l.tokens[0].type) && "tokens" in l.tokens[0] && l.tokens[0].tokens ? (l.tokens[0].raw = c.raw + l.tokens[0].raw, l.tokens[0].text = c.raw + l.tokens[0].text, l.tokens[0].tokens.unshift(c)) : l.tokens.unshift({ type: "paragraph", raw: c.raw, text: c.raw, tokens: [c] }) : l.tokens.unshift(c);
+            let p3 = this.rules.other.listTaskCheckbox.exec(l3.raw);
+            if (p3) {
+              let c3 = { type: "checkbox", raw: p3[0] + " ", checked: p3[0] !== "[ ]" };
+              l3.checked = c3.checked, i3.loose ? l3.tokens[0] && ["paragraph", "text"].includes(l3.tokens[0].type) && "tokens" in l3.tokens[0] && l3.tokens[0].tokens ? (l3.tokens[0].raw = c3.raw + l3.tokens[0].raw, l3.tokens[0].text = c3.raw + l3.tokens[0].text, l3.tokens[0].tokens.unshift(c3)) : l3.tokens.unshift({ type: "paragraph", raw: c3.raw, text: c3.raw, tokens: [c3] }) : l3.tokens.unshift(c3);
             }
           }
-          if (!i.loose) {
-            let p = l.tokens.filter((d) => d.type === "space"), c = p.length > 0 && p.some((d) => this.rules.other.anyLine.test(d.raw));
-            i.loose = c;
+          if (!i3.loose) {
+            let p3 = l3.tokens.filter((d3) => d3.type === "space"), c3 = p3.length > 0 && p3.some((d3) => this.rules.other.anyLine.test(d3.raw));
+            i3.loose = c3;
           }
         }
-        if (i.loose)
-          for (let l of i.items) {
-            l.loose = true;
-            for (let p of l.tokens)
-              p.type === "text" && (p.type = "paragraph");
+        if (i3.loose)
+          for (let l3 of i3.items) {
+            l3.loose = true;
+            for (let p3 of l3.tokens)
+              p3.type === "text" && (p3.type = "paragraph");
           }
-        return i;
+        return i3;
       }
     }
-    html(e) {
-      let t = this.rules.block.html.exec(e);
-      if (t)
-        return { type: "html", block: true, raw: t[0], pre: t[1] === "pre" || t[1] === "script" || t[1] === "style", text: t[0] };
+    html(e3) {
+      let t3 = this.rules.block.html.exec(e3);
+      if (t3)
+        return { type: "html", block: true, raw: t3[0], pre: t3[1] === "pre" || t3[1] === "script" || t3[1] === "style", text: t3[0] };
     }
-    def(e) {
-      let t = this.rules.block.def.exec(e);
-      if (t) {
-        let n = t[1].toLowerCase().replace(this.rules.other.multipleSpaceGlobal, " "), r = t[2] ? t[2].replace(this.rules.other.hrefBrackets, "$1").replace(this.rules.inline.anyPunctuation, "$1") : "", i = t[3] ? t[3].substring(1, t[3].length - 1).replace(this.rules.inline.anyPunctuation, "$1") : t[3];
-        return { type: "def", tag: n, raw: t[0], href: r, title: i };
+    def(e3) {
+      let t3 = this.rules.block.def.exec(e3);
+      if (t3) {
+        let n2 = t3[1].toLowerCase().replace(this.rules.other.multipleSpaceGlobal, " "), r3 = t3[2] ? t3[2].replace(this.rules.other.hrefBrackets, "$1").replace(this.rules.inline.anyPunctuation, "$1") : "", i3 = t3[3] ? t3[3].substring(1, t3[3].length - 1).replace(this.rules.inline.anyPunctuation, "$1") : t3[3];
+        return { type: "def", tag: n2, raw: t3[0], href: r3, title: i3 };
       }
     }
-    table(e) {
-      let t = this.rules.block.table.exec(e);
-      if (!t || !this.rules.other.tableDelimiter.test(t[2]))
+    table(e3) {
+      let t3 = this.rules.block.table.exec(e3);
+      if (!t3 || !this.rules.other.tableDelimiter.test(t3[2]))
         return;
-      let n = J(t[1]), r = t[2].replace(this.rules.other.tableAlignChars, "").split("|"), i = t[3]?.trim() ? t[3].replace(this.rules.other.tableRowBlankLine, "").split(`
-`) : [], s = { type: "table", raw: t[0], header: [], align: [], rows: [] };
-      if (n.length === r.length) {
-        for (let a of r)
-          this.rules.other.tableAlignRight.test(a) ? s.align.push("right") : this.rules.other.tableAlignCenter.test(a) ? s.align.push("center") : this.rules.other.tableAlignLeft.test(a) ? s.align.push("left") : s.align.push(null);
-        for (let a = 0;a < n.length; a++)
-          s.header.push({ text: n[a], tokens: this.lexer.inline(n[a]), header: true, align: s.align[a] });
-        for (let a of i)
-          s.rows.push(J(a, s.header.length).map((o, l) => ({ text: o, tokens: this.lexer.inline(o), header: false, align: s.align[l] })));
-        return s;
+      let n2 = J2(t3[1]), r3 = t3[2].replace(this.rules.other.tableAlignChars, "").split("|"), i3 = t3[3]?.trim() ? t3[3].replace(this.rules.other.tableRowBlankLine, "").split(`
+`) : [], s3 = { type: "table", raw: t3[0], header: [], align: [], rows: [] };
+      if (n2.length === r3.length) {
+        for (let a3 of r3)
+          this.rules.other.tableAlignRight.test(a3) ? s3.align.push("right") : this.rules.other.tableAlignCenter.test(a3) ? s3.align.push("center") : this.rules.other.tableAlignLeft.test(a3) ? s3.align.push("left") : s3.align.push(null);
+        for (let a3 = 0;a3 < n2.length; a3++)
+          s3.header.push({ text: n2[a3], tokens: this.lexer.inline(n2[a3]), header: true, align: s3.align[a3] });
+        for (let a3 of i3)
+          s3.rows.push(J2(a3, s3.header.length).map((o3, l3) => ({ text: o3, tokens: this.lexer.inline(o3), header: false, align: s3.align[l3] })));
+        return s3;
       }
     }
-    lheading(e) {
-      let t = this.rules.block.lheading.exec(e);
-      if (t)
-        return { type: "heading", raw: t[0], depth: t[2].charAt(0) === "=" ? 1 : 2, text: t[1], tokens: this.lexer.inline(t[1]) };
+    lheading(e3) {
+      let t3 = this.rules.block.lheading.exec(e3);
+      if (t3)
+        return { type: "heading", raw: t3[0], depth: t3[2].charAt(0) === "=" ? 1 : 2, text: t3[1], tokens: this.lexer.inline(t3[1]) };
     }
-    paragraph(e) {
-      let t = this.rules.block.paragraph.exec(e);
-      if (t) {
-        let n = t[1].charAt(t[1].length - 1) === `
-` ? t[1].slice(0, -1) : t[1];
-        return { type: "paragraph", raw: t[0], text: n, tokens: this.lexer.inline(n) };
+    paragraph(e3) {
+      let t3 = this.rules.block.paragraph.exec(e3);
+      if (t3) {
+        let n2 = t3[1].charAt(t3[1].length - 1) === `
+` ? t3[1].slice(0, -1) : t3[1];
+        return { type: "paragraph", raw: t3[0], text: n2, tokens: this.lexer.inline(n2) };
       }
     }
-    text(e) {
-      let t = this.rules.block.text.exec(e);
-      if (t)
-        return { type: "text", raw: t[0], text: t[0], tokens: this.lexer.inline(t[0]) };
+    text(e3) {
+      let t3 = this.rules.block.text.exec(e3);
+      if (t3)
+        return { type: "text", raw: t3[0], text: t3[0], tokens: this.lexer.inline(t3[0]) };
     }
-    escape(e) {
-      let t = this.rules.inline.escape.exec(e);
-      if (t)
-        return { type: "escape", raw: t[0], text: t[1] };
+    escape(e3) {
+      let t3 = this.rules.inline.escape.exec(e3);
+      if (t3)
+        return { type: "escape", raw: t3[0], text: t3[1] };
     }
-    tag(e) {
-      let t = this.rules.inline.tag.exec(e);
-      if (t)
-        return !this.lexer.state.inLink && this.rules.other.startATag.test(t[0]) ? this.lexer.state.inLink = true : this.lexer.state.inLink && this.rules.other.endATag.test(t[0]) && (this.lexer.state.inLink = false), !this.lexer.state.inRawBlock && this.rules.other.startPreScriptTag.test(t[0]) ? this.lexer.state.inRawBlock = true : this.lexer.state.inRawBlock && this.rules.other.endPreScriptTag.test(t[0]) && (this.lexer.state.inRawBlock = false), { type: "html", raw: t[0], inLink: this.lexer.state.inLink, inRawBlock: this.lexer.state.inRawBlock, block: false, text: t[0] };
+    tag(e3) {
+      let t3 = this.rules.inline.tag.exec(e3);
+      if (t3)
+        return !this.lexer.state.inLink && this.rules.other.startATag.test(t3[0]) ? this.lexer.state.inLink = true : this.lexer.state.inLink && this.rules.other.endATag.test(t3[0]) && (this.lexer.state.inLink = false), !this.lexer.state.inRawBlock && this.rules.other.startPreScriptTag.test(t3[0]) ? this.lexer.state.inRawBlock = true : this.lexer.state.inRawBlock && this.rules.other.endPreScriptTag.test(t3[0]) && (this.lexer.state.inRawBlock = false), { type: "html", raw: t3[0], inLink: this.lexer.state.inLink, inRawBlock: this.lexer.state.inRawBlock, block: false, text: t3[0] };
     }
-    link(e) {
-      let t = this.rules.inline.link.exec(e);
-      if (t) {
-        let n = t[2].trim();
-        if (!this.options.pedantic && this.rules.other.startAngleBracket.test(n)) {
-          if (!this.rules.other.endAngleBracket.test(n))
+    link(e3) {
+      let t3 = this.rules.inline.link.exec(e3);
+      if (t3) {
+        let n2 = t3[2].trim();
+        if (!this.options.pedantic && this.rules.other.startAngleBracket.test(n2)) {
+          if (!this.rules.other.endAngleBracket.test(n2))
             return;
-          let s = E(n.slice(0, -1), "\\");
-          if ((n.length - s.length) % 2 === 0)
+          let s3 = E2(n2.slice(0, -1), "\\");
+          if ((n2.length - s3.length) % 2 === 0)
             return;
         } else {
-          let s = ge(t[2], "()");
-          if (s === -2)
+          let s3 = ge(t3[2], "()");
+          if (s3 === -2)
             return;
-          if (s > -1) {
-            let o = (t[0].indexOf("!") === 0 ? 5 : 4) + t[1].length + s;
-            t[2] = t[2].substring(0, s), t[0] = t[0].substring(0, o).trim(), t[3] = "";
+          if (s3 > -1) {
+            let o3 = (t3[0].indexOf("!") === 0 ? 5 : 4) + t3[1].length + s3;
+            t3[2] = t3[2].substring(0, s3), t3[0] = t3[0].substring(0, o3).trim(), t3[3] = "";
           }
         }
-        let r = t[2], i = "";
+        let r3 = t3[2], i3 = "";
         if (this.options.pedantic) {
-          let s = this.rules.other.pedanticHrefTitle.exec(r);
-          s && (r = s[1], i = s[3]);
+          let s3 = this.rules.other.pedanticHrefTitle.exec(r3);
+          s3 && (r3 = s3[1], i3 = s3[3]);
         } else
-          i = t[3] ? t[3].slice(1, -1) : "";
-        return r = r.trim(), this.rules.other.startAngleBracket.test(r) && (this.options.pedantic && !this.rules.other.endAngleBracket.test(n) ? r = r.slice(1) : r = r.slice(1, -1)), me(t, { href: r && r.replace(this.rules.inline.anyPunctuation, "$1"), title: i && i.replace(this.rules.inline.anyPunctuation, "$1") }, t[0], this.lexer, this.rules);
+          i3 = t3[3] ? t3[3].slice(1, -1) : "";
+        return r3 = r3.trim(), this.rules.other.startAngleBracket.test(r3) && (this.options.pedantic && !this.rules.other.endAngleBracket.test(n2) ? r3 = r3.slice(1) : r3 = r3.slice(1, -1)), me(t3, { href: r3 && r3.replace(this.rules.inline.anyPunctuation, "$1"), title: i3 && i3.replace(this.rules.inline.anyPunctuation, "$1") }, t3[0], this.lexer, this.rules);
       }
     }
-    reflink(e, t) {
-      let n;
-      if ((n = this.rules.inline.reflink.exec(e)) || (n = this.rules.inline.nolink.exec(e))) {
-        let r = (n[2] || n[1]).replace(this.rules.other.multipleSpaceGlobal, " "), i = t[r.toLowerCase()];
-        if (!i) {
-          let s = n[0].charAt(0);
-          return { type: "text", raw: s, text: s };
+    reflink(e3, t3) {
+      let n2;
+      if ((n2 = this.rules.inline.reflink.exec(e3)) || (n2 = this.rules.inline.nolink.exec(e3))) {
+        let r3 = (n2[2] || n2[1]).replace(this.rules.other.multipleSpaceGlobal, " "), i3 = t3[r3.toLowerCase()];
+        if (!i3) {
+          let s3 = n2[0].charAt(0);
+          return { type: "text", raw: s3, text: s3 };
         }
-        return me(n, i, n[0], this.lexer, this.rules);
+        return me(n2, i3, n2[0], this.lexer, this.rules);
       }
     }
-    emStrong(e, t, n = "") {
-      let r = this.rules.inline.emStrongLDelim.exec(e);
-      if (!r || r[3] && n.match(this.rules.other.unicodeAlphaNumeric))
+    emStrong(e3, t3, n2 = "") {
+      let r3 = this.rules.inline.emStrongLDelim.exec(e3);
+      if (!r3 || r3[3] && n2.match(this.rules.other.unicodeAlphaNumeric))
         return;
-      if (!(r[1] || r[2] || "") || !n || this.rules.inline.punctuation.exec(n)) {
-        let s = [...r[0]].length - 1, a, o, l = s, p = 0, c = r[0][0] === "*" ? this.rules.inline.emStrongRDelimAst : this.rules.inline.emStrongRDelimUnd;
-        for (c.lastIndex = 0, t = t.slice(-1 * e.length + s);(r = c.exec(t)) != null; ) {
-          if (a = r[1] || r[2] || r[3] || r[4] || r[5] || r[6], !a)
+      if (!(r3[1] || r3[2] || "") || !n2 || this.rules.inline.punctuation.exec(n2)) {
+        let s3 = [...r3[0]].length - 1, a3, o3, l3 = s3, p3 = 0, c3 = r3[0][0] === "*" ? this.rules.inline.emStrongRDelimAst : this.rules.inline.emStrongRDelimUnd;
+        for (c3.lastIndex = 0, t3 = t3.slice(-1 * e3.length + s3);(r3 = c3.exec(t3)) != null; ) {
+          if (a3 = r3[1] || r3[2] || r3[3] || r3[4] || r3[5] || r3[6], !a3)
             continue;
-          if (o = [...a].length, r[3] || r[4]) {
-            l += o;
+          if (o3 = [...a3].length, r3[3] || r3[4]) {
+            l3 += o3;
             continue;
-          } else if ((r[5] || r[6]) && s % 3 && !((s + o) % 3)) {
-            p += o;
+          } else if ((r3[5] || r3[6]) && s3 % 3 && !((s3 + o3) % 3)) {
+            p3 += o3;
             continue;
           }
-          if (l -= o, l > 0)
+          if (l3 -= o3, l3 > 0)
             continue;
-          o = Math.min(o, o + l + p);
-          let d = [...r[0]][0].length, h = e.slice(0, s + r.index + d + o);
-          if (Math.min(s, o) % 2) {
-            let f = h.slice(1, -1);
-            return { type: "em", raw: h, text: f, tokens: this.lexer.inlineTokens(f) };
+          o3 = Math.min(o3, o3 + l3 + p3);
+          let d3 = [...r3[0]][0].length, h3 = e3.slice(0, s3 + r3.index + d3 + o3);
+          if (Math.min(s3, o3) % 2) {
+            let f3 = h3.slice(1, -1);
+            return { type: "em", raw: h3, text: f3, tokens: this.lexer.inlineTokens(f3) };
           }
-          let R = h.slice(2, -2);
-          return { type: "strong", raw: h, text: R, tokens: this.lexer.inlineTokens(R) };
+          let R = h3.slice(2, -2);
+          return { type: "strong", raw: h3, text: R, tokens: this.lexer.inlineTokens(R) };
         }
       }
     }
-    codespan(e) {
-      let t = this.rules.inline.code.exec(e);
-      if (t) {
-        let n = t[2].replace(this.rules.other.newLineCharGlobal, " "), r = this.rules.other.nonSpaceChar.test(n), i = this.rules.other.startingSpaceChar.test(n) && this.rules.other.endingSpaceChar.test(n);
-        return r && i && (n = n.substring(1, n.length - 1)), { type: "codespan", raw: t[0], text: n };
+    codespan(e3) {
+      let t3 = this.rules.inline.code.exec(e3);
+      if (t3) {
+        let n2 = t3[2].replace(this.rules.other.newLineCharGlobal, " "), r3 = this.rules.other.nonSpaceChar.test(n2), i3 = this.rules.other.startingSpaceChar.test(n2) && this.rules.other.endingSpaceChar.test(n2);
+        return r3 && i3 && (n2 = n2.substring(1, n2.length - 1)), { type: "codespan", raw: t3[0], text: n2 };
       }
     }
-    br(e) {
-      let t = this.rules.inline.br.exec(e);
-      if (t)
-        return { type: "br", raw: t[0] };
+    br(e3) {
+      let t3 = this.rules.inline.br.exec(e3);
+      if (t3)
+        return { type: "br", raw: t3[0] };
     }
-    del(e, t, n = "") {
-      let r = this.rules.inline.delLDelim.exec(e);
-      if (!r)
+    del(e3, t3, n2 = "") {
+      let r3 = this.rules.inline.delLDelim.exec(e3);
+      if (!r3)
         return;
-      if (!(r[1] || "") || !n || this.rules.inline.punctuation.exec(n)) {
-        let s = [...r[0]].length - 1, a, o, l = s, p = this.rules.inline.delRDelim;
-        for (p.lastIndex = 0, t = t.slice(-1 * e.length + s);(r = p.exec(t)) != null; ) {
-          if (a = r[1] || r[2] || r[3] || r[4] || r[5] || r[6], !a || (o = [...a].length, o !== s))
+      if (!(r3[1] || "") || !n2 || this.rules.inline.punctuation.exec(n2)) {
+        let s3 = [...r3[0]].length - 1, a3, o3, l3 = s3, p3 = this.rules.inline.delRDelim;
+        for (p3.lastIndex = 0, t3 = t3.slice(-1 * e3.length + s3);(r3 = p3.exec(t3)) != null; ) {
+          if (a3 = r3[1] || r3[2] || r3[3] || r3[4] || r3[5] || r3[6], !a3 || (o3 = [...a3].length, o3 !== s3))
             continue;
-          if (r[3] || r[4]) {
-            l += o;
+          if (r3[3] || r3[4]) {
+            l3 += o3;
             continue;
           }
-          if (l -= o, l > 0)
+          if (l3 -= o3, l3 > 0)
             continue;
-          o = Math.min(o, o + l);
-          let c = [...r[0]][0].length, d = e.slice(0, s + r.index + c + o), h = d.slice(s, -s);
-          return { type: "del", raw: d, text: h, tokens: this.lexer.inlineTokens(h) };
+          o3 = Math.min(o3, o3 + l3);
+          let c3 = [...r3[0]][0].length, d3 = e3.slice(0, s3 + r3.index + c3 + o3), h3 = d3.slice(s3, -s3);
+          return { type: "del", raw: d3, text: h3, tokens: this.lexer.inlineTokens(h3) };
         }
       }
     }
-    autolink(e) {
-      let t = this.rules.inline.autolink.exec(e);
-      if (t) {
-        let n, r;
-        return t[2] === "@" ? (n = t[1], r = "mailto:" + n) : (n = t[1], r = n), { type: "link", raw: t[0], text: n, href: r, tokens: [{ type: "text", raw: n, text: n }] };
+    autolink(e3) {
+      let t3 = this.rules.inline.autolink.exec(e3);
+      if (t3) {
+        let n2, r3;
+        return t3[2] === "@" ? (n2 = t3[1], r3 = "mailto:" + n2) : (n2 = t3[1], r3 = n2), { type: "link", raw: t3[0], text: n2, href: r3, tokens: [{ type: "text", raw: n2, text: n2 }] };
       }
     }
-    url(e) {
-      let t;
-      if (t = this.rules.inline.url.exec(e)) {
-        let n, r;
-        if (t[2] === "@")
-          n = t[0], r = "mailto:" + n;
+    url(e3) {
+      let t3;
+      if (t3 = this.rules.inline.url.exec(e3)) {
+        let n2, r3;
+        if (t3[2] === "@")
+          n2 = t3[0], r3 = "mailto:" + n2;
         else {
-          let i;
+          let i3;
           do
-            i = t[0], t[0] = this.rules.inline._backpedal.exec(t[0])?.[0] ?? "";
-          while (i !== t[0]);
-          n = t[0], t[1] === "www." ? r = "http://" + t[0] : r = t[0];
+            i3 = t3[0], t3[0] = this.rules.inline._backpedal.exec(t3[0])?.[0] ?? "";
+          while (i3 !== t3[0]);
+          n2 = t3[0], t3[1] === "www." ? r3 = "http://" + t3[0] : r3 = t3[0];
         }
-        return { type: "link", raw: t[0], text: n, href: r, tokens: [{ type: "text", raw: n, text: n }] };
+        return { type: "link", raw: t3[0], text: n2, href: r3, tokens: [{ type: "text", raw: n2, text: n2 }] };
       }
     }
-    inlineText(e) {
-      let t = this.rules.inline.text.exec(e);
-      if (t) {
-        let n = this.lexer.state.inRawBlock;
-        return { type: "text", raw: t[0], text: t[0], escaped: n };
+    inlineText(e3) {
+      let t3 = this.rules.inline.text.exec(e3);
+      if (t3) {
+        let n2 = this.lexer.state.inRawBlock;
+        return { type: "text", raw: t3[0], text: t3[0], escaped: n2 };
       }
     }
   };
-  var x = class u {
+  var x2 = class u3 {
     tokens;
     options;
     state;
     inlineQueue;
     tokenizer;
-    constructor(e) {
-      this.tokens = [], this.tokens.links = Object.create(null), this.options = e || T, this.options.tokenizer = this.options.tokenizer || new w, this.tokenizer = this.options.tokenizer, this.tokenizer.options = this.options, this.tokenizer.lexer = this, this.inlineQueue = [], this.state = { inLink: false, inRawBlock: false, top: true };
-      let t = { other: m, block: C.normal, inline: z.normal };
-      this.options.pedantic ? (t.block = C.pedantic, t.inline = z.pedantic) : this.options.gfm && (t.block = C.gfm, this.options.breaks ? t.inline = z.breaks : t.inline = z.gfm), this.tokenizer.rules = t;
+    constructor(e3) {
+      this.tokens = [], this.tokens.links = Object.create(null), this.options = e3 || T3, this.options.tokenizer = this.options.tokenizer || new w3, this.tokenizer = this.options.tokenizer, this.tokenizer.options = this.options, this.tokenizer.lexer = this, this.inlineQueue = [], this.state = { inLink: false, inRawBlock: false, top: true };
+      let t3 = { other: m3, block: C3.normal, inline: z3.normal };
+      this.options.pedantic ? (t3.block = C3.pedantic, t3.inline = z3.pedantic) : this.options.gfm && (t3.block = C3.gfm, this.options.breaks ? t3.inline = z3.breaks : t3.inline = z3.gfm), this.tokenizer.rules = t3;
     }
     static get rules() {
-      return { block: C, inline: z };
+      return { block: C3, inline: z3 };
     }
-    static lex(e, t) {
-      return new u(t).lex(e);
+    static lex(e3, t3) {
+      return new u3(t3).lex(e3);
     }
-    static lexInline(e, t) {
-      return new u(t).inlineTokens(e);
+    static lexInline(e3, t3) {
+      return new u3(t3).inlineTokens(e3);
     }
-    lex(e) {
-      e = e.replace(m.carriageReturn, `
-`), this.blockTokens(e, this.tokens);
-      for (let t = 0;t < this.inlineQueue.length; t++) {
-        let n = this.inlineQueue[t];
-        this.inlineTokens(n.src, n.tokens);
+    lex(e3) {
+      e3 = e3.replace(m3.carriageReturn, `
+`), this.blockTokens(e3, this.tokens);
+      for (let t3 = 0;t3 < this.inlineQueue.length; t3++) {
+        let n2 = this.inlineQueue[t3];
+        this.inlineTokens(n2.src, n2.tokens);
       }
       return this.inlineQueue = [], this.tokens;
     }
-    blockTokens(e, t = [], n = false) {
-      for (this.options.pedantic && (e = e.replace(m.tabCharGlobal, "    ").replace(m.spaceLine, ""));e; ) {
-        let r;
-        if (this.options.extensions?.block?.some((s) => (r = s.call({ lexer: this }, e, t)) ? (e = e.substring(r.raw.length), t.push(r), true) : false))
+    blockTokens(e3, t3 = [], n2 = false) {
+      for (this.options.pedantic && (e3 = e3.replace(m3.tabCharGlobal, "    ").replace(m3.spaceLine, ""));e3; ) {
+        let r3;
+        if (this.options.extensions?.block?.some((s3) => (r3 = s3.call({ lexer: this }, e3, t3)) ? (e3 = e3.substring(r3.raw.length), t3.push(r3), true) : false))
           continue;
-        if (r = this.tokenizer.space(e)) {
-          e = e.substring(r.raw.length);
-          let s = t.at(-1);
-          r.raw.length === 1 && s !== undefined ? s.raw += `
-` : t.push(r);
+        if (r3 = this.tokenizer.space(e3)) {
+          e3 = e3.substring(r3.raw.length);
+          let s3 = t3.at(-1);
+          r3.raw.length === 1 && s3 !== undefined ? s3.raw += `
+` : t3.push(r3);
           continue;
         }
-        if (r = this.tokenizer.code(e)) {
-          e = e.substring(r.raw.length);
-          let s = t.at(-1);
-          s?.type === "paragraph" || s?.type === "text" ? (s.raw += (s.raw.endsWith(`
+        if (r3 = this.tokenizer.code(e3)) {
+          e3 = e3.substring(r3.raw.length);
+          let s3 = t3.at(-1);
+          s3?.type === "paragraph" || s3?.type === "text" ? (s3.raw += (s3.raw.endsWith(`
 `) ? "" : `
-`) + r.raw, s.text += `
-` + r.text, this.inlineQueue.at(-1).src = s.text) : t.push(r);
+`) + r3.raw, s3.text += `
+` + r3.text, this.inlineQueue.at(-1).src = s3.text) : t3.push(r3);
           continue;
         }
-        if (r = this.tokenizer.fences(e)) {
-          e = e.substring(r.raw.length), t.push(r);
+        if (r3 = this.tokenizer.fences(e3)) {
+          e3 = e3.substring(r3.raw.length), t3.push(r3);
           continue;
         }
-        if (r = this.tokenizer.heading(e)) {
-          e = e.substring(r.raw.length), t.push(r);
+        if (r3 = this.tokenizer.heading(e3)) {
+          e3 = e3.substring(r3.raw.length), t3.push(r3);
           continue;
         }
-        if (r = this.tokenizer.hr(e)) {
-          e = e.substring(r.raw.length), t.push(r);
+        if (r3 = this.tokenizer.hr(e3)) {
+          e3 = e3.substring(r3.raw.length), t3.push(r3);
           continue;
         }
-        if (r = this.tokenizer.blockquote(e)) {
-          e = e.substring(r.raw.length), t.push(r);
+        if (r3 = this.tokenizer.blockquote(e3)) {
+          e3 = e3.substring(r3.raw.length), t3.push(r3);
           continue;
         }
-        if (r = this.tokenizer.list(e)) {
-          e = e.substring(r.raw.length), t.push(r);
+        if (r3 = this.tokenizer.list(e3)) {
+          e3 = e3.substring(r3.raw.length), t3.push(r3);
           continue;
         }
-        if (r = this.tokenizer.html(e)) {
-          e = e.substring(r.raw.length), t.push(r);
+        if (r3 = this.tokenizer.html(e3)) {
+          e3 = e3.substring(r3.raw.length), t3.push(r3);
           continue;
         }
-        if (r = this.tokenizer.def(e)) {
-          e = e.substring(r.raw.length);
-          let s = t.at(-1);
-          s?.type === "paragraph" || s?.type === "text" ? (s.raw += (s.raw.endsWith(`
+        if (r3 = this.tokenizer.def(e3)) {
+          e3 = e3.substring(r3.raw.length);
+          let s3 = t3.at(-1);
+          s3?.type === "paragraph" || s3?.type === "text" ? (s3.raw += (s3.raw.endsWith(`
 `) ? "" : `
-`) + r.raw, s.text += `
-` + r.raw, this.inlineQueue.at(-1).src = s.text) : this.tokens.links[r.tag] || (this.tokens.links[r.tag] = { href: r.href, title: r.title }, t.push(r));
+`) + r3.raw, s3.text += `
+` + r3.raw, this.inlineQueue.at(-1).src = s3.text) : this.tokens.links[r3.tag] || (this.tokens.links[r3.tag] = { href: r3.href, title: r3.title }, t3.push(r3));
           continue;
         }
-        if (r = this.tokenizer.table(e)) {
-          e = e.substring(r.raw.length), t.push(r);
+        if (r3 = this.tokenizer.table(e3)) {
+          e3 = e3.substring(r3.raw.length), t3.push(r3);
           continue;
         }
-        if (r = this.tokenizer.lheading(e)) {
-          e = e.substring(r.raw.length), t.push(r);
+        if (r3 = this.tokenizer.lheading(e3)) {
+          e3 = e3.substring(r3.raw.length), t3.push(r3);
           continue;
         }
-        let i = e;
+        let i3 = e3;
         if (this.options.extensions?.startBlock) {
-          let s = 1 / 0, a = e.slice(1), o;
-          this.options.extensions.startBlock.forEach((l) => {
-            o = l.call({ lexer: this }, a), typeof o == "number" && o >= 0 && (s = Math.min(s, o));
-          }), s < 1 / 0 && s >= 0 && (i = e.substring(0, s + 1));
+          let s3 = 1 / 0, a3 = e3.slice(1), o3;
+          this.options.extensions.startBlock.forEach((l3) => {
+            o3 = l3.call({ lexer: this }, a3), typeof o3 == "number" && o3 >= 0 && (s3 = Math.min(s3, o3));
+          }), s3 < 1 / 0 && s3 >= 0 && (i3 = e3.substring(0, s3 + 1));
         }
-        if (this.state.top && (r = this.tokenizer.paragraph(i))) {
-          let s = t.at(-1);
-          n && s?.type === "paragraph" ? (s.raw += (s.raw.endsWith(`
+        if (this.state.top && (r3 = this.tokenizer.paragraph(i3))) {
+          let s3 = t3.at(-1);
+          n2 && s3?.type === "paragraph" ? (s3.raw += (s3.raw.endsWith(`
 `) ? "" : `
-`) + r.raw, s.text += `
-` + r.text, this.inlineQueue.pop(), this.inlineQueue.at(-1).src = s.text) : t.push(r), n = i.length !== e.length, e = e.substring(r.raw.length);
+`) + r3.raw, s3.text += `
+` + r3.text, this.inlineQueue.pop(), this.inlineQueue.at(-1).src = s3.text) : t3.push(r3), n2 = i3.length !== e3.length, e3 = e3.substring(r3.raw.length);
           continue;
         }
-        if (r = this.tokenizer.text(e)) {
-          e = e.substring(r.raw.length);
-          let s = t.at(-1);
-          s?.type === "text" ? (s.raw += (s.raw.endsWith(`
+        if (r3 = this.tokenizer.text(e3)) {
+          e3 = e3.substring(r3.raw.length);
+          let s3 = t3.at(-1);
+          s3?.type === "text" ? (s3.raw += (s3.raw.endsWith(`
 `) ? "" : `
-`) + r.raw, s.text += `
-` + r.text, this.inlineQueue.pop(), this.inlineQueue.at(-1).src = s.text) : t.push(r);
+`) + r3.raw, s3.text += `
+` + r3.text, this.inlineQueue.pop(), this.inlineQueue.at(-1).src = s3.text) : t3.push(r3);
           continue;
         }
-        if (e) {
-          let s = "Infinite loop on byte: " + e.charCodeAt(0);
+        if (e3) {
+          let s3 = "Infinite loop on byte: " + e3.charCodeAt(0);
           if (this.options.silent) {
-            console.error(s);
+            console.error(s3);
             break;
           } else
-            throw new Error(s);
+            throw new Error(s3);
         }
       }
-      return this.state.top = true, t;
+      return this.state.top = true, t3;
     }
-    inline(e, t = []) {
-      return this.inlineQueue.push({ src: e, tokens: t }), t;
+    inline(e3, t3 = []) {
+      return this.inlineQueue.push({ src: e3, tokens: t3 }), t3;
     }
-    inlineTokens(e, t = []) {
-      let n = e, r = null;
+    inlineTokens(e3, t3 = []) {
+      let n2 = e3, r3 = null;
       if (this.tokens.links) {
-        let o = Object.keys(this.tokens.links);
-        if (o.length > 0)
-          for (;(r = this.tokenizer.rules.inline.reflinkSearch.exec(n)) != null; )
-            o.includes(r[0].slice(r[0].lastIndexOf("[") + 1, -1)) && (n = n.slice(0, r.index) + "[" + "a".repeat(r[0].length - 2) + "]" + n.slice(this.tokenizer.rules.inline.reflinkSearch.lastIndex));
+        let o3 = Object.keys(this.tokens.links);
+        if (o3.length > 0)
+          for (;(r3 = this.tokenizer.rules.inline.reflinkSearch.exec(n2)) != null; )
+            o3.includes(r3[0].slice(r3[0].lastIndexOf("[") + 1, -1)) && (n2 = n2.slice(0, r3.index) + "[" + "a".repeat(r3[0].length - 2) + "]" + n2.slice(this.tokenizer.rules.inline.reflinkSearch.lastIndex));
       }
-      for (;(r = this.tokenizer.rules.inline.anyPunctuation.exec(n)) != null; )
-        n = n.slice(0, r.index) + "++" + n.slice(this.tokenizer.rules.inline.anyPunctuation.lastIndex);
-      let i;
-      for (;(r = this.tokenizer.rules.inline.blockSkip.exec(n)) != null; )
-        i = r[2] ? r[2].length : 0, n = n.slice(0, r.index + i) + "[" + "a".repeat(r[0].length - i - 2) + "]" + n.slice(this.tokenizer.rules.inline.blockSkip.lastIndex);
-      n = this.options.hooks?.emStrongMask?.call({ lexer: this }, n) ?? n;
-      let s = false, a = "";
-      for (;e; ) {
-        s || (a = ""), s = false;
-        let o;
-        if (this.options.extensions?.inline?.some((p) => (o = p.call({ lexer: this }, e, t)) ? (e = e.substring(o.raw.length), t.push(o), true) : false))
+      for (;(r3 = this.tokenizer.rules.inline.anyPunctuation.exec(n2)) != null; )
+        n2 = n2.slice(0, r3.index) + "++" + n2.slice(this.tokenizer.rules.inline.anyPunctuation.lastIndex);
+      let i3;
+      for (;(r3 = this.tokenizer.rules.inline.blockSkip.exec(n2)) != null; )
+        i3 = r3[2] ? r3[2].length : 0, n2 = n2.slice(0, r3.index + i3) + "[" + "a".repeat(r3[0].length - i3 - 2) + "]" + n2.slice(this.tokenizer.rules.inline.blockSkip.lastIndex);
+      n2 = this.options.hooks?.emStrongMask?.call({ lexer: this }, n2) ?? n2;
+      let s3 = false, a3 = "";
+      for (;e3; ) {
+        s3 || (a3 = ""), s3 = false;
+        let o3;
+        if (this.options.extensions?.inline?.some((p3) => (o3 = p3.call({ lexer: this }, e3, t3)) ? (e3 = e3.substring(o3.raw.length), t3.push(o3), true) : false))
           continue;
-        if (o = this.tokenizer.escape(e)) {
-          e = e.substring(o.raw.length), t.push(o);
+        if (o3 = this.tokenizer.escape(e3)) {
+          e3 = e3.substring(o3.raw.length), t3.push(o3);
           continue;
         }
-        if (o = this.tokenizer.tag(e)) {
-          e = e.substring(o.raw.length), t.push(o);
+        if (o3 = this.tokenizer.tag(e3)) {
+          e3 = e3.substring(o3.raw.length), t3.push(o3);
           continue;
         }
-        if (o = this.tokenizer.link(e)) {
-          e = e.substring(o.raw.length), t.push(o);
+        if (o3 = this.tokenizer.link(e3)) {
+          e3 = e3.substring(o3.raw.length), t3.push(o3);
           continue;
         }
-        if (o = this.tokenizer.reflink(e, this.tokens.links)) {
-          e = e.substring(o.raw.length);
-          let p = t.at(-1);
-          o.type === "text" && p?.type === "text" ? (p.raw += o.raw, p.text += o.text) : t.push(o);
+        if (o3 = this.tokenizer.reflink(e3, this.tokens.links)) {
+          e3 = e3.substring(o3.raw.length);
+          let p3 = t3.at(-1);
+          o3.type === "text" && p3?.type === "text" ? (p3.raw += o3.raw, p3.text += o3.text) : t3.push(o3);
           continue;
         }
-        if (o = this.tokenizer.emStrong(e, n, a)) {
-          e = e.substring(o.raw.length), t.push(o);
+        if (o3 = this.tokenizer.emStrong(e3, n2, a3)) {
+          e3 = e3.substring(o3.raw.length), t3.push(o3);
           continue;
         }
-        if (o = this.tokenizer.codespan(e)) {
-          e = e.substring(o.raw.length), t.push(o);
+        if (o3 = this.tokenizer.codespan(e3)) {
+          e3 = e3.substring(o3.raw.length), t3.push(o3);
           continue;
         }
-        if (o = this.tokenizer.br(e)) {
-          e = e.substring(o.raw.length), t.push(o);
+        if (o3 = this.tokenizer.br(e3)) {
+          e3 = e3.substring(o3.raw.length), t3.push(o3);
           continue;
         }
-        if (o = this.tokenizer.del(e, n, a)) {
-          e = e.substring(o.raw.length), t.push(o);
+        if (o3 = this.tokenizer.del(e3, n2, a3)) {
+          e3 = e3.substring(o3.raw.length), t3.push(o3);
           continue;
         }
-        if (o = this.tokenizer.autolink(e)) {
-          e = e.substring(o.raw.length), t.push(o);
+        if (o3 = this.tokenizer.autolink(e3)) {
+          e3 = e3.substring(o3.raw.length), t3.push(o3);
           continue;
         }
-        if (!this.state.inLink && (o = this.tokenizer.url(e))) {
-          e = e.substring(o.raw.length), t.push(o);
+        if (!this.state.inLink && (o3 = this.tokenizer.url(e3))) {
+          e3 = e3.substring(o3.raw.length), t3.push(o3);
           continue;
         }
-        let l = e;
+        let l3 = e3;
         if (this.options.extensions?.startInline) {
-          let p = 1 / 0, c = e.slice(1), d;
-          this.options.extensions.startInline.forEach((h) => {
-            d = h.call({ lexer: this }, c), typeof d == "number" && d >= 0 && (p = Math.min(p, d));
-          }), p < 1 / 0 && p >= 0 && (l = e.substring(0, p + 1));
+          let p3 = 1 / 0, c3 = e3.slice(1), d3;
+          this.options.extensions.startInline.forEach((h3) => {
+            d3 = h3.call({ lexer: this }, c3), typeof d3 == "number" && d3 >= 0 && (p3 = Math.min(p3, d3));
+          }), p3 < 1 / 0 && p3 >= 0 && (l3 = e3.substring(0, p3 + 1));
         }
-        if (o = this.tokenizer.inlineText(l)) {
-          e = e.substring(o.raw.length), o.raw.slice(-1) !== "_" && (a = o.raw.slice(-1)), s = true;
-          let p = t.at(-1);
-          p?.type === "text" ? (p.raw += o.raw, p.text += o.text) : t.push(o);
+        if (o3 = this.tokenizer.inlineText(l3)) {
+          e3 = e3.substring(o3.raw.length), o3.raw.slice(-1) !== "_" && (a3 = o3.raw.slice(-1)), s3 = true;
+          let p3 = t3.at(-1);
+          p3?.type === "text" ? (p3.raw += o3.raw, p3.text += o3.text) : t3.push(o3);
           continue;
         }
-        if (e) {
-          let p = "Infinite loop on byte: " + e.charCodeAt(0);
+        if (e3) {
+          let p3 = "Infinite loop on byte: " + e3.charCodeAt(0);
           if (this.options.silent) {
-            console.error(p);
+            console.error(p3);
             break;
           } else
-            throw new Error(p);
+            throw new Error(p3);
         }
       }
-      return t;
+      return t3;
     }
   };
-  var y = class {
+  var y3 = class {
     options;
     parser;
-    constructor(e) {
-      this.options = e || T;
+    constructor(e3) {
+      this.options = e3 || T3;
     }
-    space(e) {
+    space(e3) {
       return "";
     }
-    code({ text: e, lang: t, escaped: n }) {
-      let r = (t || "").match(m.notSpaceStart)?.[0], i = e.replace(m.endingNewline, "") + `
+    code({ text: e3, lang: t3, escaped: n2 }) {
+      let r3 = (t3 || "").match(m3.notSpaceStart)?.[0], i3 = e3.replace(m3.endingNewline, "") + `
 `;
-      return r ? '<pre><code class="language-' + O(r) + '">' + (n ? i : O(i, true)) + `</code></pre>
-` : "<pre><code>" + (n ? i : O(i, true)) + `</code></pre>
+      return r3 ? '<pre><code class="language-' + O2(r3) + '">' + (n2 ? i3 : O2(i3, true)) + `</code></pre>
+` : "<pre><code>" + (n2 ? i3 : O2(i3, true)) + `</code></pre>
 `;
     }
-    blockquote({ tokens: e }) {
+    blockquote({ tokens: e3 }) {
       return `<blockquote>
-${this.parser.parse(e)}</blockquote>
+${this.parser.parse(e3)}</blockquote>
 `;
     }
-    html({ text: e }) {
-      return e;
+    html({ text: e3 }) {
+      return e3;
     }
-    def(e) {
+    def(e3) {
       return "";
     }
-    heading({ tokens: e, depth: t }) {
-      return `<h${t}>${this.parser.parseInline(e)}</h${t}>
+    heading({ tokens: e3, depth: t3 }) {
+      return `<h${t3}>${this.parser.parseInline(e3)}</h${t3}>
 `;
     }
-    hr(e) {
+    hr(e3) {
       return `<hr>
 `;
     }
-    list(e) {
-      let { ordered: t, start: n } = e, r = "";
-      for (let a = 0;a < e.items.length; a++) {
-        let o = e.items[a];
-        r += this.listitem(o);
+    list(e3) {
+      let { ordered: t3, start: n2 } = e3, r3 = "";
+      for (let a3 = 0;a3 < e3.items.length; a3++) {
+        let o3 = e3.items[a3];
+        r3 += this.listitem(o3);
       }
-      let i = t ? "ol" : "ul", s = t && n !== 1 ? ' start="' + n + '"' : "";
-      return "<" + i + s + `>
-` + r + "</" + i + `>
+      let i3 = t3 ? "ol" : "ul", s3 = t3 && n2 !== 1 ? ' start="' + n2 + '"' : "";
+      return "<" + i3 + s3 + `>
+` + r3 + "</" + i3 + `>
 `;
     }
-    listitem(e) {
-      return `<li>${this.parser.parse(e.tokens)}</li>
+    listitem(e3) {
+      return `<li>${this.parser.parse(e3.tokens)}</li>
 `;
     }
-    checkbox({ checked: e }) {
-      return "<input " + (e ? 'checked="" ' : "") + 'disabled="" type="checkbox"> ';
+    checkbox({ checked: e3 }) {
+      return "<input " + (e3 ? 'checked="" ' : "") + 'disabled="" type="checkbox"> ';
     }
-    paragraph({ tokens: e }) {
-      return `<p>${this.parser.parseInline(e)}</p>
+    paragraph({ tokens: e3 }) {
+      return `<p>${this.parser.parseInline(e3)}</p>
 `;
     }
-    table(e) {
-      let t = "", n = "";
-      for (let i = 0;i < e.header.length; i++)
-        n += this.tablecell(e.header[i]);
-      t += this.tablerow({ text: n });
-      let r = "";
-      for (let i = 0;i < e.rows.length; i++) {
-        let s = e.rows[i];
-        n = "";
-        for (let a = 0;a < s.length; a++)
-          n += this.tablecell(s[a]);
-        r += this.tablerow({ text: n });
+    table(e3) {
+      let t3 = "", n2 = "";
+      for (let i3 = 0;i3 < e3.header.length; i3++)
+        n2 += this.tablecell(e3.header[i3]);
+      t3 += this.tablerow({ text: n2 });
+      let r3 = "";
+      for (let i3 = 0;i3 < e3.rows.length; i3++) {
+        let s3 = e3.rows[i3];
+        n2 = "";
+        for (let a3 = 0;a3 < s3.length; a3++)
+          n2 += this.tablecell(s3[a3]);
+        r3 += this.tablerow({ text: n2 });
       }
-      return r && (r = `<tbody>${r}</tbody>`), `<table>
+      return r3 && (r3 = `<tbody>${r3}</tbody>`), `<table>
 <thead>
-` + t + `</thead>
-` + r + `</table>
+` + t3 + `</thead>
+` + r3 + `</table>
 `;
     }
-    tablerow({ text: e }) {
+    tablerow({ text: e3 }) {
       return `<tr>
-${e}</tr>
+${e3}</tr>
 `;
     }
-    tablecell(e) {
-      let t = this.parser.parseInline(e.tokens), n = e.header ? "th" : "td";
-      return (e.align ? `<${n} align="${e.align}">` : `<${n}>`) + t + `</${n}>
+    tablecell(e3) {
+      let t3 = this.parser.parseInline(e3.tokens), n2 = e3.header ? "th" : "td";
+      return (e3.align ? `<${n2} align="${e3.align}">` : `<${n2}>`) + t3 + `</${n2}>
 `;
     }
-    strong({ tokens: e }) {
-      return `<strong>${this.parser.parseInline(e)}</strong>`;
+    strong({ tokens: e3 }) {
+      return `<strong>${this.parser.parseInline(e3)}</strong>`;
     }
-    em({ tokens: e }) {
-      return `<em>${this.parser.parseInline(e)}</em>`;
+    em({ tokens: e3 }) {
+      return `<em>${this.parser.parseInline(e3)}</em>`;
     }
-    codespan({ text: e }) {
-      return `<code>${O(e, true)}</code>`;
+    codespan({ text: e3 }) {
+      return `<code>${O2(e3, true)}</code>`;
     }
-    br(e) {
+    br(e3) {
       return "<br>";
     }
-    del({ tokens: e }) {
-      return `<del>${this.parser.parseInline(e)}</del>`;
+    del({ tokens: e3 }) {
+      return `<del>${this.parser.parseInline(e3)}</del>`;
     }
-    link({ href: e, title: t, tokens: n }) {
-      let r = this.parser.parseInline(n), i = X(e);
-      if (i === null)
-        return r;
-      e = i;
-      let s = '<a href="' + e + '"';
-      return t && (s += ' title="' + O(t) + '"'), s += ">" + r + "</a>", s;
+    link({ href: e3, title: t3, tokens: n2 }) {
+      let r3 = this.parser.parseInline(n2), i3 = X(e3);
+      if (i3 === null)
+        return r3;
+      e3 = i3;
+      let s3 = '<a href="' + e3 + '"';
+      return t3 && (s3 += ' title="' + O2(t3) + '"'), s3 += ">" + r3 + "</a>", s3;
     }
-    image({ href: e, title: t, text: n, tokens: r }) {
-      r && (n = this.parser.parseInline(r, this.parser.textRenderer));
-      let i = X(e);
-      if (i === null)
-        return O(n);
-      e = i;
-      let s = `<img src="${e}" alt="${O(n)}"`;
-      return t && (s += ` title="${O(t)}"`), s += ">", s;
+    image({ href: e3, title: t3, text: n2, tokens: r3 }) {
+      r3 && (n2 = this.parser.parseInline(r3, this.parser.textRenderer));
+      let i3 = X(e3);
+      if (i3 === null)
+        return O2(n2);
+      e3 = i3;
+      let s3 = `<img src="${e3}" alt="${O2(n2)}"`;
+      return t3 && (s3 += ` title="${O2(t3)}"`), s3 += ">", s3;
     }
-    text(e) {
-      return "tokens" in e && e.tokens ? this.parser.parseInline(e.tokens) : ("escaped" in e) && e.escaped ? e.text : O(e.text);
+    text(e3) {
+      return "tokens" in e3 && e3.tokens ? this.parser.parseInline(e3.tokens) : ("escaped" in e3) && e3.escaped ? e3.text : O2(e3.text);
     }
   };
-  var $ = class {
-    strong({ text: e }) {
-      return e;
+  var $2 = class {
+    strong({ text: e3 }) {
+      return e3;
     }
-    em({ text: e }) {
-      return e;
+    em({ text: e3 }) {
+      return e3;
     }
-    codespan({ text: e }) {
-      return e;
+    codespan({ text: e3 }) {
+      return e3;
     }
-    del({ text: e }) {
-      return e;
+    del({ text: e3 }) {
+      return e3;
     }
-    html({ text: e }) {
-      return e;
+    html({ text: e3 }) {
+      return e3;
     }
-    text({ text: e }) {
-      return e;
+    text({ text: e3 }) {
+      return e3;
     }
-    link({ text: e }) {
-      return "" + e;
+    link({ text: e3 }) {
+      return "" + e3;
     }
-    image({ text: e }) {
-      return "" + e;
+    image({ text: e3 }) {
+      return "" + e3;
     }
     br() {
       return "";
     }
-    checkbox({ raw: e }) {
-      return e;
+    checkbox({ raw: e3 }) {
+      return e3;
     }
   };
-  var b = class u2 {
+  var b = class u4 {
     options;
     renderer;
     textRenderer;
-    constructor(e) {
-      this.options = e || T, this.options.renderer = this.options.renderer || new y, this.renderer = this.options.renderer, this.renderer.options = this.options, this.renderer.parser = this, this.textRenderer = new $;
+    constructor(e3) {
+      this.options = e3 || T3, this.options.renderer = this.options.renderer || new y3, this.renderer = this.options.renderer, this.renderer.options = this.options, this.renderer.parser = this, this.textRenderer = new $2;
     }
-    static parse(e, t) {
-      return new u2(t).parse(e);
+    static parse(e3, t3) {
+      return new u4(t3).parse(e3);
     }
-    static parseInline(e, t) {
-      return new u2(t).parseInline(e);
+    static parseInline(e3, t3) {
+      return new u4(t3).parseInline(e3);
     }
-    parse(e) {
-      let t = "";
-      for (let n = 0;n < e.length; n++) {
-        let r = e[n];
-        if (this.options.extensions?.renderers?.[r.type]) {
-          let s = r, a = this.options.extensions.renderers[s.type].call({ parser: this }, s);
-          if (a !== false || !["space", "hr", "heading", "code", "table", "blockquote", "list", "html", "def", "paragraph", "text"].includes(s.type)) {
-            t += a || "";
+    parse(e3) {
+      let t3 = "";
+      for (let n2 = 0;n2 < e3.length; n2++) {
+        let r3 = e3[n2];
+        if (this.options.extensions?.renderers?.[r3.type]) {
+          let s3 = r3, a3 = this.options.extensions.renderers[s3.type].call({ parser: this }, s3);
+          if (a3 !== false || !["space", "hr", "heading", "code", "table", "blockquote", "list", "html", "def", "paragraph", "text"].includes(s3.type)) {
+            t3 += a3 || "";
             continue;
           }
         }
-        let i = r;
-        switch (i.type) {
+        let i3 = r3;
+        switch (i3.type) {
           case "space": {
-            t += this.renderer.space(i);
+            t3 += this.renderer.space(i3);
             break;
           }
           case "hr": {
-            t += this.renderer.hr(i);
+            t3 += this.renderer.hr(i3);
             break;
           }
           case "heading": {
-            t += this.renderer.heading(i);
+            t3 += this.renderer.heading(i3);
             break;
           }
           case "code": {
-            t += this.renderer.code(i);
+            t3 += this.renderer.code(i3);
             break;
           }
           case "table": {
-            t += this.renderer.table(i);
+            t3 += this.renderer.table(i3);
             break;
           }
           case "blockquote": {
-            t += this.renderer.blockquote(i);
+            t3 += this.renderer.blockquote(i3);
             break;
           }
           case "list": {
-            t += this.renderer.list(i);
+            t3 += this.renderer.list(i3);
             break;
           }
           case "checkbox": {
-            t += this.renderer.checkbox(i);
+            t3 += this.renderer.checkbox(i3);
             break;
           }
           case "html": {
-            t += this.renderer.html(i);
+            t3 += this.renderer.html(i3);
             break;
           }
           case "def": {
-            t += this.renderer.def(i);
+            t3 += this.renderer.def(i3);
             break;
           }
           case "paragraph": {
-            t += this.renderer.paragraph(i);
+            t3 += this.renderer.paragraph(i3);
             break;
           }
           case "text": {
-            t += this.renderer.text(i);
+            t3 += this.renderer.text(i3);
             break;
           }
           default: {
-            let s = 'Token with "' + i.type + '" type was not found.';
+            let s3 = 'Token with "' + i3.type + '" type was not found.';
             if (this.options.silent)
-              return console.error(s), "";
-            throw new Error(s);
+              return console.error(s3), "";
+            throw new Error(s3);
           }
         }
       }
-      return t;
+      return t3;
     }
-    parseInline(e, t = this.renderer) {
-      let n = "";
-      for (let r = 0;r < e.length; r++) {
-        let i = e[r];
-        if (this.options.extensions?.renderers?.[i.type]) {
-          let a = this.options.extensions.renderers[i.type].call({ parser: this }, i);
-          if (a !== false || !["escape", "html", "link", "image", "strong", "em", "codespan", "br", "del", "text"].includes(i.type)) {
-            n += a || "";
+    parseInline(e3, t3 = this.renderer) {
+      let n2 = "";
+      for (let r3 = 0;r3 < e3.length; r3++) {
+        let i3 = e3[r3];
+        if (this.options.extensions?.renderers?.[i3.type]) {
+          let a3 = this.options.extensions.renderers[i3.type].call({ parser: this }, i3);
+          if (a3 !== false || !["escape", "html", "link", "image", "strong", "em", "codespan", "br", "del", "text"].includes(i3.type)) {
+            n2 += a3 || "";
             continue;
           }
         }
-        let s = i;
-        switch (s.type) {
+        let s3 = i3;
+        switch (s3.type) {
           case "escape": {
-            n += t.text(s);
+            n2 += t3.text(s3);
             break;
           }
           case "html": {
-            n += t.html(s);
+            n2 += t3.html(s3);
             break;
           }
           case "link": {
-            n += t.link(s);
+            n2 += t3.link(s3);
             break;
           }
           case "image": {
-            n += t.image(s);
+            n2 += t3.image(s3);
             break;
           }
           case "checkbox": {
-            n += t.checkbox(s);
+            n2 += t3.checkbox(s3);
             break;
           }
           case "strong": {
-            n += t.strong(s);
+            n2 += t3.strong(s3);
             break;
           }
           case "em": {
-            n += t.em(s);
+            n2 += t3.em(s3);
             break;
           }
           case "codespan": {
-            n += t.codespan(s);
+            n2 += t3.codespan(s3);
             break;
           }
           case "br": {
-            n += t.br(s);
+            n2 += t3.br(s3);
             break;
           }
           case "del": {
-            n += t.del(s);
+            n2 += t3.del(s3);
             break;
           }
           case "text": {
-            n += t.text(s);
+            n2 += t3.text(s3);
             break;
           }
           default: {
-            let a = 'Token with "' + s.type + '" type was not found.';
+            let a3 = 'Token with "' + s3.type + '" type was not found.';
             if (this.options.silent)
-              return console.error(a), "";
-            throw new Error(a);
+              return console.error(a3), "";
+            throw new Error(a3);
           }
         }
       }
-      return n;
+      return n2;
     }
   };
-  var P = class {
+  var P2 = class {
     options;
     block;
-    constructor(e) {
-      this.options = e || T;
+    constructor(e3) {
+      this.options = e3 || T3;
     }
     static passThroughHooks = new Set(["preprocess", "postprocess", "processAllTokens", "emStrongMask"]);
     static passThroughHooksRespectAsync = new Set(["preprocess", "postprocess", "processAllTokens"]);
-    preprocess(e) {
-      return e;
+    preprocess(e3) {
+      return e3;
     }
-    postprocess(e) {
-      return e;
+    postprocess(e3) {
+      return e3;
     }
-    processAllTokens(e) {
-      return e;
+    processAllTokens(e3) {
+      return e3;
     }
-    emStrongMask(e) {
-      return e;
+    emStrongMask(e3) {
+      return e3;
     }
     provideLexer() {
-      return this.block ? x.lex : x.lexInline;
+      return this.block ? x2.lex : x2.lexInline;
     }
     provideParser() {
       return this.block ? b.parse : b.parseInline;
     }
   };
-  var B = class {
-    defaults = M();
+  var B3 = class {
+    defaults = M2();
     options = this.setOptions;
     parse = this.parseMarkdown(true);
     parseInline = this.parseMarkdown(false);
     Parser = b;
-    Renderer = y;
-    TextRenderer = $;
-    Lexer = x;
-    Tokenizer = w;
-    Hooks = P;
-    constructor(...e) {
-      this.use(...e);
+    Renderer = y3;
+    TextRenderer = $2;
+    Lexer = x2;
+    Tokenizer = w3;
+    Hooks = P2;
+    constructor(...e3) {
+      this.use(...e3);
     }
-    walkTokens(e, t) {
-      let n = [];
-      for (let r of e)
-        switch (n = n.concat(t.call(this, r)), r.type) {
+    walkTokens(e3, t3) {
+      let n2 = [];
+      for (let r3 of e3)
+        switch (n2 = n2.concat(t3.call(this, r3)), r3.type) {
           case "table": {
-            let i = r;
-            for (let s of i.header)
-              n = n.concat(this.walkTokens(s.tokens, t));
-            for (let s of i.rows)
-              for (let a of s)
-                n = n.concat(this.walkTokens(a.tokens, t));
+            let i3 = r3;
+            for (let s3 of i3.header)
+              n2 = n2.concat(this.walkTokens(s3.tokens, t3));
+            for (let s3 of i3.rows)
+              for (let a3 of s3)
+                n2 = n2.concat(this.walkTokens(a3.tokens, t3));
             break;
           }
           case "list": {
-            let i = r;
-            n = n.concat(this.walkTokens(i.items, t));
+            let i3 = r3;
+            n2 = n2.concat(this.walkTokens(i3.items, t3));
             break;
           }
           default: {
-            let i = r;
-            this.defaults.extensions?.childTokens?.[i.type] ? this.defaults.extensions.childTokens[i.type].forEach((s) => {
-              let a = i[s].flat(1 / 0);
-              n = n.concat(this.walkTokens(a, t));
-            }) : i.tokens && (n = n.concat(this.walkTokens(i.tokens, t)));
+            let i3 = r3;
+            this.defaults.extensions?.childTokens?.[i3.type] ? this.defaults.extensions.childTokens[i3.type].forEach((s3) => {
+              let a3 = i3[s3].flat(1 / 0);
+              n2 = n2.concat(this.walkTokens(a3, t3));
+            }) : i3.tokens && (n2 = n2.concat(this.walkTokens(i3.tokens, t3)));
           }
         }
-      return n;
+      return n2;
     }
-    use(...e) {
-      let t = this.defaults.extensions || { renderers: {}, childTokens: {} };
-      return e.forEach((n) => {
-        let r = { ...n };
-        if (r.async = this.defaults.async || r.async || false, n.extensions && (n.extensions.forEach((i) => {
-          if (!i.name)
+    use(...e3) {
+      let t3 = this.defaults.extensions || { renderers: {}, childTokens: {} };
+      return e3.forEach((n2) => {
+        let r3 = { ...n2 };
+        if (r3.async = this.defaults.async || r3.async || false, n2.extensions && (n2.extensions.forEach((i3) => {
+          if (!i3.name)
             throw new Error("extension name required");
-          if ("renderer" in i) {
-            let s = t.renderers[i.name];
-            s ? t.renderers[i.name] = function(...a) {
-              let o = i.renderer.apply(this, a);
-              return o === false && (o = s.apply(this, a)), o;
-            } : t.renderers[i.name] = i.renderer;
+          if ("renderer" in i3) {
+            let s3 = t3.renderers[i3.name];
+            s3 ? t3.renderers[i3.name] = function(...a3) {
+              let o3 = i3.renderer.apply(this, a3);
+              return o3 === false && (o3 = s3.apply(this, a3)), o3;
+            } : t3.renderers[i3.name] = i3.renderer;
           }
-          if ("tokenizer" in i) {
-            if (!i.level || i.level !== "block" && i.level !== "inline")
+          if ("tokenizer" in i3) {
+            if (!i3.level || i3.level !== "block" && i3.level !== "inline")
               throw new Error("extension level must be 'block' or 'inline'");
-            let s = t[i.level];
-            s ? s.unshift(i.tokenizer) : t[i.level] = [i.tokenizer], i.start && (i.level === "block" ? t.startBlock ? t.startBlock.push(i.start) : t.startBlock = [i.start] : i.level === "inline" && (t.startInline ? t.startInline.push(i.start) : t.startInline = [i.start]));
+            let s3 = t3[i3.level];
+            s3 ? s3.unshift(i3.tokenizer) : t3[i3.level] = [i3.tokenizer], i3.start && (i3.level === "block" ? t3.startBlock ? t3.startBlock.push(i3.start) : t3.startBlock = [i3.start] : i3.level === "inline" && (t3.startInline ? t3.startInline.push(i3.start) : t3.startInline = [i3.start]));
           }
-          "childTokens" in i && i.childTokens && (t.childTokens[i.name] = i.childTokens);
-        }), r.extensions = t), n.renderer) {
-          let i = this.defaults.renderer || new y(this.defaults);
-          for (let s in n.renderer) {
-            if (!(s in i))
-              throw new Error(`renderer '${s}' does not exist`);
-            if (["options", "parser"].includes(s))
+          "childTokens" in i3 && i3.childTokens && (t3.childTokens[i3.name] = i3.childTokens);
+        }), r3.extensions = t3), n2.renderer) {
+          let i3 = this.defaults.renderer || new y3(this.defaults);
+          for (let s3 in n2.renderer) {
+            if (!(s3 in i3))
+              throw new Error(`renderer '${s3}' does not exist`);
+            if (["options", "parser"].includes(s3))
               continue;
-            let a = s, o = n.renderer[a], l = i[a];
-            i[a] = (...p) => {
-              let c = o.apply(i, p);
-              return c === false && (c = l.apply(i, p)), c || "";
+            let a3 = s3, o3 = n2.renderer[a3], l3 = i3[a3];
+            i3[a3] = (...p3) => {
+              let c3 = o3.apply(i3, p3);
+              return c3 === false && (c3 = l3.apply(i3, p3)), c3 || "";
             };
           }
-          r.renderer = i;
+          r3.renderer = i3;
         }
-        if (n.tokenizer) {
-          let i = this.defaults.tokenizer || new w(this.defaults);
-          for (let s in n.tokenizer) {
-            if (!(s in i))
-              throw new Error(`tokenizer '${s}' does not exist`);
-            if (["options", "rules", "lexer"].includes(s))
+        if (n2.tokenizer) {
+          let i3 = this.defaults.tokenizer || new w3(this.defaults);
+          for (let s3 in n2.tokenizer) {
+            if (!(s3 in i3))
+              throw new Error(`tokenizer '${s3}' does not exist`);
+            if (["options", "rules", "lexer"].includes(s3))
               continue;
-            let a = s, o = n.tokenizer[a], l = i[a];
-            i[a] = (...p) => {
-              let c = o.apply(i, p);
-              return c === false && (c = l.apply(i, p)), c;
+            let a3 = s3, o3 = n2.tokenizer[a3], l3 = i3[a3];
+            i3[a3] = (...p3) => {
+              let c3 = o3.apply(i3, p3);
+              return c3 === false && (c3 = l3.apply(i3, p3)), c3;
             };
           }
-          r.tokenizer = i;
+          r3.tokenizer = i3;
         }
-        if (n.hooks) {
-          let i = this.defaults.hooks || new P;
-          for (let s in n.hooks) {
-            if (!(s in i))
-              throw new Error(`hook '${s}' does not exist`);
-            if (["options", "block"].includes(s))
+        if (n2.hooks) {
+          let i3 = this.defaults.hooks || new P2;
+          for (let s3 in n2.hooks) {
+            if (!(s3 in i3))
+              throw new Error(`hook '${s3}' does not exist`);
+            if (["options", "block"].includes(s3))
               continue;
-            let a = s, o = n.hooks[a], l = i[a];
-            P.passThroughHooks.has(s) ? i[a] = (p) => {
-              if (this.defaults.async && P.passThroughHooksRespectAsync.has(s))
+            let a3 = s3, o3 = n2.hooks[a3], l3 = i3[a3];
+            P2.passThroughHooks.has(s3) ? i3[a3] = (p3) => {
+              if (this.defaults.async && P2.passThroughHooksRespectAsync.has(s3))
                 return (async () => {
-                  let d = await o.call(i, p);
-                  return l.call(i, d);
+                  let d3 = await o3.call(i3, p3);
+                  return l3.call(i3, d3);
                 })();
-              let c = o.call(i, p);
-              return l.call(i, c);
-            } : i[a] = (...p) => {
+              let c3 = o3.call(i3, p3);
+              return l3.call(i3, c3);
+            } : i3[a3] = (...p3) => {
               if (this.defaults.async)
                 return (async () => {
-                  let d = await o.apply(i, p);
-                  return d === false && (d = await l.apply(i, p)), d;
+                  let d3 = await o3.apply(i3, p3);
+                  return d3 === false && (d3 = await l3.apply(i3, p3)), d3;
                 })();
-              let c = o.apply(i, p);
-              return c === false && (c = l.apply(i, p)), c;
+              let c3 = o3.apply(i3, p3);
+              return c3 === false && (c3 = l3.apply(i3, p3)), c3;
             };
           }
-          r.hooks = i;
+          r3.hooks = i3;
         }
-        if (n.walkTokens) {
-          let i = this.defaults.walkTokens, s = n.walkTokens;
-          r.walkTokens = function(a) {
-            let o = [];
-            return o.push(s.call(this, a)), i && (o = o.concat(i.call(this, a))), o;
+        if (n2.walkTokens) {
+          let i3 = this.defaults.walkTokens, s3 = n2.walkTokens;
+          r3.walkTokens = function(a3) {
+            let o3 = [];
+            return o3.push(s3.call(this, a3)), i3 && (o3 = o3.concat(i3.call(this, a3))), o3;
           };
         }
-        this.defaults = { ...this.defaults, ...r };
+        this.defaults = { ...this.defaults, ...r3 };
       }), this;
     }
-    setOptions(e) {
-      return this.defaults = { ...this.defaults, ...e }, this;
+    setOptions(e3) {
+      return this.defaults = { ...this.defaults, ...e3 }, this;
     }
-    lexer(e, t) {
-      return x.lex(e, t ?? this.defaults);
+    lexer(e3, t3) {
+      return x2.lex(e3, t3 ?? this.defaults);
     }
-    parser(e, t) {
-      return b.parse(e, t ?? this.defaults);
+    parser(e3, t3) {
+      return b.parse(e3, t3 ?? this.defaults);
     }
-    parseMarkdown(e) {
-      return (n, r) => {
-        let i = { ...r }, s = { ...this.defaults, ...i }, a = this.onError(!!s.silent, !!s.async);
-        if (this.defaults.async === true && i.async === false)
-          return a(new Error("marked(): The async option was set to true by an extension. Remove async: false from the parse options object to return a Promise."));
-        if (typeof n > "u" || n === null)
-          return a(new Error("marked(): input parameter is undefined or null"));
-        if (typeof n != "string")
-          return a(new Error("marked(): input parameter is of type " + Object.prototype.toString.call(n) + ", string expected"));
-        if (s.hooks && (s.hooks.options = s, s.hooks.block = e), s.async)
+    parseMarkdown(e3) {
+      return (n2, r3) => {
+        let i3 = { ...r3 }, s3 = { ...this.defaults, ...i3 }, a3 = this.onError(!!s3.silent, !!s3.async);
+        if (this.defaults.async === true && i3.async === false)
+          return a3(new Error("marked(): The async option was set to true by an extension. Remove async: false from the parse options object to return a Promise."));
+        if (typeof n2 > "u" || n2 === null)
+          return a3(new Error("marked(): input parameter is undefined or null"));
+        if (typeof n2 != "string")
+          return a3(new Error("marked(): input parameter is of type " + Object.prototype.toString.call(n2) + ", string expected"));
+        if (s3.hooks && (s3.hooks.options = s3, s3.hooks.block = e3), s3.async)
           return (async () => {
-            let o = s.hooks ? await s.hooks.preprocess(n) : n, p = await (s.hooks ? await s.hooks.provideLexer() : e ? x.lex : x.lexInline)(o, s), c = s.hooks ? await s.hooks.processAllTokens(p) : p;
-            s.walkTokens && await Promise.all(this.walkTokens(c, s.walkTokens));
-            let h = await (s.hooks ? await s.hooks.provideParser() : e ? b.parse : b.parseInline)(c, s);
-            return s.hooks ? await s.hooks.postprocess(h) : h;
-          })().catch(a);
+            let o3 = s3.hooks ? await s3.hooks.preprocess(n2) : n2, p3 = await (s3.hooks ? await s3.hooks.provideLexer() : e3 ? x2.lex : x2.lexInline)(o3, s3), c3 = s3.hooks ? await s3.hooks.processAllTokens(p3) : p3;
+            s3.walkTokens && await Promise.all(this.walkTokens(c3, s3.walkTokens));
+            let h3 = await (s3.hooks ? await s3.hooks.provideParser() : e3 ? b.parse : b.parseInline)(c3, s3);
+            return s3.hooks ? await s3.hooks.postprocess(h3) : h3;
+          })().catch(a3);
         try {
-          s.hooks && (n = s.hooks.preprocess(n));
-          let l = (s.hooks ? s.hooks.provideLexer() : e ? x.lex : x.lexInline)(n, s);
-          s.hooks && (l = s.hooks.processAllTokens(l)), s.walkTokens && this.walkTokens(l, s.walkTokens);
-          let c = (s.hooks ? s.hooks.provideParser() : e ? b.parse : b.parseInline)(l, s);
-          return s.hooks && (c = s.hooks.postprocess(c)), c;
-        } catch (o) {
-          return a(o);
+          s3.hooks && (n2 = s3.hooks.preprocess(n2));
+          let l3 = (s3.hooks ? s3.hooks.provideLexer() : e3 ? x2.lex : x2.lexInline)(n2, s3);
+          s3.hooks && (l3 = s3.hooks.processAllTokens(l3)), s3.walkTokens && this.walkTokens(l3, s3.walkTokens);
+          let c3 = (s3.hooks ? s3.hooks.provideParser() : e3 ? b.parse : b.parseInline)(l3, s3);
+          return s3.hooks && (c3 = s3.hooks.postprocess(c3)), c3;
+        } catch (o3) {
+          return a3(o3);
         }
       };
     }
-    onError(e, t) {
-      return (n) => {
-        if (n.message += `
-Please report this to https://github.com/markedjs/marked.`, e) {
-          let r = "<p>An error occurred:</p><pre>" + O(n.message + "", true) + "</pre>";
-          return t ? Promise.resolve(r) : r;
+    onError(e3, t3) {
+      return (n2) => {
+        if (n2.message += `
+Please report this to https://github.com/markedjs/marked.`, e3) {
+          let r3 = "<p>An error occurred:</p><pre>" + O2(n2.message + "", true) + "</pre>";
+          return t3 ? Promise.resolve(r3) : r3;
         }
-        if (t)
-          return Promise.reject(n);
-        throw n;
+        if (t3)
+          return Promise.reject(n2);
+        throw n2;
       };
     }
   };
-  var L = new B;
-  function g(u3, e) {
-    return L.parse(u3, e);
+  var L = new B3;
+  function g2(u5, e3) {
+    return L.parse(u5, e3);
   }
-  g.options = g.setOptions = function(u3) {
-    return L.setOptions(u3), g.defaults = L.defaults, G(g.defaults), g;
+  g2.options = g2.setOptions = function(u5) {
+    return L.setOptions(u5), g2.defaults = L.defaults, G2(g2.defaults), g2;
   };
-  g.getDefaults = M;
-  g.defaults = T;
-  g.use = function(...u3) {
-    return L.use(...u3), g.defaults = L.defaults, G(g.defaults), g;
+  g2.getDefaults = M2;
+  g2.defaults = T3;
+  g2.use = function(...u5) {
+    return L.use(...u5), g2.defaults = L.defaults, G2(g2.defaults), g2;
   };
-  g.walkTokens = function(u3, e) {
-    return L.walkTokens(u3, e);
+  g2.walkTokens = function(u5, e3) {
+    return L.walkTokens(u5, e3);
   };
-  g.parseInline = L.parseInline;
-  g.Parser = b;
-  g.parser = b.parse;
-  g.Renderer = y;
-  g.TextRenderer = $;
-  g.Lexer = x;
-  g.lexer = x.lex;
-  g.Tokenizer = w;
-  g.Hooks = P;
-  g.parse = g;
-  var Ut = g.options;
-  var Kt = g.setOptions;
-  var Wt = g.use;
-  var Xt = g.walkTokens;
-  var Jt = g.parseInline;
+  g2.parseInline = L.parseInline;
+  g2.Parser = b;
+  g2.parser = b.parse;
+  g2.Renderer = y3;
+  g2.TextRenderer = $2;
+  g2.Lexer = x2;
+  g2.lexer = x2.lex;
+  g2.Tokenizer = w3;
+  g2.Hooks = P2;
+  g2.parse = g2;
+  var Ut = g2.options;
+  var Kt = g2.setOptions;
+  var Wt = g2.use;
+  var Xt = g2.walkTokens;
+  var Jt = g2.parseInline;
   var Yt = b.parse;
-  var en = x.lex;
+  var en = x2.lex;
 
   // node_modules/highlight.js/es/core.js
   var import_core = __toESM(require_core(), 1);
@@ -2915,14 +3517,14 @@ Please report this to https://github.com/markedjs/marked.`, e) {
             response.ignoreMatch();
           }
         }
-        let m2;
+        let m4;
         const afterMatch = match.input.substring(afterMatchIndex);
-        if (m2 = afterMatch.match(/^\s*=/)) {
+        if (m4 = afterMatch.match(/^\s*=/)) {
           response.ignoreMatch();
           return;
         }
-        if (m2 = afterMatch.match(/^\s+extends\s+/)) {
-          if (m2.index === 0) {
+        if (m4 = afterMatch.match(/^\s+extends\s+/)) {
+          if (m4.index === 0) {
             response.ignoreMatch();
             return;
           }
@@ -3171,7 +3773,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
         ...BUILT_IN_GLOBALS,
         "super",
         "import"
-      ].map((x2) => `${x2}\\s*\\(`)), IDENT_RE$1, regex.lookahead(/\s*\(/)),
+      ].map((x3) => `${x3}\\s*\\(`)), IDENT_RE$1, regex.lookahead(/\s*\(/)),
       className: "title.function",
       relevance: 0
     };
@@ -4655,14 +5257,14 @@ Please report this to https://github.com/markedjs/marked.`, e) {
             response.ignoreMatch();
           }
         }
-        let m2;
+        let m4;
         const afterMatch = match.input.substring(afterMatchIndex);
-        if (m2 = afterMatch.match(/^\s*=/)) {
+        if (m4 = afterMatch.match(/^\s*=/)) {
           response.ignoreMatch();
           return;
         }
-        if (m2 = afterMatch.match(/^\s+extends\s+/)) {
-          if (m2.index === 0) {
+        if (m4 = afterMatch.match(/^\s+extends\s+/)) {
+          if (m4.index === 0) {
             response.ignoreMatch();
             return;
           }
@@ -4911,7 +5513,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
         ...BUILT_IN_GLOBALS2,
         "super",
         "import"
-      ].map((x2) => `${x2}\\s*\\(`)), IDENT_RE$1, regex.lookahead(/\s*\(/)),
+      ].map((x3) => `${x3}\\s*\\(`)), IDENT_RE$1, regex.lookahead(/\s*\(/)),
       className: "title.function",
       relevance: 0
     };
@@ -5162,7 +5764,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       begin: "@" + IDENT_RE$1
     };
     const swapMode = (mode, label, replacement) => {
-      const indx = mode.contains.findIndex((m2) => m2.label === label);
+      const indx = mode.contains.findIndex((m4) => m4.label === label);
       if (indx === -1) {
         throw new Error("can not find mode to replace");
       }
@@ -5170,7 +5772,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     };
     Object.assign(tsLanguage.keywords, KEYWORDS$1);
     tsLanguage.exports.PARAMS_CONTAINS.push(DECORATOR);
-    const ATTRIBUTE_HIGHLIGHT = tsLanguage.contains.find((c) => c.scope === "attr");
+    const ATTRIBUTE_HIGHLIGHT = tsLanguage.contains.find((c3) => c3.scope === "attr");
     const OPTIONAL_KEY_OR_ARGUMENT = Object.assign({}, ATTRIBUTE_HIGHLIGHT, { match: regex.concat(IDENT_RE$1, regex.lookahead(/\s*\?:/)) });
     tsLanguage.exports.PARAMS_CONTAINS.push([
       tsLanguage.exports.CLASS_REFERENCE,
@@ -5185,7 +5787,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     ]);
     swapMode(tsLanguage, "shebang", hljs.SHEBANG());
     swapMode(tsLanguage, "use_strict", USE_STRICT);
-    const functionDeclaration = tsLanguage.contains.find((m2) => m2.label === "func.def");
+    const functionDeclaration = tsLanguage.contains.find((m4) => m4.label === "func.def");
     functionDeclaration.relevance = 0;
     Object.assign(tsLanguage, {
       name: "TypeScript",
@@ -5811,7 +6413,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       illegal: /[{}]|<\//,
       keywords: {
         $pattern: /\b[\w\.]+/,
-        keyword: reduceRelevancy(KEYWORDS3, { when: (x2) => x2.length < 3 }),
+        keyword: reduceRelevancy(KEYWORDS3, { when: (x3) => x3.length < 3 }),
         literal: LITERALS3,
         type: TYPES3,
         built_in: POSSIBLE_WITHOUT_PARENS
@@ -7095,8 +7697,8 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       ITALIC,
       BOLD_WITHOUT_ITALIC,
       ITALIC_WITHOUT_BOLD
-    ].forEach((m2) => {
-      m2.contains = m2.contains.concat(CONTAINABLE);
+    ].forEach((m4) => {
+      m4.contains = m4.contains.concat(CONTAINABLE);
     });
     CONTAINABLE = CONTAINABLE.concat(BOLD, ITALIC);
     const HEADER = {
@@ -7153,6 +7755,1962 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     };
   }
 
+  // src/markdown.ts
+  core_default.registerLanguage("javascript", javascript);
+  core_default.registerLanguage("js", javascript);
+  core_default.registerLanguage("python", python);
+  core_default.registerLanguage("py", python);
+  core_default.registerLanguage("go", go);
+  core_default.registerLanguage("bash", bash);
+  core_default.registerLanguage("sh", bash);
+  core_default.registerLanguage("json", json);
+  core_default.registerLanguage("yaml", yaml);
+  core_default.registerLanguage("yml", yaml);
+  core_default.registerLanguage("typescript", typescript);
+  core_default.registerLanguage("ts", typescript);
+  core_default.registerLanguage("sql", sql);
+  core_default.registerLanguage("xml", xml);
+  core_default.registerLanguage("html", xml);
+  core_default.registerLanguage("css", css);
+  core_default.registerLanguage("markdown", markdown);
+  core_default.registerLanguage("md", markdown);
+  g2.setOptions({
+    highlight: function(code, lang) {
+      if (lang && core_default.getLanguage(lang)) {
+        return core_default.highlight(code, { language: lang }).value;
+      }
+      return core_default.highlightAuto(code).value;
+    },
+    breaks: true,
+    gfm: true
+  });
+  function renderMarkdown(text) {
+    return g2.parse(text);
+  }
+  // node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js
+  var f3 = 0;
+  function u5(e3, t3, n2, o3, i3, u6) {
+    t3 || (t3 = {});
+    var a3, c3, p3 = t3;
+    if ("ref" in p3)
+      for (c3 in p3 = {}, t3)
+        c3 == "ref" ? a3 = t3[c3] : p3[c3] = t3[c3];
+    var l3 = { type: e3, props: p3, key: n2, ref: a3, __k: null, __: null, __b: 0, __e: null, __c: null, constructor: undefined, __v: --f3, __i: -1, __u: 0, __source: i3, __self: u6 };
+    if (typeof e3 == "function" && (a3 = e3.defaultProps))
+      for (c3 in a3)
+        p3[c3] === undefined && (p3[c3] = a3[c3]);
+    return l.vnode && l.vnode(l3), l3;
+  }
+
+  // src/components/plan/slide-approve.tsx
+  function SlideApprove({ label, cmd, warn }) {
+    const trackRef = A2(null);
+    const thumbRef = A2(null);
+    const labelRef = A2(null);
+    y2(() => {
+      const track = trackRef.current;
+      const thumb = thumbRef.current;
+      if (!track || !thumb)
+        return;
+      const ac = new AbortController;
+      const signal = ac.signal;
+      let dragging = false;
+      let startX = 0;
+      let thumbStartLeft = 0;
+      function getMaxLeft() {
+        return track.offsetWidth - thumb.offsetWidth - 6;
+      }
+      function markApproved() {
+        track.classList.add("approved");
+        if (labelRef.current)
+          labelRef.current.textContent = "Approved!";
+        thumb.classList.add("hidden");
+      }
+      function onStart(e3) {
+        if (track.classList.contains("approved"))
+          return;
+        dragging = true;
+        thumb.classList.add("dragging");
+        const clientX = "touches" in e3 ? e3.touches[0].clientX : e3.clientX;
+        startX = clientX;
+        thumbStartLeft = thumb.offsetLeft - 3;
+        e3.preventDefault();
+      }
+      function onMove(e3) {
+        if (!dragging)
+          return;
+        const clientX = "touches" in e3 ? e3.touches[0].clientX : e3.clientX;
+        const dx = clientX - startX;
+        const newLeft = Math.max(0, Math.min(thumbStartLeft + dx, getMaxLeft()));
+        thumb.style.left = newLeft + 3 + "px";
+        e3.preventDefault();
+      }
+      function onEnd() {
+        if (!dragging)
+          return;
+        dragging = false;
+        thumb.classList.remove("dragging");
+        const currentLeft = thumb.offsetLeft - 3;
+        const maxLeft = getMaxLeft();
+        if (currentLeft >= maxLeft * 0.8) {
+          markApproved();
+          sendCommand(cmd);
+        } else {
+          thumb.style.left = "3px";
+        }
+      }
+      thumb.addEventListener("touchstart", onStart, {
+        passive: false,
+        signal
+      });
+      thumb.addEventListener("mousedown", onStart, { signal });
+      document.addEventListener("touchmove", onMove, {
+        passive: false,
+        signal
+      });
+      document.addEventListener("mousemove", onMove, { signal });
+      document.addEventListener("touchend", onEnd, { signal });
+      document.addEventListener("mouseup", onEnd, { signal });
+      return () => ac.abort();
+    }, [cmd]);
+    const borderStyle = warn ? { borderColor: "var(--warn, #ff9800)" } : undefined;
+    const thumbStyle = warn ? { background: "var(--warn, #ff9800)" } : undefined;
+    return /* @__PURE__ */ u5("div", {
+      class: "slide-approve-wrap",
+      children: /* @__PURE__ */ u5("div", {
+        class: "slide-approve-track glass glass-interactive",
+        ref: trackRef,
+        style: borderStyle,
+        children: [
+          /* @__PURE__ */ u5("div", {
+            class: "slide-approve-thumb",
+            ref: thumbRef,
+            style: thumbStyle,
+            children: /* @__PURE__ */ u5("svg", {
+              viewBox: "0 0 24 24",
+              children: /* @__PURE__ */ u5("path", {
+                d: "M5 12h14m-6-6 6 6-6 6",
+                stroke: "currentColor",
+                "stroke-width": "2.5",
+                "stroke-linecap": "round",
+                "stroke-linejoin": "round",
+                fill: "none"
+              }, undefined, false, undefined, this)
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ u5("div", {
+            class: "slide-approve-label",
+            ref: labelRef,
+            children: label
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this)
+    }, undefined, false, undefined, this);
+  }
+
+  // src/components/plan/orch-canvas.tsx
+  var BOB = [0, -1, -2, -1];
+  var FRAME_MS = {
+    idle: 450,
+    waiting: 650,
+    toolcall: 90,
+    talking: 280,
+    entering: 220,
+    exiting: 220
+  };
+  var WALK = 55;
+  var conductor;
+  var secretary;
+  var heartbeat;
+  var subagents;
+  var slots = {};
+  var freeSlots = [];
+  var inited = false;
+  var orchWs = null;
+  var orchReconnectTimer = null;
+  var lastTs = null;
+  function makeChar(id, emoji, home) {
+    return {
+      id,
+      emoji,
+      x: home.x,
+      y: home.y,
+      home,
+      target: null,
+      state: "idle",
+      frame: 0,
+      frameTimer: 0,
+      bubble: null,
+      alive: false,
+      _onArrive: null
+    };
+  }
+  function initChars() {
+    const MAP = window.MAP_POSITIONS;
+    conductor = makeChar("conductor", "\uD83D\uDC51", MAP.conductor);
+    secretary = makeChar("secretary", "\uD83D\uDC69‍\uD83D\uDCBC", MAP.secretary);
+    heartbeat = makeChar("heartbeat", "\uD83D\uDD4A️", MAP.heartbeat || { x: 230, y: 58 });
+    conductor.alive = true;
+    secretary.alive = false;
+    heartbeat.alive = true;
+    conductor.statusText = null;
+    heartbeat.facing = 1;
+    heartbeat.flipTimer = 0;
+    const ps = [
+      { id: "s0", emoji: "\uD83D\uDD0D" },
+      { id: "s1", emoji: "\uD83D\uDCCA" },
+      { id: "s2", emoji: "\uD83D\uDCBB" },
+      { id: "s3", emoji: "\uD83D\uDD27" },
+      { id: "s4", emoji: "\uD83C\uDFAF" }
+    ];
+    subagents = ps.map((p3, i3) => {
+      const c3 = makeChar(p3.id, p3.emoji, MAP.stations[i3]);
+      c3.x = MAP.door.x;
+      c3.y = MAP.door.y;
+      return c3;
+    });
+    slots = {};
+    freeSlots = subagents.slice();
+  }
+  function allChars() {
+    return [conductor, secretary, heartbeat, ...subagents];
+  }
+  function syncBadge(id, state, alive) {
+    const el = document.getElementById("orch-badge-" + id);
+    if (!el)
+      return;
+    el.className = "orch-badge" + (alive ? " alive" : "") + (state === "talking" ? " talking" : "") + (state === "toolcall" ? " toolcall" : "") + (state === "waiting" ? " waiting" : "");
+  }
+  function setState(c3, state) {
+    c3.state = state;
+    syncBadge(c3.id, state, c3.alive);
+    if (c3 === conductor) {
+      if (state === "waiting")
+        c3.statusText = "\uD83E\uDD14";
+      else if (state === "toolcall")
+        c3.statusText = "⌨";
+      else if (state === "user_waiting")
+        c3.statusText = "⏳";
+      else if (state === "plan_interviewing")
+        c3.statusText = "\uD83D\uDCCB";
+      else if (state === "plan_review")
+        c3.statusText = "\uD83D\uDD0D";
+      else if (state === "plan_executing")
+        c3.statusText = "▶️";
+      else if (state === "plan_completed")
+        c3.statusText = "✅";
+      else
+        c3.statusText = null;
+      const inPlan = state.indexOf("plan_") === 0;
+      if (secretary.alive !== inPlan) {
+        secretary.alive = inPlan;
+        syncBadge("secretary", secretary.state, secretary.alive);
+      }
+    }
+  }
+  function moveTo(c3, pos, cb) {
+    c3.target = pos;
+    c3._onArrive = cb || null;
+  }
+  function say(c3, text, ttl = 2200) {
+    c3.bubble = { text, ttl };
+  }
+  function charForId(id) {
+    if (id === "heartbeat")
+      return heartbeat;
+    if (slots[id])
+      return slots[id];
+    return conductor;
+  }
+  function spawn(id) {
+    if (/^subagent-/.test(id)) {
+      const c3 = freeSlots.shift();
+      if (!c3)
+        return;
+      slots[id] = c3;
+      c3.alive = true;
+      c3.x = window.MAP_POSITIONS.door.x;
+      c3.y = window.MAP_POSITIONS.door.y;
+      setState(c3, "entering");
+      moveTo(c3, c3.home, () => setState(c3, "idle"));
+    } else {
+      const ch = charForId(id);
+      ch.alive = true;
+      setState(ch, "waiting");
+    }
+  }
+  function gc(id) {
+    if (/^subagent-/.test(id)) {
+      const c3 = slots[id];
+      if (!c3)
+        return;
+      delete slots[id];
+      freeSlots.push(c3);
+      setState(c3, "exiting");
+      moveTo(c3, window.MAP_POSITIONS.door, () => {
+        c3.alive = false;
+        setState(c3, "idle");
+      });
+    } else {
+      const ch = charForId(id);
+      if (ch === heartbeat) {
+        setState(ch, "idle");
+      } else if (ch === conductor) {
+        setState(ch, "user_waiting");
+      } else {
+        ch.alive = false;
+        setState(ch, "idle");
+      }
+    }
+  }
+  function converse(fromId, toId, text) {
+    const from = charForId(fromId);
+    const to = charForId(toId);
+    if (!from || !to || from === to)
+      return;
+    const label = (text || "").slice(0, 18);
+    const mid = { x: (from.x + to.x) / 2, y: (from.y + to.y) / 2 };
+    setState(from, "talking");
+    setState(to, "talking");
+    moveTo(from, { x: mid.x - 18, y: mid.y }, () => say(from, label, 2400));
+    moveTo(to, { x: mid.x + 18, y: mid.y }, () => {
+      setTimeout(() => {
+        moveTo(from, from.home, () => setState(from, "idle"));
+        moveTo(to, to.home, () => setState(to, "idle"));
+      }, 2600);
+    });
+  }
+  function update(dt) {
+    allChars().forEach((c3) => {
+      if (!c3.alive && c3.state !== "entering")
+        return;
+      if (c3 === heartbeat) {
+        if (c3.state === "idle") {
+          c3.frame = 0;
+        } else {
+          c3.frameTimer += dt;
+          const pDur = c3.state === "toolcall" ? 130 : 380;
+          if (c3.frameTimer >= pDur) {
+            c3.frame = (c3.frame + 1) % 4;
+            c3.frameTimer -= pDur;
+          }
+        }
+      } else {
+        c3.frameTimer += dt;
+        const dur = FRAME_MS[c3.state] || 450;
+        if (c3.frameTimer >= dur) {
+          c3.frame = (c3.frame + 1) % 4;
+          c3.frameTimer -= dur;
+        }
+      }
+      if (c3.target) {
+        const dx = c3.target.x - c3.x;
+        const dy = c3.target.y - c3.y;
+        const dist = Math.sqrt(dx * dx + dy * dy);
+        if (dist > 1.5) {
+          const spd = WALK * dt / 1000;
+          c3.x += dx / dist * spd;
+          c3.y += dy / dist * spd;
+        } else {
+          c3.x = c3.target.x;
+          c3.y = c3.target.y;
+          c3.target = null;
+          if (c3._onArrive) {
+            c3._onArrive();
+            c3._onArrive = null;
+          }
+        }
+      }
+      if (c3.bubble) {
+        c3.bubble.ttl -= dt;
+        if (c3.bubble.ttl <= 0)
+          c3.bubble = null;
+      }
+      if (c3 === heartbeat) {
+        if (c3.target) {
+          const pdx = c3.target.x - c3.x;
+          if (Math.abs(pdx) > 1)
+            c3.facing = pdx > 0 ? 1 : -1;
+        } else {
+          const flipRate = c3.state === "toolcall" ? 280 : c3.state === "waiting" ? 600 : 2800;
+          c3.flipTimer = (c3.flipTimer || 0) + dt;
+          if (c3.flipTimer >= flipRate) {
+            c3.flipTimer -= flipRate;
+            c3.facing = -(c3.facing || 1);
+          }
+        }
+      }
+    });
+  }
+  function drawStatus(ctx, c3) {
+    if (!c3.statusText)
+      return;
+    const yOff = BOB[c3.frame];
+    const cx = Math.floor(c3.x);
+    const cy = Math.floor(c3.y + yOff) - 20;
+    ctx.font = "11px serif";
+    ctx.textAlign = "center";
+    ctx.textBaseline = "middle";
+    ctx.fillText(c3.statusText, cx, cy);
+  }
+  function drawBubble(ctx, c3) {
+    if (!c3.bubble)
+      return;
+    const yOff = BOB[c3.frame];
+    const bx = c3.x;
+    const by = c3.y + yOff - 18;
+    ctx.font = "7px Silkscreen,monospace";
+    const tw = ctx.measureText(c3.bubble.text).width;
+    const pw = tw + 8;
+    const ph = 12;
+    const lx = Math.max(4, Math.min(316 - pw, bx - pw / 2));
+    ctx.fillStyle = "#facc15";
+    ctx.fillRect(Math.floor(lx), Math.floor(by - ph), Math.ceil(pw), Math.ceil(ph));
+    ctx.fillRect(Math.floor(bx) - 1, Math.floor(by), 3, 3);
+    ctx.fillStyle = "#0a0a00";
+    ctx.textAlign = "left";
+    ctx.textBaseline = "middle";
+    ctx.fillText(c3.bubble.text, Math.floor(lx + 4), Math.floor(by - ph / 2));
+  }
+  function drawChar(ctx, c3) {
+    if (!c3.alive && c3.state !== "entering" && c3.state !== "exiting")
+      return;
+    const yOff = BOB[c3.frame];
+    const cx = Math.floor(c3.x);
+    const cy = Math.floor(c3.y + yOff);
+    if (c3.state === "toolcall") {
+      ctx.fillStyle = "rgba(251,146,60,0.35)";
+      ctx.beginPath();
+      ctx.arc(cx, cy, 13, 0, Math.PI * 2);
+      ctx.fill();
+    } else if (c3.state === "waiting") {
+      ctx.fillStyle = "rgba(96,165,250,0.25)";
+      ctx.beginPath();
+      ctx.arc(cx, cy, 11, 0, Math.PI * 2);
+      ctx.fill();
+    } else if (c3.state === "user_waiting" || c3.state === "plan_review") {
+      ctx.fillStyle = "rgba(167,139,250,0.18)";
+      ctx.beginPath();
+      ctx.arc(cx, cy, 10, 0, Math.PI * 2);
+      ctx.fill();
+    } else if (c3.state === "plan_executing") {
+      ctx.fillStyle = "rgba(74,222,128,0.18)";
+      ctx.beginPath();
+      ctx.arc(cx, cy, 10, 0, Math.PI * 2);
+      ctx.fill();
+    }
+    ctx.font = "18px serif";
+    ctx.textAlign = "center";
+    ctx.textBaseline = "middle";
+    if (c3.facing === -1) {
+      ctx.save();
+      ctx.translate(cx, cy);
+      ctx.scale(-1, 1);
+      ctx.fillText(c3.emoji, 0, 0);
+      ctx.restore();
+    } else {
+      ctx.fillText(c3.emoji, cx, cy);
+    }
+    ctx.font = "6px Silkscreen,monospace";
+    ctx.textAlign = "center";
+    ctx.textBaseline = "top";
+    ctx.fillStyle = c3.state === "talking" ? "#facc15" : "#3a4a7a";
+    ctx.fillText(c3.id.toUpperCase(), cx, cy + 11);
+    drawStatus(ctx, c3);
+    drawBubble(ctx, c3);
+  }
+  function OrchCanvas({ active }) {
+    const canvasRef = A2(null);
+    const animRef = A2(0);
+    y2(() => {
+      if (!active) {
+        if (orchReconnectTimer) {
+          clearTimeout(orchReconnectTimer);
+          orchReconnectTimer = null;
+        }
+        if (orchWs) {
+          orchWs.close();
+          orchWs = null;
+        }
+        if (animRef.current) {
+          cancelAnimationFrame(animRef.current);
+          animRef.current = 0;
+        }
+        return;
+      }
+      const canvas = canvasRef.current;
+      if (!canvas)
+        return;
+      const ctx = canvas.getContext("2d");
+      if (!ctx)
+        return;
+      if (!inited) {
+        inited = true;
+        initChars();
+      }
+      lastTs = null;
+      function renderLoop(ts) {
+        if (lastTs === null)
+          lastTs = ts;
+        const dt = Math.min(ts - lastTs, 80);
+        lastTs = ts;
+        update(dt);
+        ctx.imageSmoothingEnabled = false;
+        window.drawMap(ctx);
+        allChars().forEach((c3) => drawChar(ctx, c3));
+        animRef.current = requestAnimationFrame(renderLoop);
+      }
+      window.loadMapAsset(() => {
+        lastTs = null;
+        animRef.current = requestAnimationFrame(renderLoop);
+      });
+      connectOrchWs();
+      return () => {
+        if (animRef.current) {
+          cancelAnimationFrame(animRef.current);
+          animRef.current = 0;
+        }
+      };
+    }, [active]);
+    return /* @__PURE__ */ u5("div", {
+      class: "card glass",
+      style: { marginTop: "16px", padding: "0" },
+      children: [
+        /* @__PURE__ */ u5("div", {
+          class: "orch-room-row",
+          children: [
+            /* @__PURE__ */ u5("div", {
+              class: "orch-side",
+              id: "orch-panel-left",
+              children: [
+                /* @__PURE__ */ u5("div", {
+                  class: "orch-badge alive",
+                  id: "orch-badge-conductor",
+                  children: [
+                    /* @__PURE__ */ u5("div", {
+                      class: "orch-badge-emoji",
+                      children: "\uD83D\uDC51"
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ u5("div", {
+                      class: "orch-badge-label",
+                      children: "CNDR"
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ u5("div", {
+                      class: "orch-badge-dot"
+                    }, undefined, false, undefined, this)
+                  ]
+                }, undefined, true, undefined, this),
+                /* @__PURE__ */ u5("div", {
+                  class: "orch-badge",
+                  id: "orch-badge-secretary",
+                  children: [
+                    /* @__PURE__ */ u5("div", {
+                      class: "orch-badge-emoji",
+                      children: "\uD83D\uDC69‍\uD83D\uDCBC"
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ u5("div", {
+                      class: "orch-badge-label",
+                      children: "SEC"
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ u5("div", {
+                      class: "orch-badge-dot"
+                    }, undefined, false, undefined, this)
+                  ]
+                }, undefined, true, undefined, this),
+                /* @__PURE__ */ u5("div", {
+                  class: "orch-badge alive",
+                  id: "orch-badge-heartbeat",
+                  children: [
+                    /* @__PURE__ */ u5("div", {
+                      class: "orch-badge-emoji",
+                      children: "\uD83D\uDD4A️"
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ u5("div", {
+                      class: "orch-badge-label",
+                      children: "HB"
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ u5("div", {
+                      class: "orch-badge-dot"
+                    }, undefined, false, undefined, this)
+                  ]
+                }, undefined, true, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              class: "orch-canvas-wrap",
+              children: /* @__PURE__ */ u5("canvas", {
+                ref: canvasRef,
+                id: "orch-canvas",
+                width: "320",
+                height: "320"
+              }, undefined, false, undefined, this)
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              class: "orch-side",
+              id: "orch-panel-right",
+              children: [
+                { id: "s0", emoji: "\uD83D\uDD0D", label: "SCOUT" },
+                { id: "s1", emoji: "\uD83D\uDCCA", label: "ANLY" },
+                { id: "s2", emoji: "\uD83D\uDCBB", label: "CODE" },
+                { id: "s3", emoji: "\uD83D\uDD27", label: "WRKR" },
+                { id: "s4", emoji: "\uD83C\uDFAF", label: "CORD" }
+              ].map((s3) => /* @__PURE__ */ u5("div", {
+                class: "orch-badge",
+                id: `orch-badge-${s3.id}`,
+                children: [
+                  /* @__PURE__ */ u5("div", {
+                    class: "orch-badge-emoji",
+                    children: s3.emoji
+                  }, undefined, false, undefined, this),
+                  /* @__PURE__ */ u5("div", {
+                    class: "orch-badge-label",
+                    children: s3.label
+                  }, undefined, false, undefined, this),
+                  /* @__PURE__ */ u5("div", {
+                    class: "orch-badge-dot"
+                  }, undefined, false, undefined, this)
+                ]
+              }, s3.id, true, undefined, this))
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          class: "orch-status",
+          children: [
+            /* @__PURE__ */ u5("span", {
+              class: "orch-dot",
+              id: "orch-status-dot"
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("span", {
+              id: "orch-status-text",
+              children: "Connecting..."
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  function connectOrchWs() {
+    if (orchWs && orchWs.readyState <= 1)
+      return;
+    const initData = window.Telegram?.WebApp?.initData || "";
+    const proto = location.protocol === "https:" ? "wss:" : "ws:";
+    const url = proto + "//" + location.host + "/miniapp/api/orchestration/ws?initData=" + encodeURIComponent(initData);
+    orchWs = new WebSocket(url);
+    orchWs.onopen = () => {
+      const dot = document.getElementById("orch-status-dot");
+      const txt = document.getElementById("orch-status-text");
+      if (dot)
+        dot.classList.add("on");
+      if (txt)
+        txt.textContent = "Live";
+    };
+    orchWs.onmessage = (e3) => {
+      let msg;
+      try {
+        msg = JSON.parse(e3.data);
+      } catch {
+        return;
+      }
+      if (msg.type === "init") {
+        (msg.agents || []).forEach((info) => {
+          spawn(info.id);
+          if (info.state && info.state !== "idle") {
+            const c3 = charForId(info.id);
+            if (c3)
+              setState(c3, info.state);
+          }
+        });
+      } else if (msg.type === "event") {
+        const ev = msg.event || {};
+        if (ev.type === "agent_spawn")
+          spawn(ev.id);
+        if (ev.type === "agent_state") {
+          const c3 = charForId(ev.id);
+          if (c3)
+            setState(c3, ev.state);
+        }
+        if (ev.type === "agent_gc")
+          gc(ev.id);
+        if (ev.type === "conversation")
+          converse(ev.from, ev.to, ev.text);
+      }
+    };
+    orchWs.onclose = () => {
+      const dot = document.getElementById("orch-status-dot");
+      const txt = document.getElementById("orch-status-text");
+      if (dot)
+        dot.classList.remove("on");
+      if (txt)
+        txt.textContent = "Disconnected";
+      orchWs = null;
+    };
+    orchWs.onerror = () => {};
+  }
+
+  // src/components/plan/plan-tab.tsx
+  function PlanTab({ active, sse }) {
+    const [plan, setPlan] = d2(null);
+    const [loading, setLoading] = d2(true);
+    const [error, setError] = d2(false);
+    const loadPlan = q2(async () => {
+      setLoading(true);
+      setError(false);
+      try {
+        const data = await apiFetch("/miniapp/api/plan");
+        setPlan(data);
+      } catch {
+        setError(true);
+      } finally {
+        setLoading(false);
+      }
+    }, []);
+    y2(() => {
+      if (sse.plan) {
+        setPlan(sse.plan);
+        setLoading(false);
+      }
+    }, [sse.plan]);
+    y2(() => {
+      if (active && !isFresh(sse.lastUpdate, "plan")) {
+        loadPlan();
+      }
+    }, [active]);
+    y2(() => {
+      loadPlan();
+    }, []);
+    if (loading && !plan)
+      return /* @__PURE__ */ u5("div", {
+        class: "loading",
+        children: "Loading plan..."
+      }, undefined, false, undefined, this);
+    if (error && !plan)
+      return /* @__PURE__ */ u5("div", {
+        class: "loading",
+        children: "Failed to load plan."
+      }, undefined, false, undefined, this);
+    if (!plan)
+      return null;
+    return /* @__PURE__ */ u5(k, {
+      children: [
+        /* @__PURE__ */ u5(PlanContent, {
+          plan
+        }, undefined, false, undefined, this),
+        window.ORCH_ENABLED && /* @__PURE__ */ u5(OrchCanvas, {
+          active
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  function PlanContent({ plan }) {
+    if (!plan.has_plan) {
+      return /* @__PURE__ */ u5(NoPlan, {}, undefined, false, undefined, this);
+    }
+    const isInterviewOrReview = plan.status === "interviewing" || plan.status === "review";
+    return /* @__PURE__ */ u5(k, {
+      children: [
+        /* @__PURE__ */ u5("div", {
+          class: "card glass",
+          children: [
+            /* @__PURE__ */ u5("div", {
+              class: "card-title",
+              children: "Status"
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              class: "card-value",
+              children: plan.status
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              style: { color: "var(--hint)", marginTop: "4px" },
+              children: [
+                "Phase ",
+                plan.current_phase,
+                " / ",
+                plan.total_phases
+              ]
+            }, undefined, true, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        isInterviewOrReview && plan.memory && /* @__PURE__ */ u5("div", {
+          class: "memory-view glass",
+          dangerouslySetInnerHTML: { __html: renderMarkdown(plan.memory) }
+        }, undefined, false, undefined, this),
+        plan.status === "review" && /* @__PURE__ */ u5(k, {
+          children: [
+            /* @__PURE__ */ u5(SlideApprove, {
+              label: "Slide to Approve",
+              cmd: "/plan start"
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5(SlideApprove, {
+              label: "Approve & Clear History",
+              cmd: "/plan start clear",
+              warn: true
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        !isInterviewOrReview && plan.phases && plan.phases.length > 0 && /* @__PURE__ */ u5(Phases, {
+          phases: plan.phases,
+          currentPhase: plan.current_phase
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  function NoPlan() {
+    const [task, setTask] = d2("");
+    const handleStart = async () => {
+      const t3 = task.trim();
+      if (!t3)
+        return;
+      const ok = await sendCommand("/plan " + t3);
+      if (ok)
+        setTask("");
+    };
+    return /* @__PURE__ */ u5(k, {
+      children: [
+        /* @__PURE__ */ u5("div", {
+          class: "empty-state",
+          children: "No active plan."
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          class: "card glass",
+          style: { marginTop: "16px" },
+          children: [
+            /* @__PURE__ */ u5("div", {
+              class: "card-title",
+              children: "Start a Plan"
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              style: { display: "flex", gap: "8px", marginTop: "8px" },
+              children: [
+                /* @__PURE__ */ u5("input", {
+                  class: "send-input glass glass-interactive",
+                  placeholder: "Describe your task...",
+                  value: task,
+                  onInput: (e3) => setTask(e3.target.value),
+                  onKeyDown: (e3) => e3.key === "Enter" && handleStart()
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("button", {
+                  class: "send-btn",
+                  onClick: handleStart,
+                  children: "Start"
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this)
+          ]
+        }, undefined, true, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  function Phases({
+    phases,
+    currentPhase
+  }) {
+    const onStepClick = (phaseNum, stepIdx, done) => {
+      if (done)
+        return;
+      sendCommand("/plan done " + stepIdx);
+    };
+    return /* @__PURE__ */ u5(k, {
+      children: phases.map((phase) => {
+        const doneCount = phase.steps.filter((s3) => s3.done).length;
+        const total = phase.steps.length;
+        let indicatorClass;
+        let indicator;
+        if (phase.number < currentPhase || total > 0 && doneCount === total) {
+          indicatorClass = "done";
+          indicator = "✓";
+        } else if (phase.number === currentPhase) {
+          indicatorClass = "current";
+          indicator = String(phase.number);
+        } else {
+          indicatorClass = "pending";
+          indicator = String(phase.number);
+        }
+        return /* @__PURE__ */ u5("div", {
+          class: "phase",
+          children: [
+            /* @__PURE__ */ u5("div", {
+              class: "phase-header",
+              children: [
+                /* @__PURE__ */ u5("div", {
+                  class: `phase-indicator ${indicatorClass}`,
+                  children: indicator
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  class: "phase-title",
+                  children: phase.title || "Phase " + phase.number
+                }, undefined, false, undefined, this),
+                total > 0 && /* @__PURE__ */ u5("span", {
+                  class: "phase-progress",
+                  children: [
+                    doneCount,
+                    "/",
+                    total
+                  ]
+                }, undefined, true, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            phase.steps.map((step) => /* @__PURE__ */ u5("div", {
+              class: `step${step.done ? " step-done" : ""}`,
+              onClick: () => onStepClick(phase.number, step.index, step.done),
+              children: [
+                /* @__PURE__ */ u5("div", {
+                  class: `step-check${step.done ? " done" : ""}`
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("div", {
+                  class: `step-text${step.done ? " done" : ""}`,
+                  children: step.description
+                }, undefined, false, undefined, this)
+              ]
+            }, step.index, true, undefined, this))
+          ]
+        }, phase.number, true, undefined, this);
+      })
+    }, undefined, false, undefined, this);
+  }
+
+  // src/components/work/git-section.tsx
+  function GitSection({ repos, worktrees, onReload }) {
+    const [detailRepo, setDetailRepo] = d2(null);
+    const [detailName, setDetailName] = d2(null);
+    const [loadingDetail, setLoadingDetail] = d2(false);
+    const loadDetail = q2(async (name) => {
+      setDetailName(name);
+      setLoadingDetail(true);
+      try {
+        const data = await apiFetch("/miniapp/api/git?repo=" + encodeURIComponent(name));
+        setDetailRepo(data);
+      } catch {}
+      setLoadingDetail(false);
+    }, []);
+    const goBack = q2(() => {
+      setDetailRepo(null);
+      setDetailName(null);
+      onReload();
+    }, [onReload]);
+    if (detailName) {
+      return /* @__PURE__ */ u5(RepoDetail, {
+        repo: detailRepo,
+        name: detailName,
+        loading: loadingDetail,
+        onBack: goBack
+      }, undefined, false, undefined, this);
+    }
+    return /* @__PURE__ */ u5(k, {
+      children: [
+        /* @__PURE__ */ u5(Worktrees, {
+          items: worktrees,
+          onReload
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5(RepoList, {
+          repos,
+          onSelect: loadDetail
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  function Worktrees({
+    items,
+    onReload
+  }) {
+    const [busy, setBusy] = d2(null);
+    const handleAction = async (action, name, isDirty) => {
+      let force = false;
+      if (action === "merge") {
+        if (!confirm('Merge "' + name + '" into base branch?'))
+          return;
+      } else if (action === "dispose") {
+        if (isDirty) {
+          if (!confirm('"' + name + '" has uncommitted changes. Force dispose and auto-commit before removal?'))
+            return;
+          force = true;
+        } else if (!confirm('Dispose worktree "' + name + '"?')) {
+          return;
+        }
+      }
+      setBusy(name + ":" + action);
+      try {
+        await apiPost("/miniapp/api/worktrees", { action, name, force });
+        onReload();
+      } catch (err) {
+        alert(err.message || "Action failed");
+      }
+      setBusy(null);
+    };
+    return /* @__PURE__ */ u5("div", {
+      class: "card glass",
+      children: [
+        /* @__PURE__ */ u5("div", {
+          class: "card-title",
+          children: "Worktrees"
+        }, undefined, false, undefined, this),
+        items.length === 0 ? /* @__PURE__ */ u5("div", {
+          class: "empty-state",
+          style: { padding: "12px 0 4px" },
+          children: "No active worktrees."
+        }, undefined, false, undefined, this) : /* @__PURE__ */ u5("div", {
+          class: "worktree-list",
+          children: items.map((wt) => {
+            let last = "(no commits)";
+            if (wt.last_commit_hash) {
+              last = wt.last_commit_hash + " " + (wt.last_commit_subject || "");
+              if (wt.last_commit_age)
+                last += " (" + wt.last_commit_age + ")";
+            }
+            return /* @__PURE__ */ u5("div", {
+              class: `worktree-item${wt.has_uncommitted ? " dirty" : ""}`,
+              children: [
+                /* @__PURE__ */ u5("div", {
+                  class: "worktree-main",
+                  children: [
+                    /* @__PURE__ */ u5("div", {
+                      class: "worktree-name-row",
+                      children: [
+                        /* @__PURE__ */ u5("span", {
+                          class: "worktree-name",
+                          children: wt.name
+                        }, undefined, false, undefined, this),
+                        wt.has_uncommitted ? /* @__PURE__ */ u5("span", {
+                          class: "worktree-dirty",
+                          children: "DIRTY"
+                        }, undefined, false, undefined, this) : /* @__PURE__ */ u5("span", {
+                          class: "worktree-clean",
+                          children: "CLEAN"
+                        }, undefined, false, undefined, this)
+                      ]
+                    }, undefined, true, undefined, this),
+                    /* @__PURE__ */ u5("div", {
+                      class: "worktree-branch",
+                      children: wt.branch || "?"
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ u5("div", {
+                      class: "worktree-last",
+                      children: last
+                    }, undefined, false, undefined, this)
+                  ]
+                }, undefined, true, undefined, this),
+                /* @__PURE__ */ u5("div", {
+                  class: "worktree-actions",
+                  children: [
+                    /* @__PURE__ */ u5("button", {
+                      class: "worktree-btn merge",
+                      disabled: busy === wt.name + ":merge",
+                      onClick: () => handleAction("merge", wt.name, wt.has_uncommitted),
+                      children: busy === wt.name + ":merge" ? "Merging..." : "Merge"
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ u5("button", {
+                      class: "worktree-btn dispose",
+                      disabled: busy === wt.name + ":dispose",
+                      onClick: () => handleAction("dispose", wt.name, wt.has_uncommitted),
+                      children: busy === wt.name + ":dispose" ? "Disposing..." : "Dispose"
+                    }, undefined, false, undefined, this)
+                  ]
+                }, undefined, true, undefined, this)
+              ]
+            }, wt.name, true, undefined, this);
+          })
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  function RepoList({
+    repos,
+    onSelect
+  }) {
+    if (!repos || repos.length === 0) {
+      return /* @__PURE__ */ u5("div", {
+        class: "empty-state",
+        style: { marginTop: "12px" },
+        children: "No git repositories found."
+      }, undefined, false, undefined, this);
+    }
+    return /* @__PURE__ */ u5(k, {
+      children: [
+        /* @__PURE__ */ u5("div", {
+          style: {
+            padding: "10px 4px 8px",
+            fontSize: "12px",
+            color: "var(--hint)"
+          },
+          children: "Repositories"
+        }, undefined, false, undefined, this),
+        repos.map((r3) => /* @__PURE__ */ u5("div", {
+          class: "git-repo-item glass glass-interactive",
+          onClick: () => onSelect(r3.name),
+          children: [
+            /* @__PURE__ */ u5("div", {
+              class: "git-repo-body",
+              children: [
+                /* @__PURE__ */ u5("div", {
+                  class: "git-repo-name",
+                  children: r3.name
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("div", {
+                  class: "git-repo-branch",
+                  children: r3.branch || "?"
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ u5("span", {
+              class: "git-repo-arrow",
+              children: "›"
+            }, undefined, false, undefined, this)
+          ]
+        }, r3.name, true, undefined, this))
+      ]
+    }, undefined, true, undefined, this);
+  }
+  function RepoDetail({
+    repo,
+    name,
+    loading,
+    onBack
+  }) {
+    if (loading || !repo) {
+      return /* @__PURE__ */ u5(k, {
+        children: [
+          /* @__PURE__ */ u5("button", {
+            class: "git-back-btn",
+            onClick: onBack,
+            children: [
+              "←",
+              " ",
+              name
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ u5("div", {
+            class: "loading",
+            children: [
+              "Loading ",
+              name,
+              "..."
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this);
+    }
+    return /* @__PURE__ */ u5(k, {
+      children: [
+        /* @__PURE__ */ u5("button", {
+          class: "git-back-btn",
+          onClick: onBack,
+          children: [
+            "←",
+            " ",
+            repo.name || name
+          ]
+        }, undefined, true, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          class: "card glass",
+          children: [
+            /* @__PURE__ */ u5("div", {
+              class: "card-title",
+              children: [
+                repo.name,
+                " — ",
+                repo.branch || "?"
+              ]
+            }, undefined, true, undefined, this),
+            repo.modified && repo.modified.length > 0 && /* @__PURE__ */ u5(k, {
+              children: [
+                /* @__PURE__ */ u5("div", {
+                  style: {
+                    padding: "4px 12px 8px",
+                    fontSize: "12px",
+                    color: "var(--hint)"
+                  },
+                  children: [
+                    "Changes (",
+                    repo.modified.length,
+                    ")"
+                  ]
+                }, undefined, true, undefined, this),
+                repo.modified.map((f4, i3) => /* @__PURE__ */ u5("div", {
+                  class: "git-commit",
+                  children: [
+                    /* @__PURE__ */ u5("span", {
+                      class: `git-status git-status-${f4.status === "??" ? "u" : f4.status.toLowerCase()}`,
+                      children: f4.status
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ u5("span", {
+                      class: "git-subject",
+                      children: f4.path
+                    }, undefined, false, undefined, this)
+                  ]
+                }, i3, true, undefined, this))
+              ]
+            }, undefined, true, undefined, this),
+            repo.commits && repo.commits.length > 0 ? /* @__PURE__ */ u5(k, {
+              children: [
+                /* @__PURE__ */ u5("div", {
+                  style: {
+                    padding: "4px 12px 8px",
+                    fontSize: "12px",
+                    color: "var(--hint)"
+                  },
+                  children: "Commits"
+                }, undefined, false, undefined, this),
+                repo.commits.map((c3, i3) => /* @__PURE__ */ u5("div", {
+                  class: "git-commit",
+                  children: [
+                    /* @__PURE__ */ u5("span", {
+                      class: "git-hash",
+                      children: c3.hash
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ u5("span", {
+                      class: "git-subject",
+                      children: c3.subject
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ u5("span", {
+                      class: "git-meta",
+                      children: c3.date
+                    }, undefined, false, undefined, this)
+                  ]
+                }, i3, true, undefined, this))
+              ]
+            }, undefined, true, undefined, this) : /* @__PURE__ */ u5("div", {
+              style: { padding: "12px", color: "var(--hint)" },
+              children: "No commits found."
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+
+  // src/components/work/session-section.tsx
+  function SessionSection({
+    sessions,
+    stats,
+    graph,
+    context
+  }) {
+    return /* @__PURE__ */ u5(k, {
+      children: [
+        /* @__PURE__ */ u5(ActiveSessions, {
+          sessions
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5(StatsCards, {
+          stats
+        }, undefined, false, undefined, this),
+        context && /* @__PURE__ */ u5(ContextCard, {
+          context
+        }, undefined, false, undefined, this),
+        graph && /* @__PURE__ */ u5(SessionGraph, {
+          graph
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  function ActiveSessions({ sessions }) {
+    if (!sessions || sessions.length === 0) {
+      return /* @__PURE__ */ u5("div", {
+        class: "card glass",
+        children: [
+          /* @__PURE__ */ u5("div", {
+            class: "card-title",
+            children: "Active Sessions"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ u5("div", {
+            style: { color: "var(--hint)", fontSize: "13px" },
+            children: "No active sessions"
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this);
+    }
+    return /* @__PURE__ */ u5("div", {
+      class: "card glass",
+      children: [
+        /* @__PURE__ */ u5("div", {
+          class: "card-title",
+          children: "Active Sessions"
+        }, undefined, false, undefined, this),
+        sessions.map((s3) => {
+          const label = formatSessionLabel(s3.session_key);
+          const isHeartbeat = s3.session_key.startsWith("heartbeat:");
+          const latestMsg = s3.latest_message || null;
+          return /* @__PURE__ */ u5("div", {
+            style: {
+              padding: "8px 0",
+              borderBottom: "1px solid var(--secondary-bg)"
+            },
+            children: [
+              /* @__PURE__ */ u5("div", {
+                style: {
+                  display: "flex",
+                  alignItems: "center",
+                  gap: "6px"
+                },
+                children: [
+                  /* @__PURE__ */ u5("span", {
+                    style: {
+                      color: isHeartbeat ? "var(--link)" : "var(--done)",
+                      fontSize: "10px"
+                    },
+                    children: isHeartbeat ? "\uD83E\uDD16" : "●"
+                  }, undefined, false, undefined, this),
+                  /* @__PURE__ */ u5("span", {
+                    style: { fontWeight: 600, fontSize: "14px", flex: 1 },
+                    children: label
+                  }, undefined, false, undefined, this),
+                  /* @__PURE__ */ u5("span", {
+                    style: {
+                      color: "var(--hint)",
+                      fontSize: "12px",
+                      flexShrink: 0
+                    },
+                    children: [
+                      s3.turn_count || 0,
+                      " turns"
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ u5("span", {
+                    style: {
+                      marginLeft: "4px",
+                      color: "var(--hint)",
+                      fontSize: "12px"
+                    },
+                    children: formatAge(s3.age_sec)
+                  }, undefined, false, undefined, this)
+                ]
+              }, undefined, true, undefined, this),
+              latestMsg && /* @__PURE__ */ u5("div", {
+                style: {
+                  color: "var(--hint)",
+                  fontSize: "12px",
+                  paddingLeft: "22px",
+                  marginTop: "2px",
+                  overflow: "hidden",
+                  textOverflow: "ellipsis",
+                  whiteSpace: "nowrap"
+                },
+                children: latestMsg
+              }, undefined, false, undefined, this)
+            ]
+          }, s3.session_key, true, undefined, this);
+        })
+      ]
+    }, undefined, true, undefined, this);
+  }
+  function StatsCards({ stats }) {
+    if (!stats || stats.status === "stats not enabled") {
+      return /* @__PURE__ */ u5("div", {
+        class: "empty-state",
+        children: [
+          "Stats tracking not enabled.",
+          /* @__PURE__ */ u5("br", {}, undefined, false, undefined, this),
+          "Start gateway with --stats flag."
+        ]
+      }, undefined, true, undefined, this);
+    }
+    const since = stats.since ? new Date(stats.since).toLocaleDateString() : "N/A";
+    const today = stats.today || {};
+    return /* @__PURE__ */ u5(k, {
+      children: [
+        /* @__PURE__ */ u5("div", {
+          class: "card glass",
+          children: [
+            /* @__PURE__ */ u5("div", {
+              class: "card-title",
+              children: "Today"
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              class: "stat-row",
+              children: [
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-label",
+                  children: "Prompts"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-value",
+                  children: today.prompts || 0
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              class: "stat-row",
+              children: [
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-label",
+                  children: "Requests"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-value",
+                  children: today.requests || 0
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              class: "stat-row",
+              children: [
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-label",
+                  children: "Tokens"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-value",
+                  children: formatTokens(today.total_tokens || 0)
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          class: "card glass",
+          children: [
+            /* @__PURE__ */ u5("div", {
+              class: "card-title",
+              children: [
+                "All Time (since ",
+                since,
+                ")"
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              class: "stat-row",
+              children: [
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-label",
+                  children: "Prompts"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-value",
+                  children: stats.total_prompts || 0
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              class: "stat-row",
+              children: [
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-label",
+                  children: "Requests"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-value",
+                  children: stats.total_requests || 0
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              class: "stat-row",
+              children: [
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-label",
+                  children: "Total Tokens"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-value",
+                  children: formatTokens(stats.total_tokens || 0)
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              class: "stat-row",
+              children: [
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-label",
+                  children: "Prompt Tokens"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-value",
+                  children: formatTokens(stats.total_prompt_tokens || 0)
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              class: "stat-row",
+              children: [
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-label",
+                  children: "Completion Tokens"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-value",
+                  children: formatTokens(stats.total_completion_tokens || 0)
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this)
+          ]
+        }, undefined, true, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  function ContextCard({ context }) {
+    const [showPrompt, setShowPrompt] = d2(false);
+    const [promptText, setPromptText] = d2(null);
+    const [promptLoading, setPromptLoading] = d2(false);
+    const togglePrompt = async () => {
+      if (showPrompt) {
+        setShowPrompt(false);
+        return;
+      }
+      setPromptLoading(true);
+      try {
+        const data = await apiFetch("/miniapp/api/prompt");
+        setPromptText(data.prompt || "(empty)");
+        setShowPrompt(true);
+      } catch {}
+      setPromptLoading(false);
+    };
+    const wd = context.work_dir || "—";
+    const pwd = context.plan_work_dir || "—";
+    const ws = context.workspace || "—";
+    return /* @__PURE__ */ u5("div", {
+      class: "card glass",
+      children: [
+        /* @__PURE__ */ u5("div", {
+          class: "card-title",
+          children: "Context"
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          style: { fontSize: "12px" },
+          children: [
+            /* @__PURE__ */ u5("div", {
+              class: "stat-row",
+              children: [
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-label",
+                  children: "workDir"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-value",
+                  style: {
+                    fontSize: "12px",
+                    overflow: "hidden",
+                    textOverflow: "ellipsis"
+                  },
+                  title: wd,
+                  children: wd
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              class: "stat-row",
+              children: [
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-label",
+                  children: "planWorkDir"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-value",
+                  style: {
+                    fontSize: "12px",
+                    overflow: "hidden",
+                    textOverflow: "ellipsis"
+                  },
+                  title: pwd,
+                  children: pwd
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              class: "stat-row",
+              children: [
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-label",
+                  children: "workspace"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  class: "stat-value",
+                  style: {
+                    fontSize: "12px",
+                    overflow: "hidden",
+                    textOverflow: "ellipsis"
+                  },
+                  title: ws,
+                  children: ws
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        context.bootstrap && context.bootstrap.length > 0 && /* @__PURE__ */ u5("div", {
+          style: { marginTop: "8px" },
+          children: context.bootstrap.map((b2, i3) => {
+            const path = b2.path || "—";
+            const scope = b2.scope === "global" ? "global" : "project";
+            return /* @__PURE__ */ u5("div", {
+              style: {
+                display: "flex",
+                gap: "8px",
+                padding: "2px 0",
+                fontSize: "12px"
+              },
+              children: [
+                /* @__PURE__ */ u5("span", {
+                  style: {
+                    minWidth: "90px",
+                    fontWeight: 600,
+                    color: b2.path ? "var(--text)" : "var(--hint)"
+                  },
+                  children: b2.name
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  style: {
+                    color: "var(--hint)",
+                    flex: 1,
+                    overflow: "hidden",
+                    textOverflow: "ellipsis",
+                    whiteSpace: "nowrap"
+                  },
+                  title: path,
+                  children: path
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  style: { color: "var(--hint)", fontSize: "11px" },
+                  children: scope
+                }, undefined, false, undefined, this)
+              ]
+            }, i3, true, undefined, this);
+          })
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          style: { marginTop: "8px", textAlign: "center" },
+          children: /* @__PURE__ */ u5("button", {
+            onClick: togglePrompt,
+            style: {
+              background: "var(--secondary-bg)",
+              color: "var(--text)",
+              border: "none",
+              padding: "6px 12px",
+              borderRadius: "8px",
+              fontSize: "12px",
+              cursor: "pointer"
+            },
+            children: promptLoading ? "Loading..." : showPrompt ? "Hide System Prompt" : "Show System Prompt"
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this),
+        showPrompt && promptText && /* @__PURE__ */ u5("pre", {
+          style: {
+            marginTop: "8px",
+            fontSize: "11px",
+            maxHeight: "400px",
+            overflow: "auto",
+            background: "var(--secondary-bg)",
+            padding: "8px",
+            borderRadius: "6px",
+            whiteSpace: "pre-wrap",
+            wordBreak: "break-word"
+          },
+          children: promptText
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  function SessionGraph({ graph }) {
+    if (!graph || !graph.nodes || graph.nodes.length === 0)
+      return null;
+    const childrenMap = {};
+    const nodeMap = {};
+    const roots = [];
+    graph.nodes.forEach((n2) => {
+      childrenMap[n2.key] = [];
+      nodeMap[n2.key] = n2;
+    });
+    graph.edges.forEach((e3) => {
+      if (childrenMap[e3.from])
+        childrenMap[e3.from].push(e3.to);
+    });
+    graph.nodes.forEach((n2) => {
+      const isChild = graph.edges.some((e3) => e3.to === n2.key);
+      if (!isChild)
+        roots.push(n2.key);
+    });
+    function renderNode(key) {
+      const n2 = nodeMap[key];
+      if (!n2)
+        return null;
+      const icon = n2.status === "completed" ? "✓" : "●";
+      const iconClass = n2.status === "completed" ? "completed" : "active";
+      const label = n2.label || n2.short_key || n2.key;
+      const kids = childrenMap[key] || [];
+      return /* @__PURE__ */ u5("li", {
+        class: "session-tree-node",
+        children: [
+          /* @__PURE__ */ u5("span", {
+            class: `session-tree-icon ${iconClass}`,
+            children: icon
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ u5("span", {
+            class: "session-tree-label",
+            children: label
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ u5("span", {
+            class: "session-tree-meta",
+            children: [
+              "turns=",
+              n2.turn_count
+            ]
+          }, undefined, true, undefined, this),
+          kids.length > 0 && /* @__PURE__ */ u5("ul", {
+            class: "session-tree-children",
+            children: kids.map(renderNode)
+          }, undefined, false, undefined, this)
+        ]
+      }, key, true, undefined, this);
+    }
+    return /* @__PURE__ */ u5("div", {
+      class: "card glass",
+      children: [
+        /* @__PURE__ */ u5("div", {
+          class: "card-title",
+          children: "Session Graph"
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5("ul", {
+          class: "session-tree",
+          children: roots.map(renderNode)
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+
+  // src/components/work/work-tab.tsx
+  function WorkTab({ active, sse }) {
+    const [gitRepos, setGitRepos] = d2(null);
+    const [worktrees, setWorktrees] = d2([]);
+    const [sessions, setSessions] = d2(null);
+    const [stats, setStats] = d2(null);
+    const [graph, setGraph] = d2(null);
+    const [context, setContext] = d2(null);
+    const [loading, setLoading] = d2(true);
+    const loadAll = q2(async () => {
+      setLoading(true);
+      try {
+        const [gitData, wtData, sessionData, sessionsData, ctxData, graphData] = await Promise.all([
+          apiFetch("/miniapp/api/git"),
+          apiFetch("/miniapp/api/worktrees").catch(() => []),
+          apiFetch("/miniapp/api/session"),
+          apiFetch("/miniapp/api/sessions").catch(() => []),
+          apiFetch("/miniapp/api/context").catch(() => null),
+          apiFetch("/miniapp/api/sessions/graph").catch(() => null)
+        ]);
+        setGitRepos(gitData);
+        setWorktrees(wtData);
+        setStats(sessionData);
+        setSessions(sessionsData);
+        setContext(ctxData);
+        setGraph(graphData);
+      } catch {}
+      setLoading(false);
+    }, []);
+    y2(() => {
+      if (sse.session) {
+        setSessions(sse.session.sessions || []);
+        setStats(sse.session.stats || null);
+        if (sse.session.graph)
+          setGraph(sse.session.graph);
+      }
+    }, [sse.session]);
+    y2(() => {
+      if (sse.context)
+        setContext(sse.context);
+    }, [sse.context]);
+    y2(() => {
+      if (active)
+        loadAll();
+    }, [active]);
+    if (loading && !gitRepos && !sessions)
+      return /* @__PURE__ */ u5("div", {
+        class: "loading",
+        children: "Loading..."
+      }, undefined, false, undefined, this);
+    return /* @__PURE__ */ u5(k, {
+      children: [
+        /* @__PURE__ */ u5(GitSection, {
+          repos: gitRepos,
+          worktrees,
+          onReload: loadAll
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5(SessionSection, {
+          sessions,
+          stats,
+          graph,
+          context
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+
+  // src/components/tools/skills-section.tsx
+  function SkillsSection({ active, sse }) {
+    const [skills, setSkills] = d2(null);
+    const [loading, setLoading] = d2(true);
+    const [selected, setSelected] = d2(null);
+    const [msg, setMsg] = d2("");
+    const loadSkills = async () => {
+      setLoading(true);
+      try {
+        const data = await apiFetch("/miniapp/api/skills");
+        setSkills(data);
+      } catch {}
+      setLoading(false);
+    };
+    y2(() => {
+      if (sse.skills) {
+        setSkills(sse.skills);
+        setLoading(false);
+      }
+    }, [sse.skills]);
+    y2(() => {
+      if (active && !isFresh(sse.lastUpdate, "skills"))
+        loadSkills();
+    }, [active]);
+    const handleSend = async () => {
+      if (!selected)
+        return;
+      const m4 = msg.trim();
+      const cmd = m4 ? "/skill " + selected + " " + m4 : "/skill " + selected;
+      const ok = await sendCommand(cmd);
+      if (ok)
+        setMsg("");
+    };
+    return /* @__PURE__ */ u5("div", {
+      class: "card glass",
+      children: [
+        /* @__PURE__ */ u5("div", {
+          class: "card-title",
+          children: "Skills"
+        }, undefined, false, undefined, this),
+        loading && !skills ? /* @__PURE__ */ u5("div", {
+          class: "loading",
+          style: { padding: "12px" },
+          children: "Loading skills..."
+        }, undefined, false, undefined, this) : !skills || skills.length === 0 ? /* @__PURE__ */ u5("div", {
+          class: "empty-state",
+          style: { padding: "12px 0" },
+          children: "No skills installed."
+        }, undefined, false, undefined, this) : /* @__PURE__ */ u5(k, {
+          children: [
+            skills.map((s3) => /* @__PURE__ */ u5("div", {
+              class: `skill-item glass glass-interactive${selected === s3.name ? " selected" : ""}`,
+              onClick: () => {
+                setSelected(selected === s3.name ? null : s3.name);
+              },
+              children: [
+                /* @__PURE__ */ u5("div", {
+                  class: "skill-body",
+                  children: [
+                    /* @__PURE__ */ u5("div", {
+                      class: "skill-name",
+                      children: s3.name
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ u5("div", {
+                      class: "skill-desc",
+                      children: s3.description || "No description"
+                    }, undefined, false, undefined, this),
+                    /* @__PURE__ */ u5("span", {
+                      class: "skill-source",
+                      children: s3.source
+                    }, undefined, false, undefined, this)
+                  ]
+                }, undefined, true, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  class: "skill-arrow",
+                  children: "›"
+                }, undefined, false, undefined, this)
+              ]
+            }, s3.name, true, undefined, this)),
+            selected && /* @__PURE__ */ u5("div", {
+              style: {
+                display: "flex",
+                gap: "8px",
+                marginTop: "10px"
+              },
+              children: [
+                /* @__PURE__ */ u5("input", {
+                  class: "send-input glass glass-interactive",
+                  placeholder: `Message for /${selected}...`,
+                  value: msg,
+                  onInput: (e3) => setMsg(e3.target.value),
+                  onKeyDown: (e3) => e3.key === "Enter" && handleSend(),
+                  style: { flex: 1 }
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("button", {
+                  class: "send-btn",
+                  onClick: handleSend,
+                  children: "Send"
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this)
+          ]
+        }, undefined, true, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+
+  // src/components/tools/commands-section.tsx
+  var QUICK_CMDS = ["/session", "/skills", "/plan clear"];
+  function CommandsSection() {
+    const [customCmd, setCustomCmd] = d2("");
+    const btnRef = A2(null);
+    const handleQuick = async (cmd, e3) => {
+      const ok = await sendCommand(cmd);
+      if (ok)
+        flashSent(e3.currentTarget);
+    };
+    const handleCustom = async () => {
+      const cmd = customCmd.trim();
+      if (!cmd || !cmd.startsWith("/"))
+        return;
+      const ok = await sendCommand(cmd);
+      if (ok) {
+        setCustomCmd("");
+        if (btnRef.current)
+          flashSent(btnRef.current);
+      }
+    };
+    return /* @__PURE__ */ u5(k, {
+      children: [
+        /* @__PURE__ */ u5("div", {
+          class: "card glass",
+          children: [
+            /* @__PURE__ */ u5("div", {
+              class: "card-title",
+              children: "Quick Commands"
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              class: "cmd-tiles",
+              children: QUICK_CMDS.map((cmd) => /* @__PURE__ */ u5("button", {
+                class: "cmd-tile glass glass-interactive",
+                onClick: (e3) => handleQuick(cmd, e3),
+                children: cmd
+              }, cmd, false, undefined, this))
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          class: "card glass",
+          children: [
+            /* @__PURE__ */ u5("div", {
+              class: "card-title",
+              children: "Custom Command"
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              style: { display: "flex", gap: "8px", marginTop: "8px" },
+              children: [
+                /* @__PURE__ */ u5("input", {
+                  class: "send-input glass glass-interactive",
+                  placeholder: "/command args...",
+                  value: customCmd,
+                  onInput: (e3) => setCustomCmd(e3.target.value),
+                  onKeyDown: (e3) => e3.key === "Enter" && handleCustom(),
+                  style: { flex: 1 }
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("button", {
+                  class: "send-btn",
+                  ref: btnRef,
+                  onClick: handleCustom,
+                  children: "Send"
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this)
+          ]
+        }, undefined, true, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+
   // src/logs_view.js
   var SAFE_LEVELS = new Set(["debug", "info", "warn", "error"]);
   function stringifyFieldValue(value) {
@@ -7171,7 +9729,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       return String(value);
     }
   }
-  function escapeHtml(value) {
+  function escapeHtml3(value) {
     return String(value == null ? "" : value).replaceAll("&", "&amp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;").replaceAll('"', "&quot;").replaceAll("'", "&#39;");
   }
   function renderFields(fields) {
@@ -7183,7 +9741,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       return "";
     }
     const parts = keys.map((key) => `${key}=${stringifyFieldValue(fields[key])}`);
-    return ` <span class="log-fields">{${escapeHtml(parts.join(", "))}}</span>`;
+    return ` <span class="log-fields">{${escapeHtml3(parts.join(", "))}}</span>`;
   }
   function filterLogs(entries, component = "") {
     if (!Array.isArray(entries) || entries.length === 0) {
@@ -7217,9 +9775,9 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       const levelRaw = String(entry?.level || "info").toLowerCase();
       const level = SAFE_LEVELS.has(levelRaw) ? levelRaw : "info";
       const ts = entry?.timestamp ? String(entry.timestamp).substring(11, 19) : "";
-      const componentHTML = entry?.component ? `<span class="log-comp">${escapeHtml(entry.component)}</span>` : "";
+      const componentHTML = entry?.component ? `<span class="log-comp">${escapeHtml3(entry.component)}</span>` : "";
       const fieldsHTML = renderFields(entry?.fields);
-      const message = escapeHtml(entry?.message || "");
+      const message = escapeHtml3(entry?.message || "");
       html += '<div class="log-entry">' + `<span class="log-ts">${ts}</span>` + `<span class="log-badge ${level}">${level}</span>` + componentHTML + `<span class="log-msg">${message}${fieldsHTML}</span>` + "</div>";
     }
     return {
@@ -7231,1391 +9789,173 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     };
   }
 
-  // src/app.js
-  core_default.registerLanguage("javascript", javascript);
-  core_default.registerLanguage("js", javascript);
-  core_default.registerLanguage("python", python);
-  core_default.registerLanguage("py", python);
-  core_default.registerLanguage("go", go);
-  core_default.registerLanguage("bash", bash);
-  core_default.registerLanguage("sh", bash);
-  core_default.registerLanguage("json", json);
-  core_default.registerLanguage("yaml", yaml);
-  core_default.registerLanguage("yml", yaml);
-  core_default.registerLanguage("typescript", typescript);
-  core_default.registerLanguage("ts", typescript);
-  core_default.registerLanguage("sql", sql);
-  core_default.registerLanguage("xml", xml);
-  core_default.registerLanguage("html", xml);
-  core_default.registerLanguage("css", css);
-  core_default.registerLanguage("markdown", markdown);
-  core_default.registerLanguage("md", markdown);
-  g.setOptions({
-    highlight: function(code, lang) {
-      if (lang && core_default.getLanguage(lang)) {
-        return core_default.highlight(code, { language: lang }).value;
-      }
-      return core_default.highlightAuto(code).value;
-    },
-    breaks: true,
-    gfm: true
-  });
-  var tg = window.Telegram.WebApp;
-  tg.ready();
-  var API_BASE = location.origin;
-  var initData = tg.initData || "";
-  var selectedSkill = null;
-  var lastSSE = { plan: 0, skills: 0, session: 0, dev: 0 };
-  if (!window.ORCH_ENABLED) {
-    orchTabBtn = document.querySelector('.tab[data-panel="orch"]');
-    orchPanel = document.getElementById("orch");
-    if (orchTabBtn)
-      orchTabBtn.style.display = "none";
-    if (orchPanel)
-      orchPanel.style.display = "none";
-    document.documentElement.style.setProperty("--tab-count", "7");
-  }
-  var orchTabBtn;
-  var orchPanel;
-  var tabs = document.querySelectorAll('.tab:not([style*="display: none"])');
-  var tabIndicator = document.querySelector(".tab-indicator");
-  function moveIndicator(index) {
-    tabIndicator.style.transform = "translateX(" + index * 100 + "%)";
-  }
-  tabs.forEach((tab, index) => {
-    tab.addEventListener("click", () => {
-      tabs.forEach((t) => t.classList.remove("active"));
-      document.querySelectorAll(".panel").forEach((p2) => p2.classList.remove("active"));
-      tab.classList.add("active");
-      document.getElementById(tab.dataset.panel).classList.add("active");
-      moveIndicator(index);
-      document.getElementById("send-bar").classList.toggle("hidden", !(tab.dataset.panel === "skills" && selectedSkill));
-      var p = tab.dataset.panel;
-      var fresh = lastSSE[p] && Date.now() - lastSSE[p] < 5000;
-      if (p === "plan" && !fresh)
-        loadPlan();
-      if (p === "skills" && !fresh)
-        loadSkills();
-      if (p === "session" && !fresh)
-        loadSession();
-      if (p === "research")
-        loadResearch();
-      if (p === "git")
-        loadGit();
-      if (p === "dev" && !fresh)
-        loadDev();
-      if (p === "config")
-        connectLogsWs();
-      else
-        disconnectLogsWs();
-      if (p === "orch")
-        connectOrchWs();
-      else
-        disconnectOrchWs();
-    });
-  });
-  document.querySelectorAll(".cmd-tile").forEach((tile) => {
-    tile.addEventListener("click", async () => {
-      const ok = await sendCommand(tile.dataset.cmd);
-      if (ok)
-        flashSent(tile);
-    });
-  });
-  async function sendCommand(cmd) {
-    if (!cmd.startsWith("/"))
-      return false;
-    try {
-      const res = await fetch(API_BASE + "/miniapp/api/command?initData=" + encodeURIComponent(initData), {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({ command: cmd })
-      });
-      if (!res.ok)
-        throw new Error("API error: " + res.status);
-      return true;
-    } catch (e) {
-      return false;
-    }
-  }
-  async function sendCustomCmd() {
-    const input = document.getElementById("custom-cmd");
-    const btn = input.nextElementSibling;
-    const cmd = input.value.trim();
-    if (!cmd)
-      return;
-    if (!cmd.startsWith("/"))
-      return;
-    const ok = await sendCommand(cmd);
-    if (ok) {
-      input.value = "";
-      flashSent(btn);
-    }
-  }
-  async function sendSkillCommand() {
-    if (!selectedSkill)
-      return;
-    const msg = document.getElementById("skill-msg").value.trim();
-    const cmd = msg ? "/skill " + selectedSkill + " " + msg : "/skill " + selectedSkill;
-    const btn = document.getElementById("send-skill-btn");
-    const ok = await sendCommand(cmd);
-    if (ok)
-      flashSent(btn);
-  }
-  async function startPlan() {
-    const input = document.getElementById("plan-task");
-    const btn = input.nextElementSibling;
-    const task = input.value.trim();
-    if (!task)
-      return;
-    const ok = await sendCommand("/plan " + task);
-    if (ok) {
-      input.value = "";
-      flashSent(btn);
-    }
-  }
-  function flashSent(el) {
-    el.classList.add("sent");
-    setTimeout(() => el.classList.remove("sent"), 600);
-  }
-  async function apiFetch(path) {
-    const sep = path.includes("?") ? "&" : "?";
-    const res = await fetch(API_BASE + path + sep + "initData=" + encodeURIComponent(initData));
-    if (!res.ok)
-      throw new Error("API error: " + res.status);
-    return res.json();
-  }
-  function renderPlanFromData(data) {
-    var loading = document.getElementById("plan-loading");
-    var el = document.getElementById("plan-content");
-    loading.classList.add("hidden");
-    el.classList.remove("hidden");
-    if (!data.has_plan) {
-      el.innerHTML = `<div class="empty-state">No active plan.</div>
-      <div class="card glass" style="margin-top:16px">
-        <div class="card-title">Start a Plan</div>
-        <div style="display:flex;gap:8px;margin-top:8px">
-          <input id="plan-task" class="send-input glass glass-interactive" placeholder="Describe your task...">
-          <button class="send-btn" onclick="startPlan()">Start</button>
-        </div>
-      </div>`;
-      return;
-    }
-    var html = `<div class="card glass">
-    <div class="card-title">Status</div>
-    <div class="card-value">${escapeHtml2(data.status)}</div>
-    <div style="color:var(--hint);margin-top:4px">Phase ${data.current_phase} / ${data.total_phases}</div>
-  </div>`;
-    if (data.status === "interviewing" || data.status === "review") {
-      if (data.memory) {
-        html += `<div class="memory-view glass">${renderSimpleMarkdown(data.memory)}</div>`;
-      }
-      if (data.status === "review") {
-        html += `<div class="slide-approve-wrap">
-        <div class="slide-approve-track glass glass-interactive" data-cmd="/plan start">
-          <div class="slide-approve-thumb"><svg viewBox="0 0 24 24"><path d="M5 12h14m-6-6 6 6-6 6" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" fill="none"/></svg></div>
-          <div class="slide-approve-label">Slide to Approve</div>
-        </div>
-      </div>
-      <div class="slide-approve-wrap">
-        <div class="slide-approve-track glass glass-interactive" data-cmd="/plan start clear" style="border-color:var(--warn,#ff9800)">
-          <div class="slide-approve-thumb" style="background:var(--warn,#ff9800)"><svg viewBox="0 0 24 24"><path d="M5 12h14m-6-6 6 6-6 6" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" fill="none"/></svg></div>
-          <div class="slide-approve-label">Approve &amp; Clear History</div>
-        </div>
-      </div>`;
-      }
-    } else {
-      if (data.phases && data.phases.length > 0) {
-        html += renderPhases(data.phases, data.current_phase);
-      }
-    }
-    el.innerHTML = html;
-    if (data.status === "review")
-      setupSlideApprove();
-  }
-  var slideApproveAC = null;
-  function setupSlideApprove() {
-    if (slideApproveAC)
-      slideApproveAC.abort();
-    slideApproveAC = new AbortController;
-    var signal = slideApproveAC.signal;
-    var tracks = document.querySelectorAll(".slide-approve-track");
-    if (!tracks.length)
-      return;
-    tracks.forEach(function(track) {
-      var thumb = track.querySelector(".slide-approve-thumb");
-      var label = track.querySelector(".slide-approve-label");
-      var cmd = track.getAttribute("data-cmd") || "/plan start";
-      var dragging = false;
-      var startX = 0;
-      var thumbStartLeft = 0;
-      function getMaxLeft() {
-        return track.offsetWidth - thumb.offsetWidth - 6;
-      }
-      function markAllApproved() {
-        tracks.forEach(function(t) {
-          t.classList.add("approved");
-          t.querySelector(".slide-approve-label").textContent = "Approved!";
-          t.querySelector(".slide-approve-thumb").classList.add("hidden");
-        });
-      }
-      function onStart(e) {
-        if (track.classList.contains("approved"))
-          return;
-        dragging = true;
-        thumb.classList.add("dragging");
-        var clientX = e.touches ? e.touches[0].clientX : e.clientX;
-        startX = clientX;
-        thumbStartLeft = thumb.offsetLeft - 3;
-        e.preventDefault();
-      }
-      function onMove(e) {
-        if (!dragging)
-          return;
-        var clientX = e.touches ? e.touches[0].clientX : e.clientX;
-        var dx = clientX - startX;
-        var newLeft = Math.max(0, Math.min(thumbStartLeft + dx, getMaxLeft()));
-        thumb.style.left = newLeft + 3 + "px";
-        e.preventDefault();
-      }
-      function onEnd(e) {
-        if (!dragging)
-          return;
-        dragging = false;
-        thumb.classList.remove("dragging");
-        var currentLeft = thumb.offsetLeft - 3;
-        var maxLeft = getMaxLeft();
-        if (currentLeft >= maxLeft * 0.8) {
-          markAllApproved();
-          sendCommand(cmd);
-        } else {
-          thumb.style.left = "3px";
-        }
-      }
-      thumb.addEventListener("touchstart", onStart, { passive: false, signal });
-      thumb.addEventListener("mousedown", onStart, { signal });
-      document.addEventListener("touchmove", onMove, { passive: false, signal });
-      document.addEventListener("mousemove", onMove, { signal });
-      document.addEventListener("touchend", onEnd, { signal });
-      document.addEventListener("mouseup", onEnd, { signal });
-    });
-  }
-  function renderSimpleMarkdown(text) {
-    return g.parse(text);
-  }
-  async function loadTab(loadingId, contentId, label, fetchFn, renderFn) {
-    var loading = document.getElementById(loadingId);
-    var el = document.getElementById(contentId);
-    loading.classList.remove("hidden");
-    loading.textContent = "Loading " + label + "...";
-    el.classList.add("hidden");
-    try {
-      renderFn(await fetchFn());
-    } catch (e) {
-      loading.textContent = "Failed to load " + label + ".";
-    }
-  }
-  function loadPlan() {
-    return loadTab("plan-loading", "plan-content", "plan", function() {
-      return apiFetch("/miniapp/api/plan");
-    }, renderPlanFromData);
-  }
-  function renderPhases(phases, currentPhase) {
-    return phases.map((phase) => {
-      const doneCount = phase.steps.filter((s) => s.done).length;
-      const total = phase.steps.length;
-      let indicatorClass, indicator;
-      if (phase.number < currentPhase || total > 0 && doneCount === total) {
-        indicatorClass = "done";
-        indicator = "✓";
-      } else if (phase.number === currentPhase) {
-        indicatorClass = "current";
-        indicator = String(phase.number);
-      } else {
-        indicatorClass = "pending";
-        indicator = String(phase.number);
-      }
-      const progressHtml = total > 0 ? `<span class="phase-progress">${doneCount}/${total}</span>` : "";
-      const stepsHtml = phase.steps.map((step) => {
-        const doneClass = step.done ? "done" : "";
-        const stepClass = step.done ? "step step-done" : "step";
-        return `<div class="${stepClass}" data-phase="${phase.number}" data-step="${step.index}" data-done="${step.done}">
-        <div class="step-check ${doneClass}"></div>
-        <div class="step-text ${doneClass}">${escapeHtml2(step.description)}</div>
-      </div>`;
-      }).join("");
-      return `<div class="phase">
-      <div class="phase-header">
-        <div class="phase-indicator ${indicatorClass}">${indicator}</div>
-        <span class="phase-title">${escapeHtml2(phase.title || "Phase " + phase.number)}</span>
-        ${progressHtml}
-      </div>
-      ${stepsHtml}
-    </div>`;
-    }).join("");
-  }
-  document.getElementById("plan-content").addEventListener("click", function(e) {
-    const step = e.target.closest(".step");
-    if (!step)
-      return;
-    if (step.dataset.done === "true")
-      return;
-    const phase = step.dataset.phase;
-    const stepIdx = step.dataset.step;
-    sendCommand("/plan done " + stepIdx);
-  });
-  function renderSkillsFromData(data) {
-    var loading = document.getElementById("skills-loading");
-    var el = document.getElementById("skills-list");
-    loading.classList.add("hidden");
-    el.classList.remove("hidden");
-    if (!data || data.length === 0) {
-      el.innerHTML = '<div class="empty-state">No skills installed.</div>';
-      return;
-    }
-    el.innerHTML = data.map((s) => `<div class="skill-item glass glass-interactive" data-skill="${escapeAttr(s.name)}">
-    <div class="skill-body">
-      <div class="skill-name">${escapeHtml2(s.name)}</div>
-      <div class="skill-desc">${escapeHtml2(s.description || "No description")}</div>
-      <span class="skill-source">${escapeHtml2(s.source)}</span>
-    </div>
-    <span class="skill-arrow">›</span>
-  </div>`).join("");
-    if (selectedSkill) {
-      var prev = el.querySelector('[data-skill="' + CSS.escape(selectedSkill) + '"]');
-      if (prev)
-        prev.classList.add("selected");
-    }
-  }
-  document.getElementById("skills-list").addEventListener("click", function(e) {
-    var item = e.target.closest(".skill-item");
-    if (!item)
-      return;
-    var el = document.getElementById("skills-list");
-    if (selectedSkill === item.dataset.skill) {
-      item.classList.remove("selected");
-      selectedSkill = null;
-      document.getElementById("send-bar").classList.add("hidden");
-      return;
-    }
-    el.querySelectorAll(".skill-item").forEach(function(i) {
-      i.classList.remove("selected");
-    });
-    item.classList.add("selected");
-    selectedSkill = item.dataset.skill;
-    document.getElementById("send-bar").classList.remove("hidden");
-    document.getElementById("skill-msg").placeholder = "Message for /" + selectedSkill + "...";
-    document.getElementById("skill-msg").focus();
-  });
-  function loadSkills() {
-    return loadTab("skills-loading", "skills-list", "skills", function() {
-      return apiFetch("/miniapp/api/skills");
-    }, renderSkillsFromData);
-  }
-  function formatAge(sec) {
-    if (sec < 60)
-      return sec + "s ago";
-    if (sec < 3600)
-      return Math.floor(sec / 60) + "m ago";
-    return Math.floor(sec / 3600) + "h ago";
-  }
-  function shortSessionKey(key) {
-    var parts = key.split(":");
-    if (parts.length > 2)
-      return parts.slice(2).join(":");
-    return key;
-  }
-  function renderActiveSessions(sessions) {
-    if (!sessions || sessions.length === 0) {
-      return `<div class="card glass">
-      <div class="card-title">Active Sessions</div>
-      <div style="color:var(--hint);font-size:13px">No active sessions</div>
-    </div>`;
-    }
-    return `<div class="card glass"><div class="card-title">Active Sessions</div>
-    ${sessions.map((s) => {
-      var touchDir = s.touch_dir || "—";
-      return `<div style="padding:6px 0;border-bottom:1px solid var(--secondary-bg)">
-        <div style="display:flex;align-items:center;gap:6px">
-          <span style="color:var(--done);font-size:10px">●</span>
-          <span style="font-weight:600;font-size:13px">${escapeHtml2(shortSessionKey(s.session_key))}</span>
-          <span style="margin-left:auto;color:var(--hint);font-size:12px">${formatAge(s.age_sec)}</span>
-        </div>
-        <div style="color:var(--hint);font-size:12px;padding-left:16px">touch: ${escapeHtml2(touchDir)}</div>
-      </div>`;
-    }).join("")}
-  </div>`;
-  }
-  function renderSessionFromData(sessions, stats) {
-    var loading = document.getElementById("session-loading");
-    var el = document.getElementById("session-content");
-    loading.classList.add("hidden");
-    el.classList.remove("hidden");
-    var html = renderActiveSessions(sessions);
-    if (!stats || stats.status === "stats not enabled") {
-      html += '<div class="empty-state">Stats tracking not enabled.<br>Start gateway with --stats flag.</div>';
-      el.innerHTML = html;
-      return;
-    }
-    var since = stats.since ? new Date(stats.since).toLocaleDateString() : "N/A";
-    var today = stats.today || {};
-    html += `<div class="card glass">
-    <div class="card-title">Today</div>
-    <div class="stat-row"><span class="stat-label">Prompts</span><span class="stat-value">${today.prompts || 0}</span></div>
-    <div class="stat-row"><span class="stat-label">Requests</span><span class="stat-value">${today.requests || 0}</span></div>
-    <div class="stat-row"><span class="stat-label">Tokens</span><span class="stat-value">${formatTokens(today.total_tokens || 0)}</span></div>
-  </div>
-  <div class="card glass">
-    <div class="card-title">All Time (since ${escapeHtml2(since)})</div>
-    <div class="stat-row"><span class="stat-label">Prompts</span><span class="stat-value">${stats.total_prompts || 0}</span></div>
-    <div class="stat-row"><span class="stat-label">Requests</span><span class="stat-value">${stats.total_requests || 0}</span></div>
-    <div class="stat-row"><span class="stat-label">Total Tokens</span><span class="stat-value">${formatTokens(stats.total_tokens || 0)}</span></div>
-    <div class="stat-row"><span class="stat-label">Prompt Tokens</span><span class="stat-value">${formatTokens(stats.total_prompt_tokens || 0)}</span></div>
-    <div class="stat-row"><span class="stat-label">Completion Tokens</span><span class="stat-value">${formatTokens(stats.total_completion_tokens || 0)}</span></div>
-  </div>`;
-    el.innerHTML = html;
-  }
-  var cachedContextInfo = null;
-  function renderContextCard(ctx) {
-    if (!ctx)
-      return "";
-    cachedContextInfo = ctx;
-    var wd = ctx.work_dir || "—";
-    var pwd = ctx.plan_work_dir || "—";
-    var ws = ctx.workspace || "—";
-    var filesHtml = "";
-    if (ctx.bootstrap && ctx.bootstrap.length) {
-      filesHtml = ctx.bootstrap.map(function(b2) {
-        var path = b2.path ? escapeHtml2(b2.path) : "—";
-        var scope = b2.scope === "global" ? "global" : "project";
-        var found = b2.path ? "var(--text)" : "var(--hint)";
-        return `<div style="display:flex;gap:8px;padding:2px 0;font-size:12px">
-        <span style="min-width:90px;font-weight:600;color:${found}">${escapeHtml2(b2.name)}</span>
-        <span style="color:var(--hint);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="${path}">${path}</span>
-        <span style="color:var(--hint);font-size:11px">${scope}</span>
-      </div>`;
-      }).join("");
-    }
-    return `<div class="card glass">
-    <div class="card-title">Context</div>
-    <div style="font-size:12px">
-      <div class="stat-row"><span class="stat-label">workDir</span><span class="stat-value" style="font-size:12px;overflow:hidden;text-overflow:ellipsis" title="${escapeHtml2(wd)}">${escapeHtml2(wd)}</span></div>
-      <div class="stat-row"><span class="stat-label">planWorkDir</span><span class="stat-value" style="font-size:12px;overflow:hidden;text-overflow:ellipsis" title="${escapeHtml2(pwd)}">${escapeHtml2(pwd)}</span></div>
-      <div class="stat-row"><span class="stat-label">workspace</span><span class="stat-value" style="font-size:12px;overflow:hidden;text-overflow:ellipsis" title="${escapeHtml2(ws)}">${escapeHtml2(ws)}</span></div>
-    </div>
-    <div style="margin-top:8px">${filesHtml}</div>
-    <div style="margin-top:8px;text-align:center">
-      <button onclick="toggleSystemPrompt()" style="background:var(--secondary-bg);color:var(--text);border:none;padding:6px 12px;border-radius:8px;font-size:12px;cursor:pointer" id="prompt-toggle-btn">Show System Prompt</button>
-    </div>
-    <pre id="system-prompt-view" style="display:none;margin-top:8px;font-size:11px;max-height:400px;overflow:auto;background:var(--secondary-bg);padding:8px;border-radius:6px;white-space:pre-wrap;word-break:break-word"></pre>
-  </div>`;
-  }
-  function toggleSystemPrompt() {
-    var view = document.getElementById("system-prompt-view");
-    var btn = document.getElementById("prompt-toggle-btn");
-    if (!view || !btn)
-      return;
-    if (view.style.display === "none") {
-      btn.textContent = "Loading...";
-      apiFetch("/miniapp/api/prompt").then(function(data) {
-        view.textContent = data.prompt || "(empty)";
-        view.style.display = "block";
-        btn.textContent = "Hide System Prompt";
-      }).catch(function() {
-        btn.textContent = "Show System Prompt";
-      });
-    } else {
-      view.style.display = "none";
-      btn.textContent = "Show System Prompt";
-    }
-  }
-  function renderContextFromData(ctx) {
-    var el = document.getElementById("context-content");
-    if (el)
-      el.innerHTML = renderContextCard(ctx);
-  }
-  function loadSession() {
-    return loadTab("session-loading", "session-content", "session", function() {
-      return Promise.all([
-        apiFetch("/miniapp/api/session"),
-        apiFetch("/miniapp/api/sessions").catch(function() {
-          return [];
-        }),
-        apiFetch("/miniapp/api/context").catch(function() {
-          return null;
-        }),
-        apiFetch("/miniapp/api/sessions/graph").catch(function() {
-          return null;
-        })
-      ]);
-    }, function(results) {
-      renderSessionFromData(results[1], results[0]);
-      renderContextFromData(results[2]);
-      renderSessionGraph(results[3]);
-    });
-  }
-  function renderSessionGraph(graph) {
-    var el = document.getElementById("session-graph");
-    if (!el)
-      return;
-    if (!graph || !graph.nodes || graph.nodes.length === 0) {
-      el.classList.add("hidden");
-      return;
-    }
-    el.classList.remove("hidden");
-    var childrenMap = {};
-    var roots = [];
-    graph.nodes.forEach(function(n) {
-      childrenMap[n.key] = [];
-    });
-    graph.edges.forEach(function(e) {
-      if (childrenMap[e.from])
-        childrenMap[e.from].push(e.to);
-    });
-    var nodeMap = {};
-    graph.nodes.forEach(function(n) {
-      nodeMap[n.key] = n;
-      var isChild = graph.edges.some(function(e) {
-        return e.to === n.key;
-      });
-      if (!isChild)
-        roots.push(n.key);
-    });
-    function renderTreeNode(key) {
-      var n = nodeMap[key];
-      if (!n)
-        return "";
-      var icon = n.status === "completed" ? "✓" : "●";
-      var iconClass = n.status === "completed" ? "completed" : "active";
-      var label = n.label || n.short_key || n.key;
-      var kids = childrenMap[key] || [];
-      var childHtml = "";
-      if (kids.length > 0) {
-        childHtml = '<ul class="session-tree-children">' + kids.map(renderTreeNode).join("") + "</ul>";
-      }
-      return '<li class="session-tree-node">' + '<span class="session-tree-icon ' + iconClass + '">' + icon + "</span>" + '<span class="session-tree-label">' + escapeHtml2(label) + "</span>" + '<span class="session-tree-meta">turns=' + n.turn_count + "</span>" + childHtml + "</li>";
-    }
-    var html = '<div class="card glass"><div class="card-title">Session Graph</div>' + '<ul class="session-tree">' + roots.map(renderTreeNode).join("") + "</ul></div>";
-    el.innerHTML = html;
-  }
-  function formatTokens(n) {
-    if (n >= 1e6)
-      return (n / 1e6).toFixed(1) + "M";
-    if (n >= 1000)
-      return (n / 1000).toFixed(1) + "K";
-    return String(n);
-  }
-  function escapeHtml2(s) {
-    if (!s)
-      return "";
-    return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
-  }
-  function escapeAttr(s) {
-    if (!s)
-      return "";
-    return s.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
-  }
-  var gitSelectedRepo = null;
-  function loadGit() {
-    gitSelectedRepo = null;
-    return loadTab("git-loading", "git-content", "git", function() {
-      return Promise.all([
-        apiFetch("/miniapp/api/git"),
-        apiFetch("/miniapp/api/worktrees").catch(function() {
-          return [];
-        })
-      ]);
-    }, function(results) {
-      renderGitRepos(results[0], results[1]);
-    });
-  }
-  function renderWorktrees(worktrees) {
-    var items = Array.isArray(worktrees) ? worktrees : [];
-    var html = '<div class="card glass"><div class="card-title">Worktrees</div>';
-    if (items.length === 0) {
-      html += '<div class="empty-state" style="padding:12px 0 4px">No active worktrees.</div>';
-      html += "</div>";
-      return html;
-    }
-    html += '<div class="worktree-list">';
-    items.forEach(function(wt) {
-      var dirtyClass = wt.has_uncommitted ? " dirty" : "";
-      var dirtyBadge = wt.has_uncommitted ? '<span class="worktree-dirty">DIRTY</span>' : '<span class="worktree-clean">CLEAN</span>';
-      var last = "(no commits)";
-      if (wt.last_commit_hash) {
-        last = wt.last_commit_hash + " " + (wt.last_commit_subject || "");
-        if (wt.last_commit_age)
-          last += " (" + wt.last_commit_age + ")";
-      }
-      html += '<div class="worktree-item' + dirtyClass + '">' + '<div class="worktree-main">' + '<div class="worktree-name-row">' + '<span class="worktree-name">' + escapeHtml2(wt.name) + "</span>" + dirtyBadge + "</div>" + '<div class="worktree-branch">' + escapeHtml2(wt.branch || "?") + "</div>" + '<div class="worktree-last">' + escapeHtml2(last) + "</div>" + "</div>" + '<div class="worktree-actions">' + '<button class="worktree-btn merge" data-wt-action="merge" data-wt-name="' + escapeAttr(wt.name) + '">Merge</button>' + '<button class="worktree-btn dispose" data-wt-action="dispose" data-wt-name="' + escapeAttr(wt.name) + '" data-wt-dirty="' + (wt.has_uncommitted ? "1" : "0") + '">Dispose</button>' + "</div>" + "</div>";
-    });
-    html += "</div></div>";
-    return html;
-  }
-  function renderGitRepos(repos, worktrees) {
-    var loading = document.getElementById("git-loading");
-    var el = document.getElementById("git-content");
-    loading.classList.add("hidden");
-    el.classList.remove("hidden");
-    var html = renderWorktrees(worktrees);
-    if (!repos || repos.length === 0) {
-      html += '<div class="empty-state" style="margin-top:12px">No git repositories found.</div>';
-      el.innerHTML = html;
-      return;
-    }
-    html += '<div style="padding:10px 4px 8px;font-size:12px;color:var(--hint)">Repositories</div>';
-    html += repos.map(function(r) {
-      return '<div class="git-repo-item glass glass-interactive" data-repo="' + escapeAttr(r.name) + '">' + '<div class="git-repo-body">' + '<div class="git-repo-name">' + escapeHtml2(r.name) + "</div>" + '<div class="git-repo-branch">' + escapeHtml2(r.branch || "?") + "</div>" + "</div>" + '<span class="git-repo-arrow">›</span>' + "</div>";
-    }).join("");
-    el.innerHTML = html;
-  }
-  async function postWorktreeAction(action, name, force) {
-    var res = await fetch(API_BASE + "/miniapp/api/worktrees?initData=" + encodeURIComponent(initData), {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ action, name, force: !!force })
-    });
-    var data = {};
-    try {
-      data = await res.json();
-    } catch (e) {}
-    if (!res.ok) {
-      throw new Error(data.error || "API error: " + res.status);
-    }
-    return data;
-  }
-  document.getElementById("git-content").addEventListener("click", async function(e) {
-    var wtBtn = e.target.closest("[data-wt-action]");
-    if (wtBtn) {
-      var action = wtBtn.dataset.wtAction;
-      var name = wtBtn.dataset.wtName;
-      var isDirty = wtBtn.dataset.wtDirty === "1";
-      var force = false;
-      if (action === "merge") {
-        if (!confirm('Merge "' + name + '" into base branch?'))
-          return;
-      } else if (action === "dispose") {
-        if (isDirty) {
-          if (!confirm('"' + name + '" has uncommitted changes. Force dispose and auto-commit before removal?'))
-            return;
-          force = true;
-        } else if (!confirm('Dispose worktree "' + name + '"?')) {
-          return;
-        }
-      }
-      var originalText = wtBtn.textContent;
-      wtBtn.disabled = true;
-      wtBtn.textContent = action === "merge" ? "Merging..." : "Disposing...";
-      try {
-        await postWorktreeAction(action, name, force);
-        await loadGit();
-      } catch (err) {
-        alert(err.message || "Action failed");
-        wtBtn.disabled = false;
-        wtBtn.textContent = originalText;
-      }
-      return;
-    }
-    var item = e.target.closest(".git-repo-item");
-    if (!item)
-      return;
-    loadGitDetail(item.dataset.repo);
-  });
-  function loadGitDetail(name) {
-    gitSelectedRepo = name;
-    return loadTab("git-loading", "git-content", name, function() {
-      return apiFetch("/miniapp/api/git?repo=" + encodeURIComponent(name));
-    }, renderGitDetail);
-  }
-  function renderGitDetail(repo) {
-    var loading = document.getElementById("git-loading");
-    var el = document.getElementById("git-content");
-    loading.classList.add("hidden");
-    el.classList.remove("hidden");
-    var html = '<button class="git-back-btn" onclick="loadGit()">← ' + escapeHtml2(repo.name || gitSelectedRepo) + "</button>";
-    html += '<div class="card glass"><div class="card-title">' + escapeHtml2(repo.name) + " &mdash; " + escapeHtml2(repo.branch || "?") + "</div>";
-    if (repo.modified && repo.modified.length > 0) {
-      html += '<div style="padding:4px 12px 8px;font-size:12px;color:var(--hint)">Changes (' + repo.modified.length + ")</div>";
-      repo.modified.forEach(function(f) {
-        html += '<div class="git-commit">' + '<span class="git-status git-status-' + (f.status === "??" ? "u" : f.status.toLowerCase()) + '">' + escapeHtml2(f.status) + "</span>" + '<span class="git-subject">' + escapeHtml2(f.path) + "</span>" + "</div>";
-      });
-    }
-    if (repo.commits && repo.commits.length > 0) {
-      html += '<div style="padding:4px 12px 8px;font-size:12px;color:var(--hint)">Commits</div>';
-      repo.commits.forEach(function(c) {
-        html += '<div class="git-commit">' + '<span class="git-hash">' + escapeHtml2(c.hash) + "</span>" + '<span class="git-subject">' + escapeHtml2(c.subject) + "</span>" + '<span class="git-meta">' + escapeHtml2(c.date) + "</span>" + "</div>";
-      });
-    } else {
-      html += '<div style="padding:12px;color:var(--hint)">No commits found.</div>';
-    }
-    html += "</div>";
-    el.innerHTML = html;
-  }
-  var devActiveId = "";
-  function renderDevFromData(data) {
-    var dot = document.getElementById("dev-dot");
-    var headerTarget = document.getElementById("dev-header-target");
-    var targetsList = document.getElementById("dev-targets-list");
-    var iframeWrap = document.getElementById("dev-iframe-wrap");
-    var iframe = document.getElementById("dev-iframe");
-    var targets = data.targets || [];
-    devActiveId = data.active_id || "";
-    if (data.active) {
-      dot.classList.add("on");
-      headerTarget.textContent = data.target ? data.target.replace(/^https?:\/\//, "") : "";
-      iframeWrap.classList.remove("hidden");
-      var iframeSrc = location.origin + "/miniapp/dev/";
-      if (iframe.src !== iframeSrc)
-        iframe.src = iframeSrc;
-    } else {
-      dot.classList.remove("on");
-      headerTarget.textContent = "";
-      iframeWrap.classList.add("hidden");
-      iframe.src = "";
-    }
-    if (targets.length === 0) {
-      targetsList.innerHTML = '<div class="empty-state">No targets registered.<br>Ask the agent to start a dev server.</div>';
-      return;
-    }
-    targetsList.innerHTML = targets.map(function(t) {
-      var isActive = t.id === devActiveId;
-      var activeClass = isActive ? " active" : "";
-      var dotClass = isActive ? " on" : "";
-      var displayUrl = t.target.replace(/^https?:\/\//, "");
-      return '<div class="dev-target-item glass glass-interactive' + activeClass + '" data-dev-id="' + escapeAttr(t.id) + '">' + '<span class="dev-target-dot' + dotClass + '"></span>' + '<span class="dev-target-name">' + escapeHtml2(t.name) + "</span>" + '<span class="dev-target-url">' + escapeHtml2(displayUrl) + "</span>" + '<span class="dev-target-delete" data-del-id="' + escapeAttr(t.id) + '" data-del-name="' + escapeAttr(t.name) + '">&times;</span>' + "</div>";
-    }).join("");
-  }
-  document.getElementById("dev-targets-list").addEventListener("click", function(e) {
-    var delBtn = e.target.closest(".dev-target-delete");
-    if (delBtn) {
-      e.stopPropagation();
-      var id = delBtn.dataset.delId;
-      var name = delBtn.dataset.delName;
-      if (confirm('Remove "' + name + '"?')) {
-        postDevUnregister(id);
-      }
-      return;
-    }
-    var card = e.target.closest("[data-dev-id]");
-    if (!card)
-      return;
-    postDevAction(card.dataset.devId);
-  });
-  async function postDevAction(id) {
-    var action = id === devActiveId ? "deactivate" : "activate";
-    var body = action === "activate" ? { action: "activate", id } : { action: "deactivate" };
-    try {
-      var res = await fetch(API_BASE + "/miniapp/api/dev?initData=" + encodeURIComponent(initData), {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify(body)
-      });
-      var data = await res.json();
-      if (!data.error)
-        renderDevFromData(data);
-    } catch (e) {}
-  }
-  async function postDevUnregister(id) {
-    try {
-      var res = await fetch(API_BASE + "/miniapp/api/dev?initData=" + encodeURIComponent(initData), {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({ action: "unregister", id })
-      });
-      var data = await res.json();
-      if (!data.error)
-        renderDevFromData(data);
-    } catch (e) {}
-  }
-  function loadDev() {
-    apiFetch("/miniapp/api/dev").then(renderDevFromData).catch(function() {});
-  }
-  var eventSource = null;
-  function connectSSE() {
-    if (eventSource)
-      eventSource.close();
-    eventSource = new EventSource(API_BASE + "/miniapp/api/events?initData=" + encodeURIComponent(initData));
-    eventSource.addEventListener("plan", function(e) {
-      try {
-        lastSSE.plan = Date.now();
-        renderPlanFromData(JSON.parse(e.data));
-      } catch (err) {}
-    });
-    eventSource.addEventListener("session", function(e) {
-      try {
-        lastSSE.session = Date.now();
-        var d = JSON.parse(e.data);
-        renderSessionFromData(d.sessions, d.stats);
-        if (d.graph)
-          renderSessionGraph(d.graph);
-      } catch (err) {}
-    });
-    eventSource.addEventListener("skills", function(e) {
-      try {
-        lastSSE.skills = Date.now();
-        renderSkillsFromData(JSON.parse(e.data));
-      } catch (err) {}
-    });
-    eventSource.addEventListener("dev", function(e) {
-      try {
-        lastSSE.dev = Date.now();
-        renderDevFromData(JSON.parse(e.data));
-      } catch (err) {}
-    });
-    eventSource.addEventListener("context", function(e) {
-      try {
-        renderContextFromData(JSON.parse(e.data));
-      } catch (err) {}
-    });
-    eventSource.addEventListener("prompt", function(e) {
-      try {
-        var d = JSON.parse(e.data);
-        var view = document.getElementById("system-prompt-view");
-        if (view && view.style.display !== "none") {
-          view.textContent = d.prompt || "(empty)";
-        }
-      } catch (err) {}
-    });
-    eventSource.onerror = function() {};
-  }
-  connectSSE();
-  loadPlan();
-  var logsWs = null;
-  var logsComponent = "";
-  var logsEntries = [];
-  var logsReconnectTimer = null;
-  var logsPage = 1;
+  // src/components/tools/logs-section.tsx
   var LOGS_PAGE_SIZE = 60;
-  function connectLogsWs() {
-    if (logsWs && logsWs.readyState <= 1)
-      return;
-    var wsProto = location.protocol === "https:" ? "wss:" : "ws:";
-    var wsUrl = wsProto + "//" + location.host + "/miniapp/api/logs/ws?initData=" + encodeURIComponent(initData);
-    if (logsComponent)
-      wsUrl += "&component=" + encodeURIComponent(logsComponent);
-    logsWs = new WebSocket(wsUrl);
-    var statusDot = document.getElementById("logs-status");
-    logsWs.onopen = function() {
-      statusDot.classList.add("on");
-    };
-    logsWs.onmessage = function(e) {
-      var msg = JSON.parse(e.data);
-      if (msg.type === "init") {
-        logsEntries = msg.entries || [];
-        logsPage = 1;
-      } else if (msg.type === "entry") {
-        logsEntries.push(msg.entry);
-        if (logsEntries.length > 200)
-          logsEntries.shift();
+  function LogsSection({ active }) {
+    const [entries, setEntries] = d2([]);
+    const [component, setComponent] = d2("");
+    const [page, setPage] = d2(1);
+    const [connected, setConnected] = d2(false);
+    const wsRef = A2(null);
+    const reconnectRef = A2(null);
+    const containerRef = A2(null);
+    const connect = q2(() => {
+      if (wsRef.current && wsRef.current.readyState <= 1)
+        return;
+      const initData = window.Telegram?.WebApp?.initData || "";
+      const proto = location.protocol === "https:" ? "wss:" : "ws:";
+      let url = proto + "//" + location.host + "/miniapp/api/logs/ws?initData=" + encodeURIComponent(initData);
+      if (component)
+        url += "&component=" + encodeURIComponent(component);
+      const ws = new WebSocket(url);
+      wsRef.current = ws;
+      ws.onopen = () => setConnected(true);
+      ws.onmessage = (e3) => {
+        const msg = JSON.parse(e3.data);
+        if (msg.type === "init") {
+          setEntries(msg.entries || []);
+          setPage(1);
+        } else if (msg.type === "entry") {
+          setEntries((prev) => {
+            const next = [...prev, msg.entry];
+            return next.length > 200 ? next.slice(1) : next;
+          });
+        }
+      };
+      ws.onclose = () => {
+        setConnected(false);
+        wsRef.current = null;
+        if (active) {
+          reconnectRef.current = setTimeout(connect, 3000);
+        }
+      };
+      ws.onerror = () => {};
+    }, [component, active]);
+    const disconnect = q2(() => {
+      if (reconnectRef.current) {
+        clearTimeout(reconnectRef.current);
+        reconnectRef.current = null;
       }
-      renderLogs2();
-    };
-    logsWs.onclose = function() {
-      statusDot.classList.remove("on");
-      logsWs = null;
-      var activeTab = document.querySelector(".tab.active");
-      if (activeTab && activeTab.dataset.panel === "config") {
-        logsReconnectTimer = setTimeout(connectLogsWs, 3000);
+      if (wsRef.current) {
+        wsRef.current.close();
+        wsRef.current = null;
       }
+      setConnected(false);
+    }, []);
+    y2(() => {
+      if (active) {
+        connect();
+      } else {
+        disconnect();
+      }
+      return disconnect;
+    }, [active, component]);
+    const handleFilterChange = (comp) => {
+      setComponent(comp);
+      setPage(1);
+      setEntries([]);
+      disconnect();
     };
-    logsWs.onerror = function() {};
-  }
-  function disconnectLogsWs() {
-    if (logsReconnectTimer) {
-      clearTimeout(logsReconnectTimer);
-      logsReconnectTimer = null;
-    }
-    if (logsWs) {
-      logsWs.close();
-      logsWs = null;
-    }
-    document.getElementById("logs-status").classList.remove("on");
-  }
-  function renderLogs2() {
-    var container = document.getElementById("logs-content");
-    if (!container)
-      return;
-    var wasScrolledToBottom = container.scrollHeight - container.scrollTop - container.clientHeight < 30;
-    var view = renderLogs(logsEntries, {
-      component: logsComponent,
-      page: logsPage,
+    const view = renderLogs(entries, {
+      component,
+      page,
       pageSize: LOGS_PAGE_SIZE
     });
-    if (logsPage > view.totalPages) {
-      logsPage = view.totalPages;
-      view = renderLogs(logsEntries, {
-        component: logsComponent,
-        page: logsPage,
-        pageSize: LOGS_PAGE_SIZE
-      });
-    }
-    if (!view.html) {
-      container.innerHTML = '<div class="empty-state">No logs.</div>';
-    } else {
-      container.innerHTML = view.html;
-    }
-    updateLogsPager(view);
-    if (wasScrolledToBottom)
-      container.scrollTop = container.scrollHeight;
-  }
-  function updateLogsPager(view) {
-    var info = document.getElementById("logs-page-info");
-    var prev = document.getElementById("logs-page-prev");
-    var next = document.getElementById("logs-page-next");
-    if (!info || !prev || !next)
-      return;
-    info.textContent = view.currentPage + "/" + view.totalPages + " (" + view.totalItems + ")";
-    prev.disabled = view.currentPage <= 1;
-    next.disabled = view.currentPage >= view.totalPages;
-  }
-  document.querySelector(".log-filter-chips").addEventListener("click", function(e) {
-    var chip = e.target.closest(".log-filter-chip");
-    if (!chip)
-      return;
-    document.querySelectorAll(".log-filter-chip").forEach(function(c) {
-      c.classList.remove("active");
-    });
-    chip.classList.add("active");
-    logsComponent = chip.dataset.component || "";
-    logsPage = 1;
-    logsEntries = [];
-    renderLogs2();
-    disconnectLogsWs();
-    connectLogsWs();
-  });
-  var logsPrevButton = document.getElementById("logs-page-prev");
-  if (logsPrevButton) {
-    logsPrevButton.addEventListener("click", function() {
-      if (logsPage <= 1)
-        return;
-      logsPage--;
-      renderLogs2();
-    });
-  }
-  var logsNextButton = document.getElementById("logs-page-next");
-  if (logsNextButton) {
-    logsNextButton.addEventListener("click", function() {
-      logsPage++;
-      renderLogs2();
-    });
-  }
-  var orchCanvas = null;
-  var orchCtx = null;
-  var orchInited = false;
-  var orchWs = null;
-  var orchReconnectTimer = null;
-  var _orchLastTs = null;
-  var _orchBOB = [0, -1, -2, -1];
-  var _orchFRAME_MS = { idle: 450, waiting: 650, toolcall: 90, talking: 280, entering: 220, exiting: 220 };
-  var _orchWALK = 55;
-  var _orchConductor;
-  var _orchSecretary;
-  var _orchHeartbeat;
-  var _orchSubagents;
-  var _orchSlots;
-  var _orchFreeSlots;
-  function _orchMakeChar(id, emoji, home) {
-    return {
-      id,
-      emoji,
-      x: home.x,
-      y: home.y,
-      home,
-      target: null,
-      state: "idle",
-      frame: 0,
-      frameTimer: 0,
-      bubble: null,
-      alive: false,
-      _onArrive: null
-    };
-  }
-  function _orchInitChars() {
-    _orchConductor = _orchMakeChar("conductor", "\uD83D\uDC51", MAP_POSITIONS.conductor);
-    _orchSecretary = _orchMakeChar("secretary", "\uD83D\uDC69‍\uD83D\uDCBC", MAP_POSITIONS.secretary);
-    _orchHeartbeat = _orchMakeChar("heartbeat", "\uD83D\uDD4A️", MAP_POSITIONS.heartbeat || { x: 230, y: 58 });
-    _orchConductor.alive = true;
-    _orchSecretary.alive = false;
-    _orchHeartbeat.alive = true;
-    _orchConductor.statusText = null;
-    _orchHeartbeat.facing = 1;
-    _orchHeartbeat.flipTimer = 0;
-    var ps = [
-      { id: "s0", emoji: "\uD83D\uDD0D" },
-      { id: "s1", emoji: "\uD83D\uDCCA" },
-      { id: "s2", emoji: "\uD83D\uDCBB" },
-      { id: "s3", emoji: "\uD83D\uDD27" },
-      { id: "s4", emoji: "\uD83C\uDFAF" }
-    ];
-    _orchSubagents = ps.map(function(p, i) {
-      var c = _orchMakeChar(p.id, p.emoji, MAP_POSITIONS.stations[i]);
-      c.x = MAP_POSITIONS.door.x;
-      c.y = MAP_POSITIONS.door.y;
-      return c;
-    });
-    _orchSlots = {};
-    _orchFreeSlots = _orchSubagents.slice();
-  }
-  function _orchAllChars() {
-    return [_orchConductor, _orchSecretary, _orchHeartbeat].concat(_orchSubagents);
-  }
-  function _orchSyncBadge(id, state, alive) {
-    var el = document.getElementById("orch-badge-" + id);
-    if (!el)
-      return;
-    el.className = "orch-badge" + (alive ? " alive" : "") + (state === "talking" ? " talking" : "") + (state === "toolcall" ? " toolcall" : "") + (state === "waiting" ? " waiting" : "");
-  }
-  function _orchSetState(c, state, tool) {
-    c.state = state;
-    _orchSyncBadge(c.id, state, c.alive);
-    if (c === _orchConductor) {
-      if (state === "waiting")
-        c.statusText = "\uD83E\uDD14";
-      else if (state === "toolcall")
-        c.statusText = "⌨";
-      else if (state === "user_waiting")
-        c.statusText = "⏳";
-      else if (state === "plan_interviewing")
-        c.statusText = "\uD83D\uDCCB";
-      else if (state === "plan_review")
-        c.statusText = "\uD83D\uDD0D";
-      else if (state === "plan_executing")
-        c.statusText = "▶️";
-      else if (state === "plan_completed")
-        c.statusText = "✅";
-      else
-        c.statusText = null;
-      var inPlan = state.indexOf("plan_") === 0;
-      if (_orchSecretary.alive !== inPlan) {
-        _orchSecretary.alive = inPlan;
-        _orchSyncBadge("secretary", _orchSecretary.state, _orchSecretary.alive);
-      }
-    }
-  }
-  function _orchMoveTo(c, pos, cb) {
-    c.target = pos;
-    c._onArrive = cb || null;
-  }
-  function _orchSay(c, text, ttl) {
-    c.bubble = { text, ttl: ttl || 2200 };
-  }
-  function _orchCharForId(id) {
-    if (id === "heartbeat")
-      return _orchHeartbeat;
-    if (_orchSlots[id])
-      return _orchSlots[id];
-    return _orchConductor;
-  }
-  function _orchSpawn(id) {
-    if (/^subagent-/.test(id)) {
-      var c = _orchFreeSlots.shift();
-      if (!c)
-        return;
-      _orchSlots[id] = c;
-      c.alive = true;
-      c.x = MAP_POSITIONS.door.x;
-      c.y = MAP_POSITIONS.door.y;
-      _orchSetState(c, "entering");
-      _orchMoveTo(c, c.home, function() {
-        _orchSetState(c, "idle");
-      });
-    } else {
-      var ch = _orchCharForId(id);
-      ch.alive = true;
-      _orchSetState(ch, "waiting");
-    }
-  }
-  function _orchGC(id) {
-    if (/^subagent-/.test(id)) {
-      var c = _orchSlots[id];
-      if (!c)
-        return;
-      delete _orchSlots[id];
-      _orchFreeSlots.push(c);
-      _orchSetState(c, "exiting");
-      _orchMoveTo(c, MAP_POSITIONS.door, function() {
-        c.alive = false;
-        _orchSetState(c, "idle");
-      });
-    } else {
-      var ch = _orchCharForId(id);
-      if (ch === _orchHeartbeat) {
-        _orchSetState(ch, "idle");
-      } else if (ch === _orchConductor) {
-        _orchSetState(ch, "user_waiting");
-      } else {
-        ch.alive = false;
-        _orchSetState(ch, "idle");
-      }
-    }
-  }
-  function _orchConverse(fromId, toId, text) {
-    var from = _orchCharForId(fromId), to = _orchCharForId(toId);
-    if (!from || !to || from === to)
-      return;
-    var label = (text || "").slice(0, 18);
-    var mid = { x: (from.x + to.x) / 2, y: (from.y + to.y) / 2 };
-    _orchSetState(from, "talking");
-    _orchSetState(to, "talking");
-    _orchMoveTo(from, { x: mid.x - 18, y: mid.y }, function() {
-      _orchSay(from, label, 2400);
-    });
-    _orchMoveTo(to, { x: mid.x + 18, y: mid.y }, function() {
-      setTimeout(function() {
-        _orchMoveTo(from, from.home, function() {
-          _orchSetState(from, "idle");
-        });
-        _orchMoveTo(to, to.home, function() {
-          _orchSetState(to, "idle");
-        });
-      }, 2600);
-    });
-  }
-  function _orchUpdate(dt) {
-    _orchAllChars().forEach(function(c) {
-      if (!c.alive && c.state !== "entering")
-        return;
-      if (c === _orchHeartbeat) {
-        if (c.state === "idle") {
-          c.frame = 0;
-        } else {
-          c.frameTimer += dt;
-          var pDur = c.state === "toolcall" ? 130 : 380;
-          if (c.frameTimer >= pDur) {
-            c.frame = (c.frame + 1) % 4;
-            c.frameTimer -= pDur;
-          }
-        }
-      } else {
-        c.frameTimer += dt;
-        var dur = _orchFRAME_MS[c.state] || 450;
-        if (c.frameTimer >= dur) {
-          c.frame = (c.frame + 1) % 4;
-          c.frameTimer -= dur;
-        }
-      }
-      if (c.target) {
-        var dx = c.target.x - c.x, dy = c.target.y - c.y, dist = Math.sqrt(dx * dx + dy * dy);
-        if (dist > 1.5) {
-          var spd = _orchWALK * dt / 1000;
-          c.x += dx / dist * spd;
-          c.y += dy / dist * spd;
-        } else {
-          c.x = c.target.x;
-          c.y = c.target.y;
-          c.target = null;
-          if (c._onArrive) {
-            c._onArrive();
-            c._onArrive = null;
-          }
-        }
-      }
-      if (c.bubble) {
-        c.bubble.ttl -= dt;
-        if (c.bubble.ttl <= 0)
-          c.bubble = null;
-      }
-      if (c === _orchHeartbeat) {
-        if (c.target) {
-          var pdx = c.target.x - c.x;
-          if (Math.abs(pdx) > 1)
-            c.facing = pdx > 0 ? 1 : -1;
-        } else {
-          var flipRate = c.state === "toolcall" ? 280 : c.state === "waiting" ? 600 : 2800;
-          c.flipTimer += dt;
-          if (c.flipTimer >= flipRate) {
-            c.flipTimer -= flipRate;
-            c.facing = -c.facing;
-          }
-        }
-      }
-    });
-  }
-  function _orchDrawStatus(c) {
-    if (!c.statusText)
-      return;
-    var yOff = _orchBOB[c.frame], cx = Math.floor(c.x), cy = Math.floor(c.y + yOff) - 20;
-    orchCtx.font = "11px serif";
-    orchCtx.textAlign = "center";
-    orchCtx.textBaseline = "middle";
-    orchCtx.fillText(c.statusText, cx, cy);
-  }
-  function _orchDrawBubble(c) {
-    if (!c.bubble)
-      return;
-    var yOff = _orchBOB[c.frame], bx = c.x, by = c.y + yOff - 18;
-    orchCtx.font = "7px Silkscreen,monospace";
-    var tw = orchCtx.measureText(c.bubble.text).width, pw = tw + 8, ph = 12;
-    var lx = Math.max(4, Math.min(316 - pw, bx - pw / 2));
-    orchCtx.fillStyle = "#facc15";
-    orchCtx.fillRect(Math.floor(lx), Math.floor(by - ph), Math.ceil(pw), Math.ceil(ph));
-    orchCtx.fillRect(Math.floor(bx) - 1, Math.floor(by), 3, 3);
-    orchCtx.fillStyle = "#0a0a00";
-    orchCtx.textAlign = "left";
-    orchCtx.textBaseline = "middle";
-    orchCtx.fillText(c.bubble.text, Math.floor(lx + 4), Math.floor(by - ph / 2));
-  }
-  function _orchDrawChar(c) {
-    if (!c.alive && c.state !== "entering" && c.state !== "exiting")
-      return;
-    var yOff = _orchBOB[c.frame], cx = Math.floor(c.x), cy = Math.floor(c.y + yOff);
-    if (c.state === "toolcall") {
-      orchCtx.fillStyle = "rgba(251,146,60,0.35)";
-      orchCtx.beginPath();
-      orchCtx.arc(cx, cy, 13, 0, Math.PI * 2);
-      orchCtx.fill();
-    } else if (c.state === "waiting") {
-      orchCtx.fillStyle = "rgba(96,165,250,0.25)";
-      orchCtx.beginPath();
-      orchCtx.arc(cx, cy, 11, 0, Math.PI * 2);
-      orchCtx.fill();
-    } else if (c.state === "user_waiting" || c.state === "plan_review") {
-      orchCtx.fillStyle = "rgba(167,139,250,0.18)";
-      orchCtx.beginPath();
-      orchCtx.arc(cx, cy, 10, 0, Math.PI * 2);
-      orchCtx.fill();
-    } else if (c.state === "plan_executing") {
-      orchCtx.fillStyle = "rgba(74,222,128,0.18)";
-      orchCtx.beginPath();
-      orchCtx.arc(cx, cy, 10, 0, Math.PI * 2);
-      orchCtx.fill();
-    }
-    orchCtx.font = "18px serif";
-    orchCtx.textAlign = "center";
-    orchCtx.textBaseline = "middle";
-    if (c.facing === -1) {
-      orchCtx.save();
-      orchCtx.translate(cx, cy);
-      orchCtx.scale(-1, 1);
-      orchCtx.fillText(c.emoji, 0, 0);
-      orchCtx.restore();
-    } else {
-      orchCtx.fillText(c.emoji, cx, cy);
-    }
-    orchCtx.font = "6px Silkscreen,monospace";
-    orchCtx.textAlign = "center";
-    orchCtx.textBaseline = "top";
-    orchCtx.fillStyle = c.state === "talking" ? "#facc15" : "#3a4a7a";
-    orchCtx.fillText(c.id.toUpperCase(), cx, cy + 11);
-    _orchDrawStatus(c);
-    _orchDrawBubble(c);
-  }
-  function _orchRender(ts) {
-    if (_orchLastTs === null)
-      _orchLastTs = ts;
-    var dt = Math.min(ts - _orchLastTs, 80);
-    _orchLastTs = ts;
-    _orchUpdate(dt);
-    orchCtx.imageSmoothingEnabled = false;
-    drawMap(orchCtx);
-    _orchAllChars().forEach(_orchDrawChar);
-    requestAnimationFrame(_orchRender);
-  }
-  function orchInit() {
-    if (orchInited)
-      return;
-    orchInited = true;
-    orchCanvas = document.getElementById("orch-canvas");
-    orchCtx = orchCanvas.getContext("2d");
-    orchCtx.imageSmoothingEnabled = false;
-    _orchInitChars();
-    loadMapAsset(function() {
-      _orchLastTs = null;
-      requestAnimationFrame(_orchRender);
-    });
-  }
-  function connectOrchWs() {
-    orchInit();
-    if (orchWs && orchWs.readyState <= 1)
-      return;
-    var proto = location.protocol === "https:" ? "wss:" : "ws:";
-    var url = proto + "//" + location.host + "/miniapp/api/orchestration/ws?initData=" + encodeURIComponent(initData);
-    orchWs = new WebSocket(url);
-    orchWs.onopen = function() {
-      document.getElementById("orch-status-dot").classList.add("on");
-      document.getElementById("orch-status-text").textContent = "Live";
-    };
-    orchWs.onmessage = function(e) {
-      var msg;
+    const handleSaveSnapshot = async () => {
       try {
-        msg = JSON.parse(e.data);
-      } catch (_2) {
-        return;
-      }
-      if (msg.type === "init") {
-        (msg.agents || []).forEach(function(info) {
-          _orchSpawn(info.id);
-          if (info.state && info.state !== "idle") {
-            var c2 = _orchCharForId(info.id);
-            if (c2)
-              _orchSetState(c2, info.state);
-          }
-        });
-      } else if (msg.type === "event") {
-        var ev = msg.event || {};
-        if (ev.type === "agent_spawn")
-          _orchSpawn(ev.id);
-        if (ev.type === "agent_state") {
-          var c = _orchCharForId(ev.id);
-          if (c)
-            _orchSetState(c, ev.state, ev.tool);
+        const initData = window.Telegram?.WebApp?.initData || "";
+        const res = await fetch(location.origin + "/miniapp/api/logs/snapshot?initData=" + encodeURIComponent(initData), { method: "POST" });
+        if (!res.ok)
+          return;
+        const data = await res.json();
+        if (data.download_url) {
+          const a3 = document.createElement("a");
+          a3.href = location.origin + data.download_url + "?initData=" + encodeURIComponent(initData);
+          a3.download = "";
+          document.body.appendChild(a3);
+          a3.click();
+          document.body.removeChild(a3);
         }
-        if (ev.type === "agent_gc")
-          _orchGC(ev.id);
-        if (ev.type === "conversation")
-          _orchConverse(ev.from, ev.to, ev.text);
-      }
+      } catch {}
     };
-    orchWs.onclose = function() {
-      document.getElementById("orch-status-dot").classList.remove("on");
-      document.getElementById("orch-status-text").textContent = "Disconnected";
-      orchWs = null;
-      var at = document.querySelector(".tab.active");
-      if (at && at.dataset.panel === "orch")
-        orchReconnectTimer = setTimeout(connectOrchWs, 3000);
-    };
-    orchWs.onerror = function() {};
+    return /* @__PURE__ */ u5("div", {
+      class: "card glass",
+      children: [
+        /* @__PURE__ */ u5("div", {
+          style: {
+            display: "flex",
+            alignItems: "center",
+            gap: "8px",
+            marginBottom: "8px"
+          },
+          children: [
+            /* @__PURE__ */ u5("span", {
+              class: "card-title",
+              style: { margin: 0 },
+              children: "Logs"
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("span", {
+              class: `dev-target-dot${connected ? " on" : ""}`
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          class: "log-filter-chips",
+          children: [
+            { label: "All", comp: "" },
+            { label: "Telego", comp: "telego" },
+            { label: "Console", comp: "dev-console" }
+          ].map((f4) => /* @__PURE__ */ u5("button", {
+            class: `log-filter-chip${component === f4.comp ? " active" : ""}`,
+            onClick: () => handleFilterChange(f4.comp),
+            children: f4.label
+          }, f4.comp, false, undefined, this))
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          ref: containerRef,
+          id: "logs-content",
+          dangerouslySetInnerHTML: { __html: view.html || '<div class="empty-state">No logs.</div>' }
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          class: "log-pagination",
+          children: [
+            /* @__PURE__ */ u5("button", {
+              class: "log-page-btn",
+              disabled: view.currentPage <= 1,
+              onClick: () => setPage((p3) => Math.max(1, p3 - 1)),
+              children: "Newer"
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("span", {
+              children: [
+                view.currentPage,
+                "/",
+                view.totalPages,
+                " (",
+                view.totalItems,
+                ")"
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ u5("button", {
+              class: "log-page-btn",
+              disabled: view.currentPage >= view.totalPages,
+              onClick: () => setPage((p3) => p3 + 1),
+              children: "Older"
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          class: "log-actions",
+          children: /* @__PURE__ */ u5("button", {
+            class: "log-snap-btn",
+            onClick: handleSaveSnapshot,
+            children: "Save Snapshot"
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
   }
-  function disconnectOrchWs() {
-    if (orchReconnectTimer) {
-      clearTimeout(orchReconnectTimer);
-      orchReconnectTimer = null;
-    }
-    if (orchWs) {
-      orchWs.close();
-      orchWs = null;
-    }
-    var dot = document.getElementById("orch-status-dot");
-    var txt = document.getElementById("orch-status-text");
-    if (dot)
-      dot.classList.remove("on");
-    if (txt)
-      txt.textContent = "Offline";
-  }
-  async function saveLogSnapshot() {
-    try {
-      var res = await fetch(API_BASE + "/miniapp/api/logs/snapshot?initData=" + encodeURIComponent(initData), {
-        method: "POST"
-      });
-      if (!res.ok)
-        throw new Error("API error: " + res.status);
-      var data = await res.json();
-      if (data.download_url) {
-        var a = document.createElement("a");
-        a.href = API_BASE + data.download_url + "?initData=" + encodeURIComponent(initData);
-        a.download = "";
-        document.body.appendChild(a);
-        a.click();
-        document.body.removeChild(a);
-      }
-    } catch (e) {}
-  }
-  window.sendCustomCmd = sendCustomCmd;
-  window.sendSkillCommand = sendSkillCommand;
-  window.startPlan = startPlan;
-  window.toggleSystemPrompt = toggleSystemPrompt;
-  window.loadGit = loadGit;
-  window.saveLogSnapshot = saveLogSnapshot;
-  var researchCurrentTaskId = null;
+
+  // src/components/tools/research-section.tsx
   var STATUS_COLORS = {
     pending: { bg: "rgba(234,179,8,0.15)", text: "#ca8a04" },
     active: { bg: "rgba(59,130,246,0.15)", text: "#2563eb" },
@@ -8623,144 +9963,748 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     failed: { bg: "rgba(239,68,68,0.15)", text: "#dc2626" },
     canceled: { bg: "rgba(107,114,128,0.15)", text: "#6b7280" }
   };
-  async function loadResearch() {
-    var el = document.getElementById("research-tasks");
-    var loading = document.getElementById("research-loading");
-    loading.classList.remove("hidden");
-    el.innerHTML = "";
-    try {
-      var resp = await fetch(API_BASE + "/miniapp/api/research?initData=" + encodeURIComponent(initData));
-      var tasks = await resp.json();
-      loading.classList.add("hidden");
-      if (!tasks || tasks.length === 0) {
-        el.innerHTML = '<div class="empty-state">No research tasks yet.</div>';
+  function ResearchSection({ active }) {
+    const [tasks, setTasks] = d2(null);
+    const [loading, setLoading] = d2(false);
+    const [showForm, setShowForm] = d2(false);
+    const [detailId, setDetailId] = d2(null);
+    const loadTasks = q2(async () => {
+      setLoading(true);
+      try {
+        const data = await apiFetch("/miniapp/api/research");
+        setTasks(data);
+      } catch {
+        setTasks(null);
+      }
+      setLoading(false);
+    }, []);
+    y2(() => {
+      if (active)
+        loadTasks();
+    }, [active]);
+    if (detailId) {
+      return /* @__PURE__ */ u5(TaskDetail, {
+        taskId: detailId,
+        onBack: () => {
+          setDetailId(null);
+          loadTasks();
+        }
+      }, undefined, false, undefined, this);
+    }
+    return /* @__PURE__ */ u5("div", {
+      class: "card glass",
+      children: [
+        /* @__PURE__ */ u5("div", {
+          style: {
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "space-between",
+            marginBottom: "12px"
+          },
+          children: [
+            /* @__PURE__ */ u5("span", {
+              class: "card-title",
+              style: { margin: 0 },
+              children: "Research Tasks"
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("button", {
+              class: "send-btn",
+              style: { padding: "6px 14px", fontSize: "13px" },
+              onClick: () => setShowForm(true),
+              children: "+ New"
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        showForm && /* @__PURE__ */ u5(NewTaskForm, {
+          onCreated: () => {
+            setShowForm(false);
+            loadTasks();
+          },
+          onCancel: () => setShowForm(false)
+        }, undefined, false, undefined, this),
+        loading && !tasks ? /* @__PURE__ */ u5("div", {
+          class: "loading",
+          style: { padding: "12px" },
+          children: "Loading tasks..."
+        }, undefined, false, undefined, this) : !tasks || tasks.length === 0 ? /* @__PURE__ */ u5("div", {
+          class: "empty-state",
+          style: { padding: "24px" },
+          children: "No research tasks yet."
+        }, undefined, false, undefined, this) : tasks.map((t3) => {
+          const sc = STATUS_COLORS[t3.status] || STATUS_COLORS.pending;
+          return /* @__PURE__ */ u5("div", {
+            class: "card glass glass-interactive",
+            style: {
+              cursor: "pointer",
+              padding: "14px",
+              ...t3.focused ? { borderLeft: "3px solid #a855f7" } : {}
+            },
+            onClick: () => setDetailId(t3.id),
+            children: [
+              /* @__PURE__ */ u5("div", {
+                style: {
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "space-between",
+                  gap: "8px"
+                },
+                children: [
+                  /* @__PURE__ */ u5("span", {
+                    style: { fontWeight: 600, fontSize: "15px" },
+                    children: t3.title
+                  }, undefined, false, undefined, this),
+                  /* @__PURE__ */ u5("div", {
+                    style: {
+                      display: "flex",
+                      gap: "4px",
+                      alignItems: "center"
+                    },
+                    children: [
+                      t3.focused && /* @__PURE__ */ u5("span", {
+                        style: {
+                          fontSize: "10px",
+                          fontWeight: 600,
+                          padding: "2px 6px",
+                          borderRadius: "8px",
+                          background: "rgba(168,85,247,0.2)",
+                          color: "#a855f7"
+                        },
+                        children: "focused"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ u5("span", {
+                        style: {
+                          fontSize: "11px",
+                          fontWeight: 600,
+                          padding: "2px 8px",
+                          borderRadius: "10px",
+                          background: sc.bg,
+                          color: sc.text
+                        },
+                        children: t3.status
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this),
+              t3.description && /* @__PURE__ */ u5("div", {
+                style: {
+                  color: "var(--hint)",
+                  fontSize: "13px",
+                  marginTop: "4px",
+                  lineHeight: 1.4
+                },
+                children: t3.description.substring(0, 120)
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ u5("div", {
+                style: {
+                  color: "var(--hint)",
+                  fontSize: "11px",
+                  marginTop: "6px"
+                },
+                children: [
+                  t3.document_count,
+                  " docs",
+                  " · ⏱ ",
+                  (t3.interval === "24h" ? "1d" : t3.interval) || "1d",
+                  t3.last_researched_at && " · last: " + new Date(t3.last_researched_at).toLocaleDateString()
+                ]
+              }, undefined, true, undefined, this)
+            ]
+          }, t3.id, true, undefined, this);
+        })
+      ]
+    }, undefined, true, undefined, this);
+  }
+  function NewTaskForm({
+    onCreated,
+    onCancel
+  }) {
+    const [title, setTitle] = d2("");
+    const [desc, setDesc] = d2("");
+    const handleCreate = async () => {
+      const t3 = title.trim();
+      if (!t3)
+        return;
+      try {
+        await apiPost("/miniapp/api/research", {
+          title: t3,
+          description: desc.trim()
+        });
+        onCreated();
+      } catch {}
+    };
+    return /* @__PURE__ */ u5("div", {
+      class: "card glass",
+      style: { padding: "12px", marginBottom: "12px" },
+      children: [
+        /* @__PURE__ */ u5("input", {
+          class: "send-input glass glass-interactive",
+          placeholder: "Task title...",
+          value: title,
+          onInput: (e3) => setTitle(e3.target.value),
+          style: { width: "100%", marginBottom: "8px" }
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5("textarea", {
+          class: "send-input glass glass-interactive",
+          placeholder: "Description (optional)...",
+          value: desc,
+          onInput: (e3) => setDesc(e3.target.value),
+          style: {
+            width: "100%",
+            minHeight: "60px",
+            resize: "vertical",
+            marginBottom: "8px",
+            borderRadius: "12px",
+            padding: "10px 16px"
+          }
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          style: { display: "flex", gap: "8px", justifyContent: "flex-end" },
+          children: [
+            /* @__PURE__ */ u5("button", {
+              class: "send-btn",
+              style: {
+                padding: "6px 14px",
+                fontSize: "13px",
+                background: "var(--hint)"
+              },
+              onClick: onCancel,
+              children: "Cancel"
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("button", {
+              class: "send-btn",
+              style: { padding: "6px 14px", fontSize: "13px" },
+              onClick: handleCreate,
+              children: "Create"
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  function TaskDetail({
+    taskId,
+    onBack
+  }) {
+    const [task, setTask] = d2(null);
+    const [loading, setLoading] = d2(true);
+    const load = q2(async () => {
+      setLoading(true);
+      try {
+        const data = await apiFetch("/miniapp/api/research/" + taskId);
+        setTask(data);
+      } catch {}
+      setLoading(false);
+    }, [taskId]);
+    y2(() => {
+      load();
+    }, [taskId]);
+    const handleAction = async (action) => {
+      try {
+        await apiPost("/miniapp/api/research/" + taskId, { action });
+        load();
+      } catch {}
+    };
+    const handleFocus = async (recall) => {
+      try {
+        await apiPost("/miniapp/api/research/focus", {
+          action: recall ? "recall" : "forget",
+          task_id: taskId
+        });
+        load();
+      } catch {}
+    };
+    const handleInterval = async (interval) => {
+      try {
+        await apiPost("/miniapp/api/research/" + taskId, {
+          action: "set_interval",
+          interval
+        });
+        load();
+      } catch {}
+    };
+    if (loading || !task) {
+      return /* @__PURE__ */ u5("div", {
+        class: "card glass",
+        children: [
+          /* @__PURE__ */ u5("button", {
+            class: "git-back-btn",
+            onClick: onBack,
+            children: [
+              "‹",
+              " Back"
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ u5("div", {
+            class: "loading",
+            children: "Loading..."
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this);
+    }
+    const sc = STATUS_COLORS[task.status] || STATUS_COLORS.pending;
+    const canCancel = task.status === "pending" || task.status === "active";
+    const canReopen = task.status === "completed" || task.status === "failed";
+    const curInterval = (task.interval === "24h" ? "1d" : task.interval) || "1d";
+    return /* @__PURE__ */ u5(k, {
+      children: [
+        /* @__PURE__ */ u5("button", {
+          class: "git-back-btn",
+          onClick: onBack,
+          children: [
+            "‹",
+            " Back"
+          ]
+        }, undefined, true, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          class: "card glass",
+          children: [
+            /* @__PURE__ */ u5("div", {
+              style: {
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+                gap: "8px",
+                marginBottom: "8px"
+              },
+              children: [
+                /* @__PURE__ */ u5("span", {
+                  style: { fontWeight: 700, fontSize: "17px" },
+                  children: task.title
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  style: {
+                    fontSize: "11px",
+                    fontWeight: 600,
+                    padding: "2px 8px",
+                    borderRadius: "10px",
+                    background: sc.bg,
+                    color: sc.text
+                  },
+                  children: task.status
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            task.description && /* @__PURE__ */ u5("div", {
+              style: {
+                color: "var(--hint)",
+                fontSize: "13px",
+                lineHeight: 1.5,
+                marginBottom: "8px",
+                whiteSpace: "pre-wrap"
+              },
+              children: task.description
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              style: {
+                color: "var(--hint)",
+                fontSize: "11px",
+                display: "flex",
+                alignItems: "center",
+                gap: "6px"
+              },
+              children: [
+                /* @__PURE__ */ u5("span", {
+                  children: "Interval:"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("select", {
+                  value: curInterval,
+                  onChange: (e3) => handleInterval(e3.target.value),
+                  style: {
+                    fontSize: "11px",
+                    padding: "1px 4px",
+                    borderRadius: "6px",
+                    background: "var(--tab-track-bg)",
+                    color: "var(--text)",
+                    border: "1px solid var(--glass-divider)",
+                    outline: "none"
+                  },
+                  children: ["30m", "1h", "6h", "12h", "1d", "3d", "7d"].map((v4) => /* @__PURE__ */ u5("option", {
+                    value: v4,
+                    children: v4
+                  }, v4, false, undefined, this))
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ u5("span", {
+                  children: task.last_researched_at ? "· Last: " + new Date(task.last_researched_at).toLocaleString() : "· Not yet researched"
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              style: {
+                color: "var(--hint)",
+                fontSize: "11px",
+                marginTop: "2px"
+              },
+              children: [
+                "Created: ",
+                new Date(task.created_at).toLocaleString(),
+                task.completed_at && " · Completed: " + new Date(task.completed_at).toLocaleString()
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ u5("div", {
+              style: { marginTop: "10px", display: "flex", gap: "8px" },
+              children: [
+                task.focused ? /* @__PURE__ */ u5("button", {
+                  class: "worktree-btn dispose",
+                  style: {
+                    background: "rgba(168,85,247,0.15)",
+                    color: "#a855f7",
+                    borderColor: "#a855f7"
+                  },
+                  onClick: () => handleFocus(false),
+                  children: "Forget"
+                }, undefined, false, undefined, this) : /* @__PURE__ */ u5("button", {
+                  class: "worktree-btn merge",
+                  style: {
+                    background: "rgba(168,85,247,0.15)",
+                    color: "#a855f7",
+                    borderColor: "#a855f7"
+                  },
+                  onClick: () => handleFocus(true),
+                  children: "Recall"
+                }, undefined, false, undefined, this),
+                task.status === "pending" && /* @__PURE__ */ u5("button", {
+                  class: "worktree-btn merge",
+                  onClick: () => handleAction("activate"),
+                  children: "Activate"
+                }, undefined, false, undefined, this),
+                task.status === "active" && /* @__PURE__ */ u5("button", {
+                  class: "worktree-btn merge",
+                  style: {
+                    background: "rgba(34,197,94,0.15)",
+                    color: "#22c55e",
+                    borderColor: "#22c55e"
+                  },
+                  onClick: () => handleAction("complete"),
+                  children: "Complete"
+                }, undefined, false, undefined, this),
+                canCancel && /* @__PURE__ */ u5("button", {
+                  class: "worktree-btn dispose",
+                  onClick: () => handleAction("cancel"),
+                  children: "Cancel"
+                }, undefined, false, undefined, this),
+                canReopen && /* @__PURE__ */ u5("button", {
+                  class: "worktree-btn merge",
+                  onClick: () => handleAction("reopen"),
+                  children: "Reopen"
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          class: "card-title",
+          style: { marginTop: "12px" },
+          children: [
+            "Documents (",
+            task.documents.length,
+            ")"
+          ]
+        }, undefined, true, undefined, this),
+        task.documents.length === 0 ? /* @__PURE__ */ u5("div", {
+          class: "empty-state",
+          style: { padding: "24px" },
+          children: "No documents yet."
+        }, undefined, false, undefined, this) : task.documents.map((d3) => /* @__PURE__ */ u5(DocCard, {
+          doc: d3,
+          taskId
+        }, d3.id, false, undefined, this))
+      ]
+    }, undefined, true, undefined, this);
+  }
+  function DocCard({ doc, taskId }) {
+    const [expanded, setExpanded] = d2(false);
+    const [content, setContent] = d2(null);
+    const [loading, setLoading] = d2(false);
+    const toggle = async () => {
+      if (expanded) {
+        setExpanded(false);
         return;
       }
-      el.innerHTML = tasks.map(function(t) {
-        var sc = STATUS_COLORS[t.status] || STATUS_COLORS.pending;
-        var focusBadge = t.focused ? '<span style="font-size:10px;font-weight:600;padding:2px 6px;border-radius:8px;background:rgba(168,85,247,0.2);color:#a855f7">focused</span>' : "";
-        return '<div class="card glass glass-interactive" style="cursor:pointer;padding:14px' + (t.focused ? ";border-left:3px solid #a855f7" : "") + `" onclick="openResearchTask('` + t.id + `')">` + '<div style="display:flex;align-items:center;justify-content:space-between;gap:8px">' + '<span style="font-weight:600;font-size:15px">' + esc(t.title) + "</span>" + '<div style="display:flex;gap:4px;align-items:center">' + focusBadge + '<span style="font-size:11px;font-weight:600;padding:2px 8px;border-radius:10px;background:' + sc.bg + ";color:" + sc.text + '">' + t.status + "</span>" + "</div>" + "</div>" + (t.description ? '<div style="color:var(--hint);font-size:13px;margin-top:4px;line-height:1.4">' + esc(t.description).substring(0, 120) + "</div>" : "") + '<div style="color:var(--hint);font-size:11px;margin-top:6px">' + t.document_count + " docs · " + new Date(t.created_at).toLocaleDateString() + "</div>" + "</div>";
-      }).join("");
-    } catch (e) {
-      loading.classList.add("hidden");
-      el.innerHTML = '<div class="empty-state">Failed to load tasks.</div>';
-    }
-  }
-  function esc(s) {
-    var d = document.createElement("div");
-    d.textContent = s;
-    return d.innerHTML;
-  }
-  async function openResearchTask(id) {
-    researchCurrentTaskId = id;
-    document.getElementById("research-list-view").classList.add("hidden");
-    document.getElementById("research-detail-view").classList.remove("hidden");
-    var el = document.getElementById("research-detail-content");
-    el.innerHTML = '<div class="loading">Loading...</div>';
-    try {
-      var resp = await fetch(API_BASE + "/miniapp/api/research/" + id + "?initData=" + encodeURIComponent(initData));
-      var task = await resp.json();
-      var sc = STATUS_COLORS[task.status] || STATUS_COLORS.pending;
-      var canCancel = task.status === "pending" || task.status === "active";
-      var canReopen = task.status === "completed" || task.status === "failed";
-      var html = '<div class="card glass">' + '<div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px">' + '<span style="font-weight:700;font-size:17px">' + esc(task.title) + "</span>" + '<span style="font-size:11px;font-weight:600;padding:2px 8px;border-radius:10px;background:' + sc.bg + ";color:" + sc.text + '">' + task.status + "</span>" + "</div>";
-      if (task.description) {
-        html += '<div style="color:var(--hint);font-size:13px;line-height:1.5;margin-bottom:8px;white-space:pre-wrap">' + esc(task.description) + "</div>";
+      setExpanded(true);
+      if (content !== null)
+        return;
+      setLoading(true);
+      try {
+        const data = await apiFetch("/miniapp/api/research/" + taskId + "/doc/" + doc.id);
+        setContent(data.content);
+      } catch {
+        setContent("Failed to load document.");
       }
-      html += '<div style="color:var(--hint);font-size:11px">' + "Created: " + new Date(task.created_at).toLocaleString() + (task.completed_at ? " · Completed: " + new Date(task.completed_at).toLocaleString() : "") + "</div>";
-      html += '<div style="margin-top:10px;display:flex;gap:8px">';
-      if (task.focused) {
-        html += `<button class="worktree-btn dispose" onclick="researchSetFocus('` + id + `',false)" style="background:rgba(168,85,247,0.15);color:#a855f7;border-color:#a855f7">Forget</button>`;
-      } else {
-        html += `<button class="worktree-btn merge" onclick="researchSetFocus('` + id + `',true)" style="background:rgba(168,85,247,0.15);color:#a855f7;border-color:#a855f7">Recall</button>`;
+      setLoading(false);
+    };
+    return /* @__PURE__ */ u5("div", {
+      class: "card glass",
+      style: { padding: "12px", cursor: "pointer" },
+      onClick: toggle,
+      children: [
+        /* @__PURE__ */ u5("div", {
+          style: { display: "flex", alignItems: "center", gap: "8px" },
+          children: [
+            /* @__PURE__ */ u5("span", {
+              style: {
+                color: "var(--hint)",
+                fontFamily: "monospace",
+                fontSize: "12px"
+              },
+              children: [
+                "#",
+                doc.seq
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ u5("span", {
+              style: { fontWeight: 600, fontSize: "14px", flex: 1 },
+              children: doc.title
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("span", {
+              style: {
+                fontSize: "10px",
+                padding: "2px 6px",
+                borderRadius: "8px",
+                background: "var(--tab-track-bg)",
+                color: "var(--hint)"
+              },
+              children: doc.doc_type
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        doc.summary && /* @__PURE__ */ u5("div", {
+          style: {
+            color: "var(--hint)",
+            fontSize: "12px",
+            marginTop: "4px"
+          },
+          children: doc.summary
+        }, undefined, false, undefined, this),
+        expanded && /* @__PURE__ */ u5("div", {
+          style: {
+            marginTop: "8px",
+            borderTop: "1px solid var(--glass-divider)",
+            paddingTop: "8px"
+          },
+          children: loading ? /* @__PURE__ */ u5("div", {
+            class: "loading",
+            style: { padding: "12px" },
+            children: "Loading..."
+          }, undefined, false, undefined, this) : content ? /* @__PURE__ */ u5("div", {
+            class: "md-rendered",
+            style: { maxHeight: "50vh", overflow: "auto", padding: "8px 0" },
+            dangerouslySetInnerHTML: { __html: renderMarkdown(content) }
+          }, undefined, false, undefined, this) : null
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+
+  // src/components/tools/tools-tab.tsx
+  function ToolsTab({ active, sse }) {
+    return /* @__PURE__ */ u5(k, {
+      children: [
+        /* @__PURE__ */ u5(SkillsSection, {
+          active,
+          sse
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5(CommandsSection, {}, undefined, false, undefined, this),
+        /* @__PURE__ */ u5(LogsSection, {
+          active
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5(ResearchSection, {
+          active
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+
+  // src/components/dev/dev-tab.tsx
+  function DevTab({ active, sse }) {
+    const [data, setData] = d2(null);
+    const loadDev = q2(async () => {
+      try {
+        const d3 = await apiFetch("/miniapp/api/dev");
+        setData(d3);
+      } catch {}
+    }, []);
+    y2(() => {
+      if (sse.dev)
+        setData(sse.dev);
+    }, [sse.dev]);
+    y2(() => {
+      if (active && !isFresh(sse.lastUpdate, "dev"))
+        loadDev();
+    }, [active]);
+    const targets = data?.targets || [];
+    const activeId = data?.active_id || "";
+    const isActive = !!data?.active;
+    const handleToggle = async (id) => {
+      const action = id === activeId ? "deactivate" : "activate";
+      const body = action === "activate" ? { action: "activate", id } : { action: "deactivate" };
+      try {
+        const d3 = await apiPost("/miniapp/api/dev", body);
+        if (!d3.error)
+          setData(d3);
+      } catch {}
+    };
+    const handleDelete = async (id, name) => {
+      if (!confirm('Remove "' + name + '"?'))
+        return;
+      try {
+        const d3 = await apiPost("/miniapp/api/dev", {
+          action: "unregister",
+          id
+        });
+        if (!d3.error)
+          setData(d3);
+      } catch {}
+    };
+    const iframeSrc = isActive ? location.origin + "/miniapp/dev/" : "";
+    const targetDisplay = data?.target ? data.target.replace(/^https?:\/\//, "") : "";
+    return /* @__PURE__ */ u5(k, {
+      children: [
+        /* @__PURE__ */ u5("div", {
+          class: "dev-header",
+          children: [
+            /* @__PURE__ */ u5("span", {
+              class: `dev-target-dot${isActive ? " on" : ""}`
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("span", {
+              class: "dev-header-title",
+              children: "Dev Preview"
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ u5("span", {
+              class: "dev-header-target",
+              children: targetDisplay
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        targets.length === 0 ? /* @__PURE__ */ u5("div", {
+          class: "empty-state",
+          children: [
+            "No targets registered.",
+            /* @__PURE__ */ u5("br", {}, undefined, false, undefined, this),
+            "Ask the agent to start a dev server."
+          ]
+        }, undefined, true, undefined, this) : targets.map((t3) => {
+          const isTargetActive = t3.id === activeId;
+          const displayUrl = t3.target.replace(/^https?:\/\//, "");
+          return /* @__PURE__ */ u5("div", {
+            class: `dev-target-item glass glass-interactive${isTargetActive ? " active" : ""}`,
+            onClick: () => handleToggle(t3.id),
+            children: [
+              /* @__PURE__ */ u5("span", {
+                class: `dev-target-dot${isTargetActive ? " on" : ""}`
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ u5("span", {
+                class: "dev-target-name",
+                children: t3.name
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ u5("span", {
+                class: "dev-target-url",
+                children: displayUrl
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ u5("span", {
+                class: "dev-target-delete",
+                onClick: (e3) => {
+                  e3.stopPropagation();
+                  handleDelete(t3.id, t3.name);
+                },
+                children: "×"
+              }, undefined, false, undefined, this)
+            ]
+          }, t3.id, true, undefined, this);
+        }),
+        isActive && /* @__PURE__ */ u5("div", {
+          style: { marginTop: "8px" },
+          children: /* @__PURE__ */ u5("div", {
+            class: "card glass",
+            style: { padding: 0, overflow: "hidden" },
+            children: /* @__PURE__ */ u5("iframe", {
+              src: iframeSrc,
+              style: {
+                width: "100%",
+                height: "70vh",
+                border: "none",
+                borderRadius: "16px"
+              }
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+
+  // src/app.tsx
+  var TABS = [
+    { id: "plan", label: "Plan" },
+    { id: "work", label: "Work" },
+    { id: "tools", label: "Tools" },
+    { id: "dev", label: "Dev" }
+  ];
+  function App() {
+    const [activeTab, setActiveTab] = d2("plan");
+    const indicatorRef = A2(null);
+    const sse = useSSE();
+    const switchTab = q2((id, index) => {
+      setActiveTab(id);
+      if (indicatorRef.current) {
+        indicatorRef.current.style.transform = `translateX(${index * 100}%)`;
       }
-      if (canCancel)
-        html += `<button class="worktree-btn dispose" onclick="researchAction('` + id + `','cancel')">Cancel</button>`;
-      if (canReopen)
-        html += `<button class="worktree-btn merge" onclick="researchAction('` + id + `','reopen')">Reopen</button>`;
-      html += "</div>";
-      html += "</div>";
-      html += '<div class="card-title" style="margin-top:12px">Documents (' + task.documents.length + ")</div>";
-      if (task.documents.length === 0) {
-        html += '<div class="empty-state" style="padding:24px">No documents yet.</div>';
-      } else {
-        html += task.documents.map(function(d) {
-          return `<div class="card glass" style="padding:12px;cursor:pointer" onclick="toggleResearchDoc(this, '` + id + "', '" + d.id + `')">` + '<div style="display:flex;align-items:center;gap:8px">' + '<span style="color:var(--hint);font-family:monospace;font-size:12px">#' + d.seq + "</span>" + '<span style="font-weight:600;font-size:14px;flex:1">' + esc(d.title) + "</span>" + '<span style="font-size:10px;padding:2px 6px;border-radius:8px;background:var(--tab-track-bg);color:var(--hint)">' + d.doc_type + "</span>" + "</div>" + (d.summary ? '<div style="color:var(--hint);font-size:12px;margin-top:4px">' + esc(d.summary) + "</div>" : "") + '<div class="research-doc-body hidden" style="margin-top:8px;border-top:1px solid var(--glass-divider);padding-top:8px">' + '<div class="loading" style="padding:12px">Loading...</div>' + "</div>" + "</div>";
-        }).join("");
-      }
-      el.innerHTML = html;
-    } catch (e) {
-      el.innerHTML = '<div class="empty-state">Failed to load task.</div>';
-    }
+    }, []);
+    return /* @__PURE__ */ u5(k, {
+      children: [
+        /* @__PURE__ */ u5("div", {
+          class: "tabs",
+          children: /* @__PURE__ */ u5("div", {
+            class: "tabs-inner",
+            children: [
+              /* @__PURE__ */ u5("div", {
+                class: "tab-indicator",
+                ref: indicatorRef
+              }, undefined, false, undefined, this),
+              TABS.map((tab, i3) => /* @__PURE__ */ u5("button", {
+                class: `tab${activeTab === tab.id ? " active" : ""}`,
+                onClick: () => switchTab(tab.id, i3),
+                children: tab.label
+              }, tab.id, false, undefined, this))
+            ]
+          }, undefined, true, undefined, this)
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          class: `panel${activeTab === "plan" ? " active" : ""}`,
+          children: /* @__PURE__ */ u5(PlanTab, {
+            active: activeTab === "plan",
+            sse
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          class: `panel${activeTab === "work" ? " active" : ""}`,
+          children: /* @__PURE__ */ u5(WorkTab, {
+            active: activeTab === "work",
+            sse
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          class: `panel${activeTab === "tools" ? " active" : ""}`,
+          children: /* @__PURE__ */ u5(ToolsTab, {
+            active: activeTab === "tools",
+            sse
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ u5("div", {
+          class: `panel${activeTab === "dev" ? " active" : ""}`,
+          children: /* @__PURE__ */ u5(DevTab, {
+            active: activeTab === "dev",
+            sse
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
   }
-  async function toggleResearchDoc(card, taskId, docId) {
-    var body = card.querySelector(".research-doc-body");
-    if (!body)
-      return;
-    if (!body.classList.contains("hidden")) {
-      body.classList.add("hidden");
-      return;
-    }
-    body.classList.remove("hidden");
-    if (body.dataset.loaded)
-      return;
-    try {
-      var resp = await fetch(API_BASE + "/miniapp/api/research/" + taskId + "/doc/" + docId + "?initData=" + encodeURIComponent(initData));
-      var data = await resp.json();
-      body.dataset.loaded = "1";
-      body.innerHTML = '<div class="md-rendered" style="max-height:50vh;overflow:auto;padding:8px 0">' + g.parse(data.content) + "</div>";
-    } catch (e) {
-      body.innerHTML = '<div style="color:var(--hint);font-size:12px">Failed to load document.</div>';
-    }
+
+  // src/index.tsx
+  var tg = window.Telegram.WebApp;
+  tg.ready();
+  var root = document.getElementById("app");
+  if (root) {
+    J(/* @__PURE__ */ u5(App, {}, undefined, false, undefined, this), root);
   }
-  async function researchAction(taskId, action) {
-    try {
-      await fetch(API_BASE + "/miniapp/api/research/" + taskId + "?initData=" + encodeURIComponent(initData), { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ action }) });
-      openResearchTask(taskId);
-    } catch (e) {}
-  }
-  function showResearchList() {
-    document.getElementById("research-detail-view").classList.add("hidden");
-    document.getElementById("research-list-view").classList.remove("hidden");
-    researchCurrentTaskId = null;
-    loadResearch();
-  }
-  function showNewTaskForm() {
-    document.getElementById("research-new-form").classList.remove("hidden");
-    document.getElementById("research-title").focus();
-  }
-  function hideNewTaskForm() {
-    document.getElementById("research-new-form").classList.add("hidden");
-    document.getElementById("research-title").value = "";
-    document.getElementById("research-desc").value = "";
-  }
-  async function createResearchTask() {
-    var title = document.getElementById("research-title").value.trim();
-    var desc = document.getElementById("research-desc").value.trim();
-    if (!title)
-      return;
-    try {
-      await fetch(API_BASE + "/miniapp/api/research?initData=" + encodeURIComponent(initData), { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ title, description: desc }) });
-      hideNewTaskForm();
-      loadResearch();
-    } catch (e) {}
-  }
-  async function researchSetFocus(taskId, recall) {
-    try {
-      await fetch(API_BASE + "/miniapp/api/research/focus?initData=" + encodeURIComponent(initData), {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({ action: recall ? "recall" : "forget", task_id: taskId })
-      });
-      openResearchTask(taskId);
-    } catch (e) {}
-  }
-  window.showNewTaskForm = showNewTaskForm;
-  window.hideNewTaskForm = hideNewTaskForm;
-  window.createResearchTask = createResearchTask;
-  window.openResearchTask = openResearchTask;
-  window.toggleResearchDoc = toggleResearchDoc;
-  window.researchAction = researchAction;
-  window.researchSetFocus = researchSetFocus;
-  window.showResearchList = showResearchList;
 })();
diff --git a/pkg/miniapp/static/index.html b/pkg/miniapp/static/index.html
index f1d950877..b20b105df 100644
--- a/pkg/miniapp/static/index.html
+++ b/pkg/miniapp/static/index.html
@@ -11,179 +11,7 @@
 </head>
 <body>
 
-<div class="tabs">
-  <div class="tabs-inner">
-    <div class="tab-indicator"></div>
-    <button class="tab active" data-panel="plan">Plan</button>
-    <button class="tab" data-panel="git">Git</button>
-    <button class="tab" data-panel="skills">Skills</button>
-    <button class="tab" data-panel="session">Session</button>
-    <button class="tab" data-panel="config">Config</button>
-    <button class="tab" data-panel="research">Research</button>
-    <button class="tab" data-panel="dev">Dev</button>
-    <button class="tab" data-panel="orch">Orch</button>
-  </div>
-</div>
-
-<div id="plan" class="panel active">
-  <div class="loading" id="plan-loading">Loading plan...</div>
-  <div id="plan-content" class="hidden"></div>
-</div>
-
-<div id="skills" class="panel">
-  <div class="loading" id="skills-loading">Loading skills...</div>
-  <div id="skills-list" class="hidden"></div>
-</div>
-
-<div id="session" class="panel">
-  <div class="loading" id="session-loading">Loading session...</div>
-  <div id="session-content" class="hidden"></div>
-  <div id="session-graph" class="hidden"></div>
-  <div id="context-content"></div>
-</div>
-
-<div id="config" class="panel">
-  <div class="card glass">
-    <div class="card-title">Quick Commands</div>
-    <div class="cmd-tiles">
-      <button class="cmd-tile glass glass-interactive" data-cmd="/session">/session</button>
-      <button class="cmd-tile glass glass-interactive" data-cmd="/skills">/skills</button>
-      <button class="cmd-tile glass glass-interactive" data-cmd="/plan clear">/plan clear</button>
-    </div>
-  </div>
-  <div class="card glass">
-    <div class="card-title">Custom Command</div>
-    <div style="display:flex;gap:8px;margin-top:8px">
-      <input id="custom-cmd" class="send-input glass glass-interactive" placeholder="/command args..." style="flex:1">
-      <button class="send-btn" onclick="sendCustomCmd()">Send</button>
-    </div>
-  </div>
-  <div class="card glass" id="logs-section">
-    <div style="display:flex;align-items:center;gap:8px;margin-bottom:8px">
-      <span class="card-title" style="margin:0">Logs</span>
-      <span id="logs-status" class="dev-target-dot"></span>
-    </div>
-    <div class="log-filter-chips">
-      <button class="log-filter-chip active" data-component="">All</button>
-      <button class="log-filter-chip" data-component="telego">Telego</button>
-      <button class="log-filter-chip" data-component="dev-console">Console</button>
-    </div>
-    <div id="logs-content"></div>
-    <div class="log-pagination">
-      <button class="log-page-btn" id="logs-page-prev" type="button">Newer</button>
-      <span id="logs-page-info">1/1 (0)</span>
-      <button class="log-page-btn" id="logs-page-next" type="button">Older</button>
-    </div>
-    <div class="log-actions">
-      <button class="log-snap-btn" onclick="saveLogSnapshot()">Save Snapshot</button>
-    </div>
-  </div>
-</div>
-
-<div id="research" class="panel">
-  <div id="research-list-view">
-    <div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:12px">
-      <span class="card-title" style="margin:0">Research Tasks</span>
-      <button class="send-btn" style="padding:6px 14px;font-size:13px" onclick="showNewTaskForm()">+ New</button>
-    </div>
-    <div id="research-new-form" class="hidden" style="margin-bottom:12px">
-      <div class="card glass" style="padding:12px">
-        <input id="research-title" class="send-input glass glass-interactive" placeholder="Task title..." style="width:100%;margin-bottom:8px">
-        <textarea id="research-desc" class="send-input glass glass-interactive" placeholder="Description (optional)..." style="width:100%;min-height:60px;resize:vertical;margin-bottom:8px;border-radius:12px;padding:10px 16px"></textarea>
-        <div style="display:flex;gap:8px;justify-content:flex-end">
-          <button class="send-btn" style="padding:6px 14px;font-size:13px;background:var(--hint)" onclick="hideNewTaskForm()">Cancel</button>
-          <button class="send-btn" style="padding:6px 14px;font-size:13px" onclick="createResearchTask()">Create</button>
-        </div>
-      </div>
-    </div>
-    <div class="loading hidden" id="research-loading">Loading tasks...</div>
-    <div id="research-tasks"></div>
-  </div>
-  <div id="research-detail-view" class="hidden">
-    <button class="git-back-btn" onclick="showResearchList()">&#8249; Back</button>
-    <div id="research-detail-content"></div>
-  </div>
-</div>
-
-<div id="git" class="panel">
-  <div class="loading" id="git-loading">Loading git log...</div>
-  <div id="git-content" class="hidden"></div>
-</div>
-
-<div id="dev" class="panel">
-  <div id="dev-header" class="dev-header">
-    <span id="dev-dot" class="dev-target-dot"></span>
-    <span class="dev-header-title">Dev Preview</span>
-    <span id="dev-header-target" class="dev-header-target"></span>
-  </div>
-  <div id="dev-targets-list"></div>
-  <div id="dev-iframe-wrap" class="hidden" style="margin-top:8px">
-    <div class="card glass" style="padding:0;overflow:hidden">
-      <iframe id="dev-iframe" src="" style="width:100%;height:70vh;border:none;border-radius:16px"></iframe>
-    </div>
-  </div>
-</div>
-
-<div id="orch" class="panel">
-  <div class="orch-room-row">
-    <div class="orch-side" id="orch-panel-left">
-      <div class="orch-badge alive" id="orch-badge-conductor">
-        <div class="orch-badge-emoji">👑</div>
-        <div class="orch-badge-label">CNDR</div>
-        <div class="orch-badge-dot"></div>
-      </div>
-      <div class="orch-badge" id="orch-badge-secretary">
-        <div class="orch-badge-emoji">👩‍💼</div>
-        <div class="orch-badge-label">SEC</div>
-        <div class="orch-badge-dot"></div>
-      </div>
-      <div class="orch-badge alive" id="orch-badge-heartbeat">
-        <div class="orch-badge-emoji">🕊️</div>
-        <div class="orch-badge-label">HB</div>
-        <div class="orch-badge-dot"></div>
-      </div>
-    </div>
-    <div class="orch-canvas-wrap">
-      <canvas id="orch-canvas" width="320" height="320"></canvas>
-    </div>
-    <div class="orch-side" id="orch-panel-right">
-      <div class="orch-badge" id="orch-badge-s0">
-        <div class="orch-badge-emoji">🔍</div>
-        <div class="orch-badge-label">SCOUT</div>
-        <div class="orch-badge-dot"></div>
-      </div>
-      <div class="orch-badge" id="orch-badge-s1">
-        <div class="orch-badge-emoji">📊</div>
-        <div class="orch-badge-label">ANLY</div>
-        <div class="orch-badge-dot"></div>
-      </div>
-      <div class="orch-badge" id="orch-badge-s2">
-        <div class="orch-badge-emoji">💻</div>
-        <div class="orch-badge-label">CODE</div>
-        <div class="orch-badge-dot"></div>
-      </div>
-      <div class="orch-badge" id="orch-badge-s3">
-        <div class="orch-badge-emoji">🔧</div>
-        <div class="orch-badge-label">WRKR</div>
-        <div class="orch-badge-dot"></div>
-      </div>
-      <div class="orch-badge" id="orch-badge-s4">
-        <div class="orch-badge-emoji">🎯</div>
-        <div class="orch-badge-label">CORD</div>
-        <div class="orch-badge-dot"></div>
-      </div>
-    </div>
-  </div>
-  <div class="orch-status">
-    <span class="orch-dot" id="orch-status-dot"></span>
-    <span id="orch-status-text">Connecting…</span>
-  </div>
-</div>
-
-<div class="send-bar hidden" id="send-bar">
-  <input id="skill-msg" class="send-input glass glass-interactive" placeholder="Message for skill...">
-  <button class="send-btn" id="send-skill-btn" onclick="sendSkillCommand()">Send</button>
-</div>
+<div id="app"></div>
 
 <script>
 window.ORCH_ENABLED = {{if .OrchEnabled}}true{{else}}false{{end}};
@@ -191,5 +19,3 @@ window.ORCH_ENABLED = {{if .OrchEnabled}}true{{else}}false{{end}};
 <script src="/miniapp/dist/app.js"></script>
 </body>
 </html>
-
-