npm - claws-code - Versions diffs - 0.8.0 - Mend

claws-code 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (180) hide show

package/.claude/commands/claws-auto.md +90 -0
package/.claude/commands/claws-bin.md +28 -0
package/.claude/commands/claws-cleanup.md +28 -0
package/.claude/commands/claws-do.md +82 -0
package/.claude/commands/claws-fix.md +40 -0
package/.claude/commands/claws-goal.md +111 -0
package/.claude/commands/claws-help.md +54 -0
package/.claude/commands/claws-plan.md +103 -0
package/.claude/commands/claws-report.md +29 -0
package/.claude/commands/claws-status.md +37 -0
package/.claude/commands/claws-update.md +32 -0
package/.claude/commands/claws.md +64 -0
package/.claude/rules/claws-default-behavior.md +76 -0
package/.claude/settings.json +112 -0
package/.claude/settings.local.json +19 -0
package/.claude/skills/claws-auto-engine/SKILL.md +97 -0
package/.claude/skills/claws-goal-tracker/SKILL.md +106 -0
package/.claude/skills/claws-prompt-templates/SKILL.md +203 -0
package/.claude/skills/claws-wave-lead/SKILL.md +126 -0
package/.claude/skills/claws-wave-subworker/SKILL.md +60 -0
package/CHANGELOG.md +1949 -0
package/LICENSE +21 -0
package/README.md +420 -0
package/bin/cli.js +84 -0
package/cli.js +223 -0
package/docs/ARCHITECTURE.md +511 -0
package/docs/event-protocol.md +588 -0
package/docs/features.md +562 -0
package/docs/guide.md +891 -0
package/docs/index.html +716 -0
package/docs/protocol.md +323 -0
package/extension/.vscodeignore +15 -0
package/extension/CHANGELOG.md +1906 -0
package/extension/LICENSE +21 -0
package/extension/README.md +137 -0
package/extension/docs/features.md +424 -0
package/extension/docs/protocol.md +197 -0
package/extension/esbuild.mjs +25 -0
package/extension/icon.png +0 -0
package/extension/native/.metadata.json +10 -0
package/extension/native/node-pty/LICENSE +69 -0
package/extension/native/node-pty/README.md +165 -0
package/extension/native/node-pty/lib/conpty_console_list_agent.js +16 -0
package/extension/native/node-pty/lib/conpty_console_list_agent.js.map +1 -0
package/extension/native/node-pty/lib/eventEmitter2.js +47 -0
package/extension/native/node-pty/lib/eventEmitter2.js.map +1 -0
package/extension/native/node-pty/lib/index.js +52 -0
package/extension/native/node-pty/lib/index.js.map +1 -0
package/extension/native/node-pty/lib/interfaces.js +7 -0
package/extension/native/node-pty/lib/interfaces.js.map +1 -0
package/extension/native/node-pty/lib/shared/conout.js +11 -0
package/extension/native/node-pty/lib/shared/conout.js.map +1 -0
package/extension/native/node-pty/lib/terminal.js +190 -0
package/extension/native/node-pty/lib/terminal.js.map +1 -0
package/extension/native/node-pty/lib/types.js +7 -0
package/extension/native/node-pty/lib/types.js.map +1 -0
package/extension/native/node-pty/lib/unixTerminal.js +346 -0
package/extension/native/node-pty/lib/unixTerminal.js.map +1 -0
package/extension/native/node-pty/lib/utils.js +39 -0
package/extension/native/node-pty/lib/utils.js.map +1 -0
package/extension/native/node-pty/lib/windowsConoutConnection.js +125 -0
package/extension/native/node-pty/lib/windowsConoutConnection.js.map +1 -0
package/extension/native/node-pty/lib/windowsPtyAgent.js +320 -0
package/extension/native/node-pty/lib/windowsPtyAgent.js.map +1 -0
package/extension/native/node-pty/lib/windowsTerminal.js +199 -0
package/extension/native/node-pty/lib/windowsTerminal.js.map +1 -0
package/extension/native/node-pty/lib/worker/conoutSocketWorker.js +22 -0
package/extension/native/node-pty/lib/worker/conoutSocketWorker.js.map +1 -0
package/extension/native/node-pty/package.json +64 -0
package/extension/native/node-pty/prebuilds/darwin-arm64/pty.node +0 -0
package/extension/native/node-pty/prebuilds/darwin-arm64/spawn-helper +0 -0
package/extension/native/node-pty/prebuilds/darwin-x64/pty.node +0 -0
package/extension/native/node-pty/prebuilds/darwin-x64/spawn-helper +0 -0
package/extension/native/node-pty/prebuilds/win32-arm64/conpty/OpenConsole.exe +0 -0
package/extension/native/node-pty/prebuilds/win32-arm64/conpty/conpty.dll +0 -0
package/extension/native/node-pty/prebuilds/win32-arm64/conpty.node +0 -0
package/extension/native/node-pty/prebuilds/win32-arm64/conpty_console_list.node +0 -0
package/extension/native/node-pty/prebuilds/win32-arm64/pty.node +0 -0
package/extension/native/node-pty/prebuilds/win32-arm64/winpty-agent.exe +0 -0
package/extension/native/node-pty/prebuilds/win32-arm64/winpty.dll +0 -0
package/extension/native/node-pty/prebuilds/win32-x64/conpty/OpenConsole.exe +0 -0
package/extension/native/node-pty/prebuilds/win32-x64/conpty/conpty.dll +0 -0
package/extension/native/node-pty/prebuilds/win32-x64/conpty.node +0 -0
package/extension/native/node-pty/prebuilds/win32-x64/conpty_console_list.node +0 -0
package/extension/native/node-pty/prebuilds/win32-x64/pty.node +0 -0
package/extension/native/node-pty/prebuilds/win32-x64/winpty-agent.exe +0 -0
package/extension/native/node-pty/prebuilds/win32-x64/winpty.dll +0 -0
package/extension/package-lock.json +605 -0
package/extension/package.json +343 -0
package/extension/scripts/bundle-native.mjs +104 -0
package/extension/scripts/deploy-dev.mjs +60 -0
package/extension/src/ansi-strip.ts +52 -0
package/extension/src/backends/vscode/claws-pty.ts +483 -0
package/extension/src/backends/vscode/status-bar.ts +99 -0
package/extension/src/backends/vscode/vscode-backend.ts +282 -0
package/extension/src/capture-store.ts +125 -0
package/extension/src/event-log.ts +629 -0
package/extension/src/event-schemas.ts +478 -0
package/extension/src/extension.js +492 -0
package/extension/src/extension.ts +873 -0
package/extension/src/lifecycle-engine.ts +60 -0
package/extension/src/lifecycle-rules.ts +171 -0
package/extension/src/lifecycle-store.ts +506 -0
package/extension/src/peer-registry.ts +176 -0
package/extension/src/pipeline-registry.ts +82 -0
package/extension/src/platform.ts +64 -0
package/extension/src/protocol.ts +532 -0
package/extension/src/server-config.ts +98 -0
package/extension/src/server.ts +2210 -0
package/extension/src/task-registry.ts +51 -0
package/extension/src/terminal-backend.ts +211 -0
package/extension/src/terminal-manager.ts +395 -0
package/extension/src/topic-registry.ts +70 -0
package/extension/src/topic-utils.ts +46 -0
package/extension/src/transport.ts +45 -0
package/extension/src/uninstall-cleanup.ts +232 -0
package/extension/src/wave-registry.ts +314 -0
package/extension/src/websocket-transport.ts +153 -0
package/extension/tsconfig.json +23 -0
package/lib/capabilities.js +145 -0
package/lib/dry-run.js +43 -0
package/lib/install.js +1018 -0
package/lib/mcp-setup.js +92 -0
package/lib/platform.js +240 -0
package/lib/preflight.js +152 -0
package/lib/shell-hook.js +343 -0
package/lib/uninstall.js +162 -0
package/lib/verify.js +166 -0
package/mcp_server.js +3529 -0
package/package.json +48 -0
package/rules/claws-default-behavior.md +72 -0
package/scripts/_helpers/atomic-file.mjs +137 -0
package/scripts/_helpers/fix-repair.js +64 -0
package/scripts/_helpers/json-safe.mjs +218 -0
package/scripts/bump-version.sh +84 -0
package/scripts/codegen/gen-docs.mjs +61 -0
package/scripts/codegen/gen-json-schema.mjs +62 -0
package/scripts/codegen/gen-mcp-tools.mjs +358 -0
package/scripts/codegen/gen-types.mjs +172 -0
package/scripts/codegen/index.mjs +42 -0
package/scripts/dev-hooks/check-extension-dirs.js +77 -0
package/scripts/dev-hooks/check-open-claws-terminals.js +70 -0
package/scripts/dev-hooks/check-stale-main.js +55 -0
package/scripts/dev-hooks/check-tag-pushed.js +51 -0
package/scripts/dev-hooks/check-tag-vs-main.js +56 -0
package/scripts/dev-vsix-install.sh +60 -0
package/scripts/fix.sh +702 -0
package/scripts/gen-client-types.mjs +81 -0
package/scripts/git-hooks/pre-commit +31 -0
package/scripts/hooks/lifecycle-state.js +61 -0
package/scripts/hooks/package.json +4 -0
package/scripts/hooks/post-tool-use-claws.js +292 -0
package/scripts/hooks/pre-bash-no-verify-block.js +72 -0
package/scripts/hooks/pre-tool-use-claws.js +206 -0
package/scripts/hooks/session-start-claws.js +97 -0
package/scripts/hooks/stop-claws.js +88 -0
package/scripts/inject-claude-md.js +205 -0
package/scripts/inject-dev-hooks.js +96 -0
package/scripts/inject-global-claude-md.js +140 -0
package/scripts/inject-settings-hooks.js +370 -0
package/scripts/install.ps1 +146 -0
package/scripts/install.sh +1729 -0
package/scripts/monitor-arm-watch.js +155 -0
package/scripts/rebuild-node-pty.sh +245 -0
package/scripts/report.sh +232 -0
package/scripts/shell-hook.fish +164 -0
package/scripts/shell-hook.ps1 +33 -0
package/scripts/shell-hook.sh +232 -0
package/scripts/stream-events.js +399 -0
package/scripts/terminal-wrapper.sh +36 -0
package/scripts/test-enforcement.sh +132 -0
package/scripts/test-install.sh +174 -0
package/scripts/test-installer-parity.sh +135 -0
package/scripts/test-template-enforcement.sh +76 -0
package/scripts/uninstall.sh +143 -0
package/scripts/update.sh +337 -0
package/scripts/verify-release.sh +323 -0
package/scripts/verify-wrapped.sh +194 -0
package/templates/CLAUDE.global.md +135 -0
package/templates/CLAUDE.project.md +37 -0

package/docs/index.html ADDED Viewed

@@ -0,0 +1,716 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Claws — Terminal Control Bridge for VS Code</title>
+  <meta name="description" content="Control any VS Code terminal from the outside. List, create, send, execute, read, and close terminals via a JSON socket. Built for AI pair programming.">
+  <meta property="og:title" content="Claws — Terminal Control Bridge for VS Code">
+  <meta property="og:description" content="Control any VS Code terminal from the outside via a JSON socket. Built for AI pair programming with Claude Code.">
+  <meta property="og:image" content="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/social-preview.png">
+  <meta property="og:url" content="https://neunaha.github.io/claws">
+  <meta name="twitter:card" content="summary_large_image">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
+  <style>
+    :root {
+      --bg: #0A0A0B;
+      --bg-2: #111113;
+      --bg-3: #1a1a1d;
+      --text: #F5EFE6;
+      --text-muted: #8A847B;
+      --accent: #C85A3E;
+      --accent-dim: rgba(200, 90, 62, 0.15);
+      --code-bg: #161618;
+      --border: #2a2a2d;
+      --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+      --mono: 'JetBrains Mono', 'SF Mono', 'Fira Code', monospace;
+    }
+    * { margin: 0; padding: 0; box-sizing: border-box; }
+    body {
+      background: var(--bg);
+      color: var(--text);
+      font-family: var(--font);
+      font-size: 16px;
+      line-height: 1.7;
+      -webkit-font-smoothing: antialiased;
+    }
+    a { color: var(--accent); text-decoration: none; }
+    a:hover { text-decoration: underline; }
+    /* Nav */
+    nav {
+      position: fixed; top: 0; width: 100%; z-index: 100;
+      background: rgba(10, 10, 11, 0.85);
+      backdrop-filter: blur(12px);
+      border-bottom: 1px solid var(--border);
+      padding: 14px 0;
+    }
+    nav .inner {
+      max-width: 1100px; margin: 0 auto; padding: 0 24px;
+      display: flex; align-items: center; justify-content: space-between;
+    }
+    nav .logo { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 18px; }
+    nav .logo img { width: 28px; height: 28px; border-radius: 6px; }
+    nav .links { display: flex; gap: 28px; font-size: 14px; color: var(--text-muted); }
+    nav .links a { color: var(--text-muted); }
+    nav .links a:hover { color: var(--text); text-decoration: none; }
+    .btn {
+      display: inline-block; padding: 10px 24px; border-radius: 8px;
+      font-weight: 600; font-size: 14px; transition: all 0.2s;
+    }
+    .btn-primary { background: var(--accent); color: white; }
+    .btn-primary:hover { background: #b5502f; text-decoration: none; }
+    .btn-ghost { border: 1px solid var(--border); color: var(--text); }
+    .btn-ghost:hover { border-color: var(--text-muted); text-decoration: none; }
+    /* Hero */
+    .hero {
+      padding: 140px 24px 80px;
+      text-align: center;
+      max-width: 800px; margin: 0 auto;
+    }
+    .hero img.logo-img { width: 80px; height: 80px; margin-bottom: 24px; border-radius: 16px; }
+    .hero h1 { font-size: 52px; font-weight: 800; letter-spacing: -1.5px; margin-bottom: 16px; }
+    .hero h1 span { color: var(--accent); }
+    .hero p.sub { font-size: 20px; color: var(--text-muted); max-width: 600px; margin: 0 auto 32px; }
+    .hero .buttons { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
+    .hero .badge-row { margin-top: 24px; display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
+    .hero .badge-row img { height: 22px; }
+    /* Sections */
+    section { padding: 80px 24px; max-width: 1100px; margin: 0 auto; }
+    section.alt { background: var(--bg-2); max-width: 100%; }
+    section.alt .inner { max-width: 1100px; margin: 0 auto; }
+    .section-label { font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: 2px; color: var(--accent); margin-bottom: 8px; }
+    h2 { font-size: 36px; font-weight: 700; letter-spacing: -0.5px; margin-bottom: 16px; }
+    h3 { font-size: 22px; font-weight: 600; margin-bottom: 8px; margin-top: 32px; }
+    p { margin-bottom: 16px; color: var(--text-muted); }
+    p strong { color: var(--text); }
+    /* Image */
+    .img-full {
+      width: 100%; border-radius: 12px; border: 1px solid var(--border);
+      margin: 24px 0; box-shadow: 0 4px 24px rgba(0,0,0,0.4);
+    }
+    /* Code */
+    pre {
+      background: var(--code-bg); border: 1px solid var(--border);
+      border-radius: 10px; padding: 20px 24px; overflow-x: auto;
+      font-family: var(--mono); font-size: 13px; line-height: 1.6;
+      margin: 16px 0 24px; color: var(--text);
+    }
+    code { font-family: var(--mono); font-size: 13px; }
+    p code { background: var(--code-bg); padding: 2px 6px; border-radius: 4px; }
+    /* Feature grid */
+    .features { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px; margin-top: 32px; }
+    .feature-card {
+      background: var(--bg-3); border: 1px solid var(--border);
+      border-radius: 12px; padding: 28px;
+    }
+    .feature-card h3 { margin-top: 0; font-size: 18px; }
+    .feature-card p { font-size: 14px; }
+    .feature-card .icon { font-size: 28px; margin-bottom: 12px; }
+    /* Case study */
+    .case-study {
+      background: var(--bg-3); border: 1px solid var(--border);
+      border-radius: 12px; padding: 32px; margin: 24px 0;
+    }
+    .case-study .label { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: 2px; color: var(--accent); margin-bottom: 8px; }
+    .case-study h3 { margin-top: 0; }
+    /* Table */
+    table { width: 100%; border-collapse: collapse; margin: 16px 0 24px; font-size: 14px; }
+    th { text-align: left; padding: 10px 16px; border-bottom: 2px solid var(--border); color: var(--text); font-weight: 600; }
+    td { padding: 10px 16px; border-bottom: 1px solid var(--border); color: var(--text-muted); }
+    td code { background: var(--code-bg); padding: 2px 6px; border-radius: 4px; }
+    /* Footer */
+    footer {
+      border-top: 1px solid var(--border); padding: 40px 24px;
+      text-align: center; color: var(--text-muted); font-size: 14px;
+    }
+    footer a { color: var(--text-muted); }
+    /* Best practice cards */
+    .bp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 16px; }
+    .bp-card { background: var(--bg-3); border-radius: 10px; padding: 20px; border-left: 3px solid var(--accent); }
+    .bp-card.dont { border-left-color: #e74c3c; }
+    .bp-card h4 { font-size: 14px; margin-bottom: 6px; }
+    .bp-card p { font-size: 13px; margin-bottom: 0; }
+    /* Logo glow */
+    .logo-glow {
+      animation: pulse-glow 3s ease-in-out infinite;
+      border-radius: 16px;
+    }
+    @keyframes pulse-glow {
+      0%, 100% { box-shadow: 0 0 30px rgba(200,90,62,0.3); }
+      50% { box-shadow: 0 0 60px rgba(200,90,62,0.6), 0 0 100px rgba(200,90,62,0.2); }
+    }
+    /* Scroll reveal */
+    .reveal { opacity: 0; transform: translateY(30px); transition: opacity 0.6s ease, transform 0.6s ease; }
+    .reveal.visible { opacity: 1; transform: translateY(0); }
+    /* Stats bar */
+    .stats-bar {
+      display: flex; justify-content: center; gap: 48px; flex-wrap: wrap;
+      padding: 40px 24px; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border);
+      margin: 0 auto; max-width: 900px;
+    }
+    .stat { text-align: center; }
+    .stat .num { font-size: 36px; font-weight: 800; color: var(--accent); font-family: var(--mono); }
+    .stat .label { font-size: 13px; color: var(--text-muted); margin-top: 4px; }
+    /* Image carousel */
+    .carousel {
+      position: relative; overflow: hidden; border-radius: 12px;
+      border: 1px solid var(--border); margin: 32px 0;
+      box-shadow: 0 8px 40px rgba(0,0,0,0.5);
+    }
+    .carousel-track {
+      display: flex; transition: transform 0.5s ease;
+    }
+    .carousel-track img {
+      min-width: 100%; height: auto; display: block;
+    }
+    .carousel-dots {
+      display: flex; justify-content: center; gap: 8px;
+      padding: 12px 0;
+    }
+    .carousel-dot {
+      width: 10px; height: 10px; border-radius: 50%;
+      background: var(--border); cursor: pointer; border: none;
+      transition: background 0.3s;
+    }
+    .carousel-dot.active { background: var(--accent); }
+    /* Floating label badges */
+    .tech-badge {
+      display: inline-flex; align-items: center; gap: 6px;
+      background: var(--bg-3); border: 1px solid var(--border);
+      border-radius: 20px; padding: 6px 14px; font-size: 13px;
+      color: var(--text-muted); margin: 4px;
+    }
+    .tech-badge svg { width: 16px; height: 16px; fill: currentColor; }
+    .tech-badge.accent { border-color: var(--accent); color: var(--accent); }
+    /* Feature card hover */
+    .feature-card { transition: transform 0.2s, border-color 0.2s; }
+    .feature-card:hover { transform: translateY(-4px); border-color: var(--accent); }
+    /* Typing animation for code */
+    .typing { border-right: 2px solid var(--accent); animation: blink 1s infinite; display: inline; }
+    @keyframes blink { 0%, 100% { border-color: var(--accent); } 50% { border-color: transparent; } }
+    @media (max-width: 768px) {
+      .hero h1 { font-size: 36px; }
+      .hero p.sub { font-size: 17px; }
+      .features { grid-template-columns: 1fr; }
+      .bp-grid { grid-template-columns: 1fr; }
+      nav .links { display: none; }
+      .stats-bar { gap: 24px; }
+      .stat .num { font-size: 28px; }
+    }
+  </style>
+</head>
+<body>
+<nav>
+  <div class="inner">
+    <div class="logo">
+      <img src="https://raw.githubusercontent.com/neunaha/claws/main/extension/icon.png" alt="Claws">
+      Claws
+    </div>
+    <div class="links">
+      <a href="#features">Features</a>
+      <a href="#how-it-works">How It Works</a>
+      <a href="#best-practices">Best Practices</a>
+      <a href="#case-studies">Case Studies</a>
+      <a href="https://github.com/neunaha/claws">GitHub</a>
+    </div>
+    <a href="https://github.com/neunaha/claws#install" class="btn btn-primary">Get Started</a>
+  </div>
+</nav>
+<!-- Hero -->
+<div style="position: relative; padding-top: 60px; overflow: hidden;">
+  <!-- Cinematic background -->
+  <div style="position: relative;">
+    <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/hero-cinematic.png" alt="Claws — Terminal Orchestration" style="width: 100%; display: block; opacity: 0.6;">
+    <div style="position: absolute; bottom: 0; left: 0; right: 0; height: 60%; background: linear-gradient(transparent, var(--bg));"></div>
+  </div>
+  <!-- Hero content overlaid -->
+  <div style="position: relative; text-align: center; max-width: 900px; margin: -200px auto 0; padding: 0 24px 60px; z-index: 2;">
+    <img class="logo-glow" src="https://raw.githubusercontent.com/neunaha/claws/main/extension/icon.png" alt="Claws" style="width: 80px; height: 80px; margin-bottom: 20px;">
+    <h1 style="font-size: 56px; font-weight: 800; letter-spacing: -2px; margin-bottom: 12px; line-height: 1.1;">
+      Your AI just got<br><span style="color: var(--accent);">terminal superpowers</span>.
+    </h1>
+    <p style="font-size: 20px; color: var(--text-muted); max-width: 650px; margin: 0 auto 12px; line-height: 1.6;">
+      One extension. One socket. Full control over every VS Code terminal from the outside. Your AI writes code in one terminal, tests in another, deploys in a third — while you watch.
+    </p>
+    <p style="font-size: 15px; color: var(--accent); font-family: var(--mono); margin-bottom: 16px;">
+      one command &nbsp;&middot;&nbsp; zero dependencies &nbsp;&middot;&nbsp; terminal transforms instantly
+    </p>
+    <p style="font-size: 14px; color: var(--text-muted); margin-bottom: 8px;">Paste this into any Claude Code terminal:</p>
+    <pre style="background: var(--code-bg); border: 2px solid var(--accent); border-radius: 10px; padding: 16px 24px; display: inline-block; text-align: left; font-size: 15px; margin-bottom: 8px; max-width: 750px; cursor: pointer; position: relative;" onclick="navigator.clipboard.writeText('install claws from https://github.com/neunaha/claws — run the install script and set up everything'); this.style.borderColor='#4ade80'; setTimeout(()=>this.style.borderColor='#C85A3E',1500);">install claws from https://github.com/neunaha/claws — run the install script and set up everything</pre>
+    <p style="font-size: 12px; color: var(--text-muted); margin-bottom: 20px;">click to copy</p>
+    <div style="display: flex; gap: 12px; justify-content: center; flex-wrap: wrap;">
+      <a href="https://github.com/neunaha/claws#install" class="btn btn-primary" style="padding: 14px 32px; font-size: 16px;">Get Started — 30 seconds</a>
+      <a href="https://github.com/neunaha/claws" class="btn btn-ghost" style="padding: 14px 32px; font-size: 16px;">Star on GitHub</a>
+    </div>
+    <div style="margin-top: 20px; display: flex; gap: 8px; justify-content: center; flex-wrap: wrap;">
+      <img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="MIT">
+      <img src="https://img.shields.io/badge/VS%20Code-1.93+-007ACC.svg" alt="VS Code">
+      <img src="https://img.shields.io/badge/dependencies-zero-brightgreen.svg" alt="Zero deps">
+      <img src="https://img.shields.io/badge/Node.js-only-339933.svg" alt="Node.js">
+      <img src="https://img.shields.io/badge/Python-not%20required-lightgrey.svg" alt="No Python">
+      <img src="https://img.shields.io/github/stars/neunaha/claws?style=social" alt="Stars">
+    </div>
+  </div>
+</div>
+<!-- Before/After -->
+<section style="padding: 40px 24px 20px; max-width: 1100px; margin: 0 auto;" class="reveal">
+  <div class="section-label" style="text-align: center;">The Problem → The Solution</div>
+  <img class="img-full" src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/before-after.png" alt="Before and After Claws">
+  <p style="text-align: center; max-width: 700px; margin: 0 auto;">
+    <strong>Before:</strong> copy-paste loop between Claude and terminal. One terminal. No visibility.<br>
+    <strong>After:</strong> your AI controls every terminal directly. Parallel workers. Full visibility. You just watch.
+  </p>
+</section>
+<!-- Install Flow -->
+<section style="padding: 20px 24px 40px; max-width: 1100px; margin: 0 auto;" class="reveal">
+  <div class="section-label" style="text-align: center;">Get Started in 3 Steps</div>
+  <h2 style="text-align: center;">Install → Reload → Ready</h2>
+  <img class="img-full" src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/install-flow.png" alt="Install Flow">
+  <p style="text-align: center; color: var(--text-muted);">Zero dependencies. No Python. No pip. No brew. Just Node.js (ships with VS Code).</p>
+</section>
+<!-- What You See -->
+<section style="padding: 20px 24px 40px; max-width: 1100px; margin: 0 auto;" class="reveal">
+  <div class="section-label" style="text-align: center;">What You'll See</div>
+  <h2 style="text-align: center;">Your terminal transforms</h2>
+  <img class="img-full" src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/what-you-see.png" alt="What You See After Install">
+  <p style="text-align: center; color: var(--text-muted);">CLAWS banner in every terminal. Worker tabs in the panel. "Claws Wrapped Terminal" in the dropdown. Shell commands ready.</p>
+</section>
+<!-- Stats bar -->
+<div class="stats-bar reveal">
+  <div class="stat"><div class="num">8</div><div class="label">Terminal Control Tools</div></div>
+  <div class="stat"><div class="num">0</div><div class="label">Dependencies</div></div>
+  <div class="stat"><div class="num">30s</div><div class="label">Install Time</div></div>
+  <div class="stat"><div class="num">5</div><div class="label">Lines to Full Control</div></div>
+</div>
+<!-- Tech badges -->
+<div style="text-align: center; padding: 32px 24px;" class="reveal">
+  <span class="tech-badge accent">&#9654; VS Code Extension</span>
+  <span class="tech-badge accent">&#9881; Node.js Only</span>
+  <span class="tech-badge">&#128225; MCP Server</span>
+  <span class="tech-badge">&#128274; Safety Gate</span>
+  <span class="tech-badge">&#128196; Pty Capture</span>
+  <span class="tech-badge">&#9881; File-Based Exec</span>
+  <span class="tech-badge">&#128203; Bracketed Paste</span>
+  <span class="tech-badge">&#127760; Cross-Device (planned)</span>
+</div>
+<!-- Image carousel — all architecture diagrams -->
+<section style="padding-top: 20px;" class="reveal">
+  <div class="section-label" style="text-align: center;">Visual Overview</div>
+  <h2 style="text-align: center;">See the full architecture</h2>
+  <div class="carousel" id="archCarousel">
+    <div class="carousel-track" id="archTrack">
+      <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/before-after.png" alt="Before and After">
+      <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/architecture.png" alt="Architecture">
+      <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/wrapped-terminal.png" alt="Wrapped Terminal">
+      <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/what-you-see.png" alt="What You See">
+      <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/ai-orchestration.png" alt="AI Orchestration">
+      <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/slash-commands.png" alt="Slash Commands">
+      <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/install-flow.png" alt="Install Flow">
+      <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/zero-dep-install.png" alt="Zero Dependencies">
+      <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/cross-device.png" alt="Cross-Device">
+    </div>
+  </div>
+  <div class="carousel-dots" id="archDots"></div>
+</section>
+<!-- Problem/Solution -->
+<section class="reveal">
+  <div class="section-label">Before Claws vs After</div>
+  <h2>VS Code terminals were a black box. Not anymore.</h2>
+  <p>Every developer runs code, builds, AI agents, and servers inside VS Code terminals. But there was <strong>no programmatic API to control them from the outside</strong>. You couldn't list what's running. Couldn't send a command from a script. Couldn't read the output of an interactive TUI session.</p>
+  <p><strong>Claws changes that with one extension and 5 lines of code.</strong> A socket server inside VS Code accepts JSON commands from any external process — Python scripts, AI orchestrators, CI runners, or other machines on your network.</p>
+<pre>// Raw socket — works from any language
+echo '{"id":1,"cmd":"create","name":"build","wrapped":true}' | nc -U .claws/claws.sock
+echo '{"id":2,"cmd":"exec","id":"1","command":"npm test"}' | nc -U .claws/claws.sock
+echo '{"id":3,"cmd":"close","id":"1"}' | nc -U .claws/claws.sock
+// Or via MCP — Claude Code gets 8 tools natively, zero code needed</pre>
+</section>
+<!-- Architecture -->
+<section class="alt" id="how-it-works">
+  <div class="inner">
+    <div class="section-label">Architecture</div>
+    <h2>How Claws works</h2>
+    <p>Claws runs inside VS Code as an extension. It creates a Unix socket server that external clients connect to. Wrapped terminals capture full pty output via <code>script(1)</code> — readable even for TUI sessions like Claude Code, vim, and htop.</p>
+    <img class="img-full" src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/architecture.png" alt="Claws Architecture">
+  </div>
+</section>
+<!-- Wrapped Terminals -->
+<section>
+  <div class="section-label">Core Feature</div>
+  <h2>Wrapped Terminals — read everything</h2>
+  <p>Regular terminals are write-only from the outside. Wrapped terminals log every pty byte to disk. Claws reads it back with ANSI escapes stripped — giving you <strong>clean text of everything that happened</strong>, including interactive TUI sessions.</p>
+  <img class="img-full" src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/wrapped-terminal.png" alt="Wrapped Terminal Data Flow">
+  <p>The terminal looks and behaves identically to a regular one. The <code>script(1)</code> layer is invisible. Create one from the dropdown: <strong>Claws Wrapped Terminal</strong>.</p>
+</section>
+<!-- Capabilities Carousel -->
+<section class="alt" id="features">
+  <div class="inner reveal">
+    <div class="section-label" style="text-align:center;">Capabilities</div>
+    <h2 style="text-align:center;">Everything you can do</h2>
+    <p style="text-align:center; max-width:600px; margin:0 auto 32px;">Each capability is a building block. Compose them to orchestrate any terminal workflow — from a single command to a fleet of autonomous AI workers.</p>
+    <div class="carousel" id="capCarousel" style="border:none; box-shadow:none; background:transparent;">
+      <div class="carousel-track" id="capTrack">
+        <!-- Slide 1 -->
+        <div style="min-width:100%; padding:0 24px;">
+          <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/cap-terminal-mgmt.png" alt="Terminal Management" style="width:100%; border-radius:12px; border:1px solid var(--border); box-shadow: 0 8px 40px rgba(0,0,0,0.5);">
+          <div style="text-align:center; margin-top:20px;">
+            <h3 style="margin-top:0; font-size:24px;">Terminal Management</h3>
+            <p style="max-width:500px; margin:8px auto 0;">List every terminal with PID, name, and status. Create new ones with custom names and working directories. Focus, show, or close any terminal programmatically. Stable numeric IDs that persist for the session.</p>
+          </div>
+        </div>
+        <!-- Slide 2 -->
+        <div style="min-width:100%; padding:0 24px;">
+          <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/cap-pty-capture.png" alt="Full Pty Capture" style="width:100%; border-radius:12px; border:1px solid var(--border); box-shadow: 0 8px 40px rgba(0,0,0,0.5);">
+          <div style="text-align:center; margin-top:20px;">
+            <h3 style="margin-top:0; font-size:24px;">Full Pty Capture</h3>
+            <p style="max-width:500px; margin:8px auto 0;">Wrapped terminals log every pty byte via <code>script(1)</code>. Read back Claude Code conversations, vim sessions, build logs, REPL outputs — all as clean ANSI-stripped text. The terminal looks and feels completely normal.</p>
+          </div>
+        </div>
+        <!-- Slide 3 -->
+        <div style="min-width:100%; padding:0 24px;">
+          <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/cap-exec.png" alt="Command Execution" style="width:100%; border-radius:12px; border:1px solid var(--border); box-shadow: 0 8px 40px rgba(0,0,0,0.5);">
+          <div style="text-align:center; margin-top:20px;">
+            <h3 style="margin-top:0; font-size:24px;">Command Execution</h3>
+            <p style="max-width:500px; margin:8px auto 0;">Run commands and get structured results: stdout, stderr, and exit code. File-based capture that works in every terminal type — no shell integration dependency. Configurable timeouts for long-running processes.</p>
+          </div>
+        </div>
+        <!-- Slide 4 -->
+        <div style="min-width:100%; padding:0 24px;">
+          <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/cap-safety.png" alt="Safety Gate" style="width:100%; border-radius:12px; border:1px solid var(--border); box-shadow: 0 8px 40px rgba(0,0,0,0.5);">
+          <div style="text-align:center; margin-top:20px;">
+            <h3 style="margin-top:0; font-size:24px;">Safety Gate</h3>
+            <p style="max-width:500px; margin:8px auto 0;">Detects when a terminal is running a TUI (vim, claude, less, htop). Warns before sending text that would land as TUI input instead of a shell command. Non-blocking by default. Strict mode available for hard-block.</p>
+          </div>
+        </div>
+        <!-- Slide 5 -->
+        <div style="min-width:100%; padding:0 24px;">
+          <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/cap-mcp.png" alt="MCP Server" style="width:100%; border-radius:12px; border:1px solid var(--border); box-shadow: 0 8px 40px rgba(0,0,0,0.5);">
+          <div style="text-align:center; margin-top:20px;">
+            <h3 style="margin-top:0; font-size:24px;">MCP Server — Native AI Integration</h3>
+            <p style="max-width:500px; margin:8px auto 0;">Register one JSON block in any project's settings. Claude Code instantly gets 8 terminal control tools as native MCP calls. No imports, no client library, no socket code. Your AI gets terminal superpowers in one line.</p>
+          </div>
+        </div>
+        <!-- Slide 6 -->
+        <div style="min-width:100%; padding:0 24px;">
+          <img src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/cap-crossdevice.png" alt="Cross-Device Control" style="width:100%; border-radius:12px; border:1px solid var(--border); box-shadow: 0 8px 40px rgba(0,0,0,0.5);">
+          <div style="text-align:center; margin-top:20px;">
+            <h3 style="margin-top:0; font-size:24px;">Cross-Device Control</h3>
+            <p style="max-width:500px; margin:8px auto 0;">Control terminals on remote machines via WebSocket with token auth + TLS. Team configuration with per-device access control. SSH tunnel pattern works today. WebSocket transport coming in v0.3.</p>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="carousel-dots" id="capDots"></div>
+  </div>
+</section>
+<!-- Protocol -->
+<section>
+  <div class="section-label">Protocol</div>
+  <h2>Simple JSON over Unix socket</h2>
+  <p>Newline-delimited JSON. Every request has an <code>id</code> for correlation. Works with any language that can open a socket.</p>
+  <table>
+    <thead>
+      <tr><th>Command</th><th>Input</th><th>Output</th></tr>
+    </thead>
+    <tbody>
+      <tr><td><code>list</code></td><td><code>{}</code></td><td>All terminals with PID, name, log path</td></tr>
+      <tr><td><code>create</code></td><td><code>{name, wrapped?}</code></td><td>Terminal ID + log path</td></tr>
+      <tr><td><code>send</code></td><td><code>{id, text}</code></td><td>Delivered to terminal input</td></tr>
+      <tr><td><code>exec</code></td><td><code>{id, command}</code></td><td>stdout + stderr + exit code</td></tr>
+      <tr><td><code>readLog</code></td><td><code>{id}</code></td><td>Clean text from pty log</td></tr>
+      <tr><td><code>poll</code></td><td><code>{since?}</code></td><td>Command-completion events</td></tr>
+      <tr><td><code>close</code></td><td><code>{id}</code></td><td>Terminal disposed</td></tr>
+    </tbody>
+  </table>
+  <img class="img-full" src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/protocol-flow.png" alt="Protocol Request/Response Flow">
+  <p><a href="https://github.com/neunaha/claws/blob/main/docs/protocol.md">Full protocol specification &rarr;</a></p>
+</section>
+<!-- AI Orchestration -->
+<section class="alt">
+  <div class="inner">
+    <div class="section-label">AI Pair Programming</div>
+    <h2>Built for autonomous agent orchestration</h2>
+    <p>Claws was designed for a specific use case: <strong>one AI session controlling multiple terminal sessions in parallel</strong>. Spawn workers, send mission prompts, monitor progress via pty log tailing, react to errors in real time, clean up when done.</p>
+    <img class="img-full" src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/ai-orchestration.png" alt="AI Orchestration Pattern">
+<pre># Spawn 3 parallel workers
+workers = {}
+for name, cmd in [("lint", "npm run lint"), ("test", "npm test"), ("build", "npm run build")]:
+    term = client.create(f"worker-{name}", wrapped=True)
+    client.send(term.id, cmd)
+    workers[name] = term
+# Monitor all workers
+import time
+time.sleep(10)
+for name, term in workers.items():
+    log = client.read_log(term.id, lines=20)
+    print(f"=== {name} ===\n{log}")
+    client.close(term.id)</pre>
+  </div>
+</section>
+<!-- Best Practices -->
+<section id="best-practices">
+  <div class="section-label">Best Practices</div>
+  <h2>Getting the most out of Claws</h2>
+  <div class="bp-grid">
+    <div class="bp-card">
+      <h4>Always use wrapped terminals for AI workers</h4>
+      <p>Without wrapping, you can send but can't read. Every autonomous worker should be <code>wrapped: true</code> so you can observe its state.</p>
+    </div>
+    <div class="bp-card">
+      <h4>Use stable IDs, not names</h4>
+      <p>Terminal names can be duplicated or changed. The numeric ID from <code>create</code> is unique and stable for the terminal's lifetime.</p>
+    </div>
+    <div class="bp-card">
+      <h4>Clean up terminals when done</h4>
+      <p>Every <code>create</code> should have a matching <code>close</code>. Stale terminals clutter the panel and leak pty log disk space.</p>
+    </div>
+    <div class="bp-card">
+      <h4>Use exec for shell commands, send for TUI input</h4>
+      <p><code>exec</code> captures output and waits. <code>send</code> is fire-and-forget. Use the right tool for the job.</p>
+    </div>
+    <div class="bp-card">
+      <h4>Add .claws/ to .gitignore</h4>
+      <p>Pty logs can contain passwords, tokens, and secrets. Never commit them. The default <code>.gitignore</code> already excludes <code>.claws/</code>.</p>
+    </div>
+    <div class="bp-card">
+      <h4>Monitor with tail + grep, not polling</h4>
+      <p>For real-time observation, <code>tail -F logfile | grep --line-buffered pattern</code> is more responsive than periodic <code>readLog</code> calls.</p>
+    </div>
+    <div class="bp-card dont">
+      <h4>Don't use script -F with TUI sessions</h4>
+      <p>The <code>-F</code> flush flag splits Ink-based TUI frames and causes visual corruption in Claude Code. Default buffering is correct.</p>
+    </div>
+    <div class="bp-card dont">
+      <h4>Don't send into terminals you can't observe</h4>
+      <p>If you don't know what's running in a terminal (shell vs TUI), check with <code>list</code> first. Blind sends into unknown TUIs corrupt their input state.</p>
+    </div>
+  </div>
+</section>
+<!-- Case Studies -->
+<section class="alt" id="case-studies">
+  <div class="inner">
+    <div class="section-label">Case Studies</div>
+    <h2>Real-world usage patterns</h2>
+    <div class="case-study">
+      <div class="label">Case Study 1</div>
+      <h3>AI Pair Programming — Parallel Codebase Audit</h3>
+      <p>An orchestrator spawned 3 wrapped terminals simultaneously, each running an independent analysis task (latency profiling, token auditing, critical-path optimization). Each worker received a scoped mission prompt via <code>send</code>, ran autonomously for ~5 minutes, and wrote its findings to a designated output file. The orchestrator monitored all 3 via <code>tail -F</code> on their pty logs, reacting to events as they arrived. Total: 3 audit reports (140 + 265 + 420 lines) produced in parallel in ~6 minutes.</p>
+    </div>
+    <div class="case-study">
+      <div class="label">Case Study 2</div>
+      <h3>Multi-Commit Implementation Fleet</h3>
+      <p>A single worker terminal received a mission to ship 6 atomic git commits implementing pipeline optimizations. The worker read prior analysis files, edited runbooks and Python code, ran verification after each commit, and produced 6 clean commits in 6 minutes 42 seconds — 393 insertions across committee.py, 4 runbook YAMLs, and a cost-log hook. The orchestrator monitored via pty log events and narrated each commit as it landed.</p>
+    </div>
+    <div class="case-study">
+      <div class="label">Case Study 3</div>
+      <h3>Full Infographic Pipeline Test</h3>
+      <p>The orchestrator created a wrapped terminal, launched Claude Code inside it, and fired a <code>/infographic-new</code> command — triggering a 10-tier content generation pipeline. The orchestrator monitored tier-by-tier progress via background polling tasks, inspected intermediate artifacts (research JSON, angle selection, design brief, jury verdicts), and read the final committee verdict + 30/30 visual critic score. Total pipeline time: 25 minutes. Result: a production-ready infographic with committee composite score 8.56.</p>
+    </div>
+    <div class="case-study">
+      <div class="label">Case Study 4</div>
+      <h3>Graphify-Driven Code Optimization</h3>
+      <p>A worker terminal was directed to use a knowledge graph (graphify) as its primary reasoning surface to identify pipeline bottlenecks. The worker ran graph queries to surface god nodes, cross-file dependencies, and prior audit findings — producing a 100-line optimization plan that identified $30/run savings from CLAUDE.md trimming, $5.69/run from committee-chair fusion, and a $165 cache-read tax that no top-down code review would have surfaced. The graph-derived insights validated 2 of the 5 optimization proposals independently.</p>
+    </div>
+  </div>
+</section>
+<!-- Cross-Device -->
+<section>
+  <div class="section-label">Coming Soon</div>
+  <h2>Cross-device terminal control</h2>
+  <p>Control terminals on remote machines via WebSocket. Token-based auth + TLS. Discover other Claws instances on your LAN automatically.</p>
+  <img class="img-full" src="https://raw.githubusercontent.com/neunaha/claws/main/docs/images/cross-device.png" alt="Cross-Device Architecture">
+  <p><strong>Available today via SSH tunnel:</strong></p>
+<pre>ssh -L /tmp/remote-claws.sock:/remote/workspace/.claws/claws.sock user@remote
+# Then connect locally via raw socket or MCP
+echo '{"id":1,"cmd":"list"}' | nc -U /tmp/remote-claws.sock</pre>
+</section>
+<!-- MCP Server -->
+<section class="alt">
+  <div class="inner">
+    <div class="section-label">Instant Integration</div>
+    <h2>MCP Server — Claude Code gets terminal control natively</h2>
+    <p>Register Claws as an MCP server in any project. <strong>Every Claude Code session instantly gets 8 terminal control tools</strong> — no client library, no imports, no socket code. Just register and go.</p>
+<pre>// .claude/settings.json (add to ANY project)
+{
+  "mcpServers": {
+    "claws": {
+      "command": "node",
+      "args": ["/path/to/claws/mcp_server.js"],
+      "env": { "CLAWS_SOCKET": ".claws/claws.sock" }
+    }
+  }
+}</pre>
+    <p>Tools injected: <code>claws_list</code> <code>claws_create</code> <code>claws_send</code> <code>claws_exec</code> <code>claws_read_log</code> <code>claws_poll</code> <code>claws_close</code> <code>claws_worker</code></p>
+    <p>Zero dependencies. Pure Node.js. Works on macOS and Linux. Your AI writes code in one terminal, tests in another, deploys in a third — all through native MCP tool calls.</p>
+  </div>
+</section>
+<!-- Documentation Hub -->
+<section id="docs">
+  <div class="section-label">Documentation</div>
+  <h2>Everything you need to master Claws</h2>
+  <div class="features">
+    <div class="feature-card">
+      <div class="icon">&#128218;</div>
+      <h3><a href="https://github.com/neunaha/claws/blob/main/docs/guide.md">The Complete Guide</a></h3>
+      <p>12-chapter course from first install to production fleet orchestration. Every feature, pattern, and edge case. 830 lines of detailed walkthroughs.</p>
+    </div>
+    <div class="feature-card">
+      <div class="icon">&#128295;</div>
+      <h3><a href="https://github.com/neunaha/claws/blob/main/docs/features.md">Feature Reference</a></h3>
+      <p>Every command, parameter, response field, and edge case. The API reference for builders integrating Claws.</p>
+    </div>
+    <div class="feature-card">
+      <div class="icon">&#128225;</div>
+      <h3><a href="https://github.com/neunaha/claws/blob/main/docs/protocol.md">Protocol Spec</a></h3>
+      <p>Full JSON socket protocol — 8 commands, request/response schemas, error codes, interactive session transcript.</p>
+    </div>
+    <div class="feature-card">
+      <div class="icon">&#128161;</div>
+      <h3><a href="https://github.com/neunaha/claws/blob/main/.claude/skills/prompt-templates/SKILL.md">Prompt Templates</a></h3>
+      <p>7 battle-tested mission prompt templates for AI orchestration: workers, fleets, pair programming, debugging.</p>
+    </div>
+    <div class="feature-card">
+      <div class="icon">&#128640;</div>
+      <h3><a href="https://github.com/neunaha/claws/blob/main/CONTRIBUTING.md">Contributing</a></h3>
+      <p>Dev setup, workflow, code style, protocol change process. High-priority: TypeScript rewrite, Windows support, Node client.</p>
+    </div>
+    <div class="feature-card">
+      <div class="icon">&#128272;</div>
+      <h3><a href="https://github.com/neunaha/claws/blob/main/SECURITY.md">Security</a></h3>
+      <p>Socket permissions, pty log sensitivity, trust model, planned WebSocket auth. Read before shared deployments.</p>
+    </div>
+  </div>
+</section>
+<!-- CTA -->
+<section class="alt">
+  <div class="inner" style="text-align: center; padding: 60px 24px;">
+    <h2>Your AI deserves better than copy-paste.</h2>
+    <p style="max-width: 600px; margin: 0 auto 24px; color: var(--text-muted);">Stop manually running commands your AI asks you to run. Stop pasting output back into chat. Give your AI direct terminal control — it reads, writes, monitors, and reacts on its own.</p>
+    <div style="display: flex; gap: 12px; justify-content: center; flex-wrap: wrap;">
+      <a href="https://github.com/neunaha/claws#install" class="btn btn-primary">Install Claws — 30 seconds</a>
+      <a href="https://github.com/neunaha/claws" class="btn btn-ghost">Star on GitHub</a>
+      <a href="https://github.com/neunaha/claws/blob/main/docs/guide.md" class="btn btn-ghost">Read the Guide</a>
+    </div>
+  </div>
+</section>
+<footer>
+  <p>Claws is open-source under the <a href="https://github.com/neunaha/claws/blob/main/LICENSE">MIT License</a>.</p>
+  <p style="margin-top: 8px;">Built by <a href="https://github.com/neunaha">Anish Neunaha</a> &middot; <a href="https://github.com/neunaha/claws">GitHub</a> &middot; <a href="https://github.com/neunaha/claws/blob/main/CONTRIBUTING.md">Contribute</a></p>
+</footer>
+<script>
+// Carousel
+(function() {
+  const track = document.getElementById('archTrack');
+  const dotsContainer = document.getElementById('archDots');
+  if (!track || !dotsContainer) return;
+  const imgs = track.querySelectorAll('img');
+  const n = imgs.length;
+  let current = 0;
+  // Create dots
+  for (let i = 0; i < n; i++) {
+    const dot = document.createElement('button');
+    dot.className = 'carousel-dot' + (i === 0 ? ' active' : '');
+    dot.onclick = () => goTo(i);
+    dotsContainer.appendChild(dot);
+  }
+  function goTo(idx) {
+    current = idx;
+    track.style.transform = `translateX(-${idx * 100}%)`;
+    dotsContainer.querySelectorAll('.carousel-dot').forEach((d, i) => {
+      d.className = 'carousel-dot' + (i === idx ? ' active' : '');
+    });
+  }
+  // Auto-advance every 4s
+  setInterval(() => goTo((current + 1) % n), 4000);
+})();
+// Capabilities carousel
+(function() {
+  const track = document.getElementById('capTrack');
+  const dotsContainer = document.getElementById('capDots');
+  if (!track || !dotsContainer) return;
+  const slides = track.children;
+  const n = slides.length;
+  let current = 0;
+  for (let i = 0; i < n; i++) {
+    const dot = document.createElement('button');
+    dot.className = 'carousel-dot' + (i === 0 ? ' active' : '');
+    dot.onclick = () => goTo(i);
+    dotsContainer.appendChild(dot);
+  }
+  function goTo(idx) {
+    current = idx;
+    track.style.transform = `translateX(-${idx * 100}%)`;
+    dotsContainer.querySelectorAll('.carousel-dot').forEach((d, i) => {
+      d.className = 'carousel-dot' + (i === idx ? ' active' : '');
+    });
+  }
+  setInterval(() => goTo((current + 1) % n), 5000);
+})();
+// Scroll reveal
+(function() {
+  const els = document.querySelectorAll('.reveal');
+  const observer = new IntersectionObserver((entries) => {
+    entries.forEach(e => { if (e.isIntersecting) e.target.classList.add('visible'); });
+  }, { threshold: 0.1 });
+  els.forEach(el => observer.observe(el));
+})();
+</script>
+</body>
+</html>