@rune-kit/rune 2.3.3 → 2.4.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.
- package/README.md +51 -1
- package/compiler/__tests__/scripts-bundling.test.js +284 -0
- package/compiler/__tests__/tier-override.test.js +41 -0
- package/compiler/adapters/antigravity.js +4 -0
- package/compiler/adapters/codex.js +4 -0
- package/compiler/adapters/cursor.js +4 -0
- package/compiler/adapters/generic.js +4 -0
- package/compiler/adapters/openclaw.js +4 -0
- package/compiler/adapters/opencode.js +4 -0
- package/compiler/adapters/windsurf.js +4 -0
- package/compiler/emitter.js +85 -5
- package/compiler/transforms/scripts-path.js +18 -0
- package/extensions/zalo/PACK.md +20 -1
- package/extensions/zalo/references/conversation-management.md +214 -0
- package/extensions/zalo/references/eval-scenarios.md +157 -0
- package/extensions/zalo/references/listen-mode.md +237 -0
- package/extensions/zalo/references/mcp-production.md +274 -0
- package/extensions/zalo/references/multi-account-proxy.md +224 -0
- package/extensions/zalo/references/vietqr-banking.md +160 -0
- package/package.json +2 -3
- package/skills/marketing/SKILL.md +3 -0
- package/skills/sentinel/SKILL.md +4 -1
- package/skills/sentinel/references/auth-crypto-reference.md +192 -0
- package/skills/sentinel/references/desktop-security.md +201 -0
- package/skills/sentinel/references/supply-chain.md +160 -0
- package/skills/slides/SKILL.md +142 -0
- package/skills/slides/scripts/build-deck.js +158 -0
- package/docs/ANTIGRAVITY-GAP-ANALYSIS.md +0 -369
- package/docs/ARCHITECTURE.md +0 -332
- package/docs/COMMUNITY-PACKS.md +0 -109
- package/docs/CONTRIBUTING-L4.md +0 -215
- package/docs/CROSS-IDE-ANALYSIS.md +0 -164
- package/docs/EXTENSION-TEMPLATE.md +0 -126
- package/docs/MESH-RULES.md +0 -34
- package/docs/MULTI-PLATFORM.md +0 -804
- package/docs/SKILL-DEPTH-AUDIT.md +0 -191
- package/docs/SKILL-TEMPLATE.md +0 -118
- package/docs/TRADE-MATRIX.md +0 -327
- package/docs/VERSIONING.md +0 -91
- package/docs/VISION.md +0 -263
- package/docs/assets/demo-subtitles.srt +0 -215
- package/docs/assets/end-card.html +0 -276
- package/docs/assets/mesh-diagram.html +0 -654
- package/docs/assets/thumbnail.html +0 -295
- package/docs/guides/cli.md +0 -403
- package/docs/guides/index.html +0 -1450
- package/docs/index.html +0 -1005
- package/docs/references/claudekit-analysis.md +0 -414
- package/docs/references/voltagent-analysis.md +0 -189
- package/docs/script.js +0 -495
- package/docs/skills/index.html +0 -832
- package/docs/style.css +0 -958
- package/docs/video-demo-plan.md +0 -172
package/docs/index.html
DELETED
|
@@ -1,1005 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="en">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8">
|
|
5
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
-
<title>Rune — Less skills. Deeper connections.</title>
|
|
7
|
-
<meta name="description" content="59-skill mesh ecosystem for AI coding assistants. Works on Claude Code, Cursor, Windsurf, and any AI IDE.">
|
|
8
|
-
<meta property="og:title" content="Rune — AI Skill Mesh">
|
|
9
|
-
<meta property="og:description" content="59 skills, 200+ mesh connections, 8 platforms. From idea to production.">
|
|
10
|
-
<meta property="og:image" content="https://raw.githubusercontent.com/rune-kit/rune/master/assets/banner.svg">
|
|
11
|
-
<meta property="og:type" content="website">
|
|
12
|
-
<meta property="og:url" content="https://rune-kit.github.io/rune">
|
|
13
|
-
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
14
|
-
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
15
|
-
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;700&display=swap" rel="stylesheet">
|
|
16
|
-
<link rel="stylesheet" href="style.css">
|
|
17
|
-
</head>
|
|
18
|
-
<body>
|
|
19
|
-
<!-- NAV -->
|
|
20
|
-
<nav class="nav">
|
|
21
|
-
<div class="nav-inner">
|
|
22
|
-
<a href="#" class="nav-logo">
|
|
23
|
-
<span class="logo-rune">◆</span> Rune
|
|
24
|
-
</a>
|
|
25
|
-
<div class="nav-links">
|
|
26
|
-
<a href="#architecture">Architecture</a>
|
|
27
|
-
<a href="#workflows">Workflows</a>
|
|
28
|
-
<a href="guides/">Guides</a>
|
|
29
|
-
<a href="#mesh">Mesh</a>
|
|
30
|
-
<a href="#pricing">Pricing</a>
|
|
31
|
-
<div class="nav-controls notranslate" translate="no">
|
|
32
|
-
<button class="theme-toggle" id="theme-toggle" aria-label="Toggle light/dark mode" title="Toggle theme">☾</button>
|
|
33
|
-
<div class="lang-dropdown" id="lang-dropdown">
|
|
34
|
-
<button class="lang-toggle" id="lang-btn" aria-label="Translate page" title="Translate page">
|
|
35
|
-
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M2 12h20"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10A15.3 15.3 0 0 1 12 2z"/></svg>
|
|
36
|
-
</button>
|
|
37
|
-
<div class="lang-menu notranslate" id="lang-menu" translate="no" hidden>
|
|
38
|
-
<button data-lang="">English</button>
|
|
39
|
-
<button data-lang="vi">Tiếng Việt</button>
|
|
40
|
-
<button data-lang="ja">日本語</button>
|
|
41
|
-
<button data-lang="ko">한국어</button>
|
|
42
|
-
<button data-lang="zh-CN">中文(简)</button>
|
|
43
|
-
<button data-lang="zh-TW">中文(繁)</button>
|
|
44
|
-
<button data-lang="fr">Français</button>
|
|
45
|
-
<button data-lang="de">Deutsch</button>
|
|
46
|
-
<button data-lang="es">Español</button>
|
|
47
|
-
<button data-lang="pt">Português</button>
|
|
48
|
-
<button data-lang="ru">Русский</button>
|
|
49
|
-
<button data-lang="th">ไทย</button>
|
|
50
|
-
<button data-lang="id">Bahasa</button>
|
|
51
|
-
</div>
|
|
52
|
-
</div>
|
|
53
|
-
</div>
|
|
54
|
-
<a href="https://github.com/rune-kit/rune" class="btn btn-sm" target="_blank" rel="noopener">GitHub</a>
|
|
55
|
-
</div>
|
|
56
|
-
</div>
|
|
57
|
-
</nav>
|
|
58
|
-
|
|
59
|
-
<!-- HERO -->
|
|
60
|
-
<section class="hero">
|
|
61
|
-
<div class="hero-mesh" aria-hidden="true">
|
|
62
|
-
<canvas id="mesh-canvas"></canvas>
|
|
63
|
-
</div>
|
|
64
|
-
<div class="hero-content">
|
|
65
|
-
<p class="hero-badge">v2.3.3 — 59 skills • 8 platforms • MIT</p>
|
|
66
|
-
<h1>Less skills.<br><span class="accent">Deeper connections.</span></h1>
|
|
67
|
-
<p class="hero-sub">A mesh ecosystem for AI coding assistants. Skills call each other bidirectionally, forming resilient workflows that adapt when things go wrong.</p>
|
|
68
|
-
<div class="hero-actions">
|
|
69
|
-
<a href="#install" class="btn btn-primary">Get Started</a>
|
|
70
|
-
<a href="https://github.com/rune-kit/rune" class="btn btn-ghost" target="_blank" rel="noopener">View Source</a>
|
|
71
|
-
</div>
|
|
72
|
-
</div>
|
|
73
|
-
</section>
|
|
74
|
-
|
|
75
|
-
<!-- PROBLEM -->
|
|
76
|
-
<section class="section" id="problem">
|
|
77
|
-
<div class="container">
|
|
78
|
-
<h2>Why a Mesh?</h2>
|
|
79
|
-
<p class="section-sub">Most skill ecosystems are either too many isolated skills or rigid pipelines. Rune is neither.</p>
|
|
80
|
-
<div class="compare-grid">
|
|
81
|
-
<div class="compare-card compare-bad">
|
|
82
|
-
<h3>Pipeline</h3>
|
|
83
|
-
<pre class="compare-diagram">A → B → C → D
|
|
84
|
-
<span class="text-loss">✖ B fails = stuck</span></pre>
|
|
85
|
-
<p>Linear. If one step fails, everything stops.</p>
|
|
86
|
-
</div>
|
|
87
|
-
<div class="compare-card compare-bad">
|
|
88
|
-
<h3>Hub-Spoke</h3>
|
|
89
|
-
<pre class="compare-diagram">A → HUB → C
|
|
90
|
-
<span class="text-loss">✖ HUB fails = stuck</span></pre>
|
|
91
|
-
<p>Central bottleneck. Single point of failure.</p>
|
|
92
|
-
</div>
|
|
93
|
-
<div class="compare-card compare-good">
|
|
94
|
-
<h3>Mesh</h3>
|
|
95
|
-
<pre class="compare-diagram">A ↔ B ↔ C
|
|
96
|
-
↕ ↕
|
|
97
|
-
D ↔ E ↔ F
|
|
98
|
-
<span class="text-profit">✔ B fails = A→D→E→C</span></pre>
|
|
99
|
-
<p>Resilient. Skills route around failures automatically.</p>
|
|
100
|
-
</div>
|
|
101
|
-
</div>
|
|
102
|
-
</div>
|
|
103
|
-
</section>
|
|
104
|
-
|
|
105
|
-
<!-- ARCHITECTURE -->
|
|
106
|
-
<section class="section section-dark" id="architecture">
|
|
107
|
-
<div class="container">
|
|
108
|
-
<h2>5-Layer Architecture</h2>
|
|
109
|
-
<p class="section-sub">Each layer has a clear responsibility. Skills only call downward (with documented exceptions).</p>
|
|
110
|
-
<div class="layers">
|
|
111
|
-
<div class="layer layer-0">
|
|
112
|
-
<div class="layer-label">L0</div>
|
|
113
|
-
<div class="layer-content">
|
|
114
|
-
<strong>Router</strong>
|
|
115
|
-
<span class="layer-count">1 skill</span>
|
|
116
|
-
<p>Meta-enforcement. Routes every action to the correct skill.</p>
|
|
117
|
-
</div>
|
|
118
|
-
</div>
|
|
119
|
-
<div class="layer layer-1">
|
|
120
|
-
<div class="layer-label">L1</div>
|
|
121
|
-
<div class="layer-content">
|
|
122
|
-
<strong>Orchestrators</strong>
|
|
123
|
-
<span class="layer-count">5 skills</span>
|
|
124
|
-
<p>cook • team • launch • rescue • scaffold</p>
|
|
125
|
-
</div>
|
|
126
|
-
</div>
|
|
127
|
-
<div class="layer layer-2">
|
|
128
|
-
<div class="layer-label">L2</div>
|
|
129
|
-
<div class="layer-content">
|
|
130
|
-
<strong>Workflow Hubs</strong>
|
|
131
|
-
<span class="layer-count">27 skills</span>
|
|
132
|
-
<p>plan • debug • fix • test • review • sentinel • design • ba • docs • and 18 more</p>
|
|
133
|
-
</div>
|
|
134
|
-
</div>
|
|
135
|
-
<div class="layer layer-3">
|
|
136
|
-
<div class="layer-label">L3</div>
|
|
137
|
-
<div class="layer-content">
|
|
138
|
-
<strong>Utilities</strong>
|
|
139
|
-
<span class="layer-count">25 skills</span>
|
|
140
|
-
<p>research • problem-solver • verification • git • session-bridge • and 20 more</p>
|
|
141
|
-
</div>
|
|
142
|
-
</div>
|
|
143
|
-
<div class="layer layer-4">
|
|
144
|
-
<div class="layer-label">L4</div>
|
|
145
|
-
<div class="layer-content">
|
|
146
|
-
<strong>Extension Packs</strong>
|
|
147
|
-
<span class="layer-count">14 packs</span>
|
|
148
|
-
<p>Domain-specific: trading, SaaS, mobile, AI/ML, gamedev, Zalo, and 8 more</p>
|
|
149
|
-
</div>
|
|
150
|
-
</div>
|
|
151
|
-
</div>
|
|
152
|
-
</div>
|
|
153
|
-
</section>
|
|
154
|
-
|
|
155
|
-
<!-- WORKFLOWS -->
|
|
156
|
-
<section class="section" id="workflows">
|
|
157
|
-
<div class="container">
|
|
158
|
-
<h2>Key Workflows</h2>
|
|
159
|
-
<p class="section-sub">Orchestrators coordinate the mesh into end-to-end workflows.</p>
|
|
160
|
-
<div class="workflow-grid">
|
|
161
|
-
<div class="workflow-card">
|
|
162
|
-
<h3><code>/rune cook</code></h3>
|
|
163
|
-
<p class="workflow-desc">Build any feature with TDD discipline</p>
|
|
164
|
-
<div class="workflow-phases">
|
|
165
|
-
<div class="phase"><span class="phase-num">0</span> RESUME — detect existing plans</div>
|
|
166
|
-
<div class="phase"><span class="phase-num">1</span> UNDERSTAND — scout + ba</div>
|
|
167
|
-
<div class="phase"><span class="phase-num">2</span> PLAN — master plan + phase files</div>
|
|
168
|
-
<div class="phase"><span class="phase-num">3</span> TEST — failing tests first</div>
|
|
169
|
-
<div class="phase"><span class="phase-num">4</span> IMPLEMENT — write code</div>
|
|
170
|
-
<div class="phase"><span class="phase-num">5</span> QUALITY — preflight + sentinel + review</div>
|
|
171
|
-
<div class="phase"><span class="phase-num">6</span> VERIFY — verification + hallucination-guard</div>
|
|
172
|
-
<div class="phase"><span class="phase-num">7</span> COMMIT — semantic git commit</div>
|
|
173
|
-
</div>
|
|
174
|
-
</div>
|
|
175
|
-
<div class="workflow-card">
|
|
176
|
-
<h3><code>/rune rescue</code></h3>
|
|
177
|
-
<p class="workflow-desc">Refactor legacy code safely</p>
|
|
178
|
-
<div class="workflow-phases">
|
|
179
|
-
<div class="phase"><span class="phase-num">0</span> RECON — autopsy health score</div>
|
|
180
|
-
<div class="phase"><span class="phase-num">1</span> SAFETY NET — characterization tests</div>
|
|
181
|
-
<div class="phase"><span class="phase-num">2</span> SURGERY — 1 module per session</div>
|
|
182
|
-
<div class="phase"><span class="phase-num">3</span> CLEANUP — remove legacy markers</div>
|
|
183
|
-
<div class="phase"><span class="phase-num">4</span> VERIFY — before vs after score</div>
|
|
184
|
-
</div>
|
|
185
|
-
</div>
|
|
186
|
-
<div class="workflow-card">
|
|
187
|
-
<h3><code>/rune team</code></h3>
|
|
188
|
-
<p class="workflow-desc">Parallel multi-agent execution</p>
|
|
189
|
-
<div class="workflow-phases">
|
|
190
|
-
<div class="phase"><span class="phase-num">1</span> DECOMPOSE — DAG analysis</div>
|
|
191
|
-
<div class="phase"><span class="phase-num">2</span> ASSIGN — worktree per stream</div>
|
|
192
|
-
<div class="phase"><span class="phase-num">3</span> EXECUTE — parallel agents</div>
|
|
193
|
-
<div class="phase"><span class="phase-num">4</span> MERGE — conflict resolution</div>
|
|
194
|
-
<div class="phase"><span class="phase-num">5</span> VALIDATE — completion-gate</div>
|
|
195
|
-
</div>
|
|
196
|
-
</div>
|
|
197
|
-
</div>
|
|
198
|
-
</div>
|
|
199
|
-
</section>
|
|
200
|
-
|
|
201
|
-
<!-- FEATURES -->
|
|
202
|
-
<section class="section section-dark" id="features">
|
|
203
|
-
<div class="container">
|
|
204
|
-
<h2>Built Different</h2>
|
|
205
|
-
<div class="features-grid">
|
|
206
|
-
<div class="feature-card">
|
|
207
|
-
<div class="feature-icon">⚙</div>
|
|
208
|
-
<h3>Phase-Aware Execution</h3>
|
|
209
|
-
<p>Master plan + phase files. One phase per session. Any model executes accurately. Resumes across sessions automatically.</p>
|
|
210
|
-
</div>
|
|
211
|
-
<div class="feature-card">
|
|
212
|
-
<div class="feature-icon">⚠</div>
|
|
213
|
-
<h3>Cognitive Bias Detection</h3>
|
|
214
|
-
<p>12 biases checked before every analysis. Reversibility filter, pre-mortem, MECE decomposition. Structured reasoning, not gut feelings.</p>
|
|
215
|
-
</div>
|
|
216
|
-
<div class="feature-card">
|
|
217
|
-
<div class="feature-icon">★</div>
|
|
218
|
-
<h3>Cost Intelligence</h3>
|
|
219
|
-
<p>Every skill auto-selects the optimal model. Haiku for scanning, Sonnet for code, Opus for architecture. ~$0.05-0.15 per feature.</p>
|
|
220
|
-
</div>
|
|
221
|
-
<div class="feature-card">
|
|
222
|
-
<div class="feature-icon">♻</div>
|
|
223
|
-
<h3>Mesh Resilience</h3>
|
|
224
|
-
<p>200+ connections. If debug fails, problem-solver takes over. If scout fails, research + docs-seeker route around. Max depth 8, max 2 visits.</p>
|
|
225
|
-
</div>
|
|
226
|
-
<div class="feature-card">
|
|
227
|
-
<div class="feature-icon">🔒</div>
|
|
228
|
-
<h3>Security Gates</h3>
|
|
229
|
-
<p>sentinel (OWASP, secrets, deps) + sast (static analysis) + integrity-check (prompt injection detection). Gates, not suggestions.</p>
|
|
230
|
-
</div>
|
|
231
|
-
<div class="feature-card">
|
|
232
|
-
<div class="feature-icon">🌐</div>
|
|
233
|
-
<h3>Multi-Platform</h3>
|
|
234
|
-
<p>Same 59 skills compile to Claude Code, Cursor, Windsurf, Antigravity, OpenAI Codex, OpenClaw, and generic. Zero knowledge loss across IDEs.</p>
|
|
235
|
-
</div>
|
|
236
|
-
</div>
|
|
237
|
-
</div>
|
|
238
|
-
</section>
|
|
239
|
-
|
|
240
|
-
<!-- INSTALL -->
|
|
241
|
-
<section class="section" id="install">
|
|
242
|
-
<div class="container">
|
|
243
|
-
<h2>Get Started</h2>
|
|
244
|
-
<div class="install-grid">
|
|
245
|
-
<div class="install-card">
|
|
246
|
-
<h3>Claude Code</h3>
|
|
247
|
-
<p class="install-badge">Native Plugin</p>
|
|
248
|
-
<pre class="code-block"><code># Add marketplace (one-time)
|
|
249
|
-
claude plugin marketplace add rune-kit/rune
|
|
250
|
-
|
|
251
|
-
# Install plugin
|
|
252
|
-
claude plugin install rune</code></pre>
|
|
253
|
-
<p>Full mesh: subagents, hooks, adaptive routing, analytics.</p>
|
|
254
|
-
</div>
|
|
255
|
-
<div class="install-card">
|
|
256
|
-
<h3>Cursor / Windsurf / Any IDE</h3>
|
|
257
|
-
<p class="install-badge">Compiled Rules</p>
|
|
258
|
-
<pre class="code-block"><code>npx @rune-kit/rune init</code></pre>
|
|
259
|
-
<p>Auto-detects platform. Compiles all 59 skills to native rule format.</p>
|
|
260
|
-
</div>
|
|
261
|
-
<div class="install-card">
|
|
262
|
-
<h3>OpenClaw</h3>
|
|
263
|
-
<p class="install-badge">ClawHub Registry</p>
|
|
264
|
-
<pre class="code-block"><code>clawhub install rune-kit</code></pre>
|
|
265
|
-
<p>59 skills as unified mesh package. Works with any OpenClaw agent.</p>
|
|
266
|
-
</div>
|
|
267
|
-
</div>
|
|
268
|
-
</div>
|
|
269
|
-
</section>
|
|
270
|
-
|
|
271
|
-
<!-- GUIDES DIRECTORY -->
|
|
272
|
-
<section class="section section-dark" id="learn">
|
|
273
|
-
<div class="container">
|
|
274
|
-
<h2>Learn Rune</h2>
|
|
275
|
-
<p class="section-sub">From first install to advanced mesh orchestration — everything in one place.</p>
|
|
276
|
-
<div class="guide-grid">
|
|
277
|
-
<a href="guides/#install" class="guide-link">
|
|
278
|
-
<span class="guide-icon">⚡</span>
|
|
279
|
-
<div>
|
|
280
|
-
<strong>Quick Start</strong>
|
|
281
|
-
<span>Install + first run in 2 minutes</span>
|
|
282
|
-
</div>
|
|
283
|
-
</a>
|
|
284
|
-
<a href="guides/#mesh-architecture" class="guide-link">
|
|
285
|
-
<span class="guide-icon">◆</span>
|
|
286
|
-
<div>
|
|
287
|
-
<strong>Mesh Architecture</strong>
|
|
288
|
-
<span>How 200+ connections work</span>
|
|
289
|
-
</div>
|
|
290
|
-
</a>
|
|
291
|
-
<a href="guides/#wf-cook" class="guide-link">
|
|
292
|
-
<span class="guide-icon">⚙</span>
|
|
293
|
-
<div>
|
|
294
|
-
<strong>Workflows</strong>
|
|
295
|
-
<span>cook, rescue, team, debug</span>
|
|
296
|
-
</div>
|
|
297
|
-
</a>
|
|
298
|
-
<a href="guides/#ide-claude" class="guide-link">
|
|
299
|
-
<span class="guide-icon">💻</span>
|
|
300
|
-
<div>
|
|
301
|
-
<strong>Platform Guides</strong>
|
|
302
|
-
<span>Claude, Cursor, Windsurf, Codex, OpenClaw</span>
|
|
303
|
-
</div>
|
|
304
|
-
</a>
|
|
305
|
-
<a href="guides/#ext-using" class="guide-link">
|
|
306
|
-
<span class="guide-icon">📦</span>
|
|
307
|
-
<div>
|
|
308
|
-
<strong>Extension Packs</strong>
|
|
309
|
-
<span>14 domain packs + create your own</span>
|
|
310
|
-
</div>
|
|
311
|
-
</a>
|
|
312
|
-
<a href="guides/#faq" class="guide-link">
|
|
313
|
-
<span class="guide-icon">❓</span>
|
|
314
|
-
<div>
|
|
315
|
-
<strong>FAQ & Troubleshooting</strong>
|
|
316
|
-
<span>Common issues + answers</span>
|
|
317
|
-
</div>
|
|
318
|
-
</a>
|
|
319
|
-
</div>
|
|
320
|
-
<div style="text-align:center;margin-top:24px">
|
|
321
|
-
<a href="guides/" class="btn btn-ghost">View Full Guide →</a>
|
|
322
|
-
</div>
|
|
323
|
-
</div>
|
|
324
|
-
</section>
|
|
325
|
-
|
|
326
|
-
<!-- HOW THE MESH WORKS -->
|
|
327
|
-
<section class="section" id="mesh">
|
|
328
|
-
<div class="container">
|
|
329
|
-
<h2>How the Mesh Works</h2>
|
|
330
|
-
<p class="section-sub">Skills don't run in isolation. They call each other, forming resilient workflows that adapt when things go wrong.</p>
|
|
331
|
-
|
|
332
|
-
<!-- Mesh Diagram -->
|
|
333
|
-
<div class="mesh-diagram">
|
|
334
|
-
<div class="mesh-tier mesh-tier-free">
|
|
335
|
-
<div class="mesh-tier-header">
|
|
336
|
-
<span class="mesh-tier-badge mesh-badge-free">FREE</span>
|
|
337
|
-
<strong>Core Mesh</strong>
|
|
338
|
-
<span class="mesh-tier-stats">59 skills • 200+ connections</span>
|
|
339
|
-
</div>
|
|
340
|
-
<div class="mesh-layers">
|
|
341
|
-
<div class="mesh-layer">
|
|
342
|
-
<span class="mesh-layer-label">L0</span>
|
|
343
|
-
<div class="mesh-nodes">
|
|
344
|
-
<span class="mesh-node mesh-node-router" title="Routes every action to the right skill">skill-router</span>
|
|
345
|
-
</div>
|
|
346
|
-
</div>
|
|
347
|
-
<div class="mesh-layer">
|
|
348
|
-
<span class="mesh-layer-label">L1</span>
|
|
349
|
-
<div class="mesh-nodes">
|
|
350
|
-
<span class="mesh-node" title="Feature orchestrator — 70% of tasks flow through cook">cook</span>
|
|
351
|
-
<span class="mesh-node">team</span>
|
|
352
|
-
<span class="mesh-node">scaffold</span>
|
|
353
|
-
<span class="mesh-node">launch</span>
|
|
354
|
-
<span class="mesh-node">rescue</span>
|
|
355
|
-
</div>
|
|
356
|
-
</div>
|
|
357
|
-
<div class="mesh-layer">
|
|
358
|
-
<span class="mesh-layer-label">L2</span>
|
|
359
|
-
<div class="mesh-nodes">
|
|
360
|
-
<span class="mesh-node">plan</span>
|
|
361
|
-
<span class="mesh-node">ba</span>
|
|
362
|
-
<span class="mesh-node">debug</span>
|
|
363
|
-
<span class="mesh-node">fix</span>
|
|
364
|
-
<span class="mesh-node">test</span>
|
|
365
|
-
<span class="mesh-node">review</span>
|
|
366
|
-
<span class="mesh-node">sentinel</span>
|
|
367
|
-
<span class="mesh-node">deploy</span>
|
|
368
|
-
<span class="mesh-node mesh-node-more">+19 more</span>
|
|
369
|
-
</div>
|
|
370
|
-
</div>
|
|
371
|
-
<div class="mesh-layer">
|
|
372
|
-
<span class="mesh-layer-label">L3</span>
|
|
373
|
-
<div class="mesh-nodes">
|
|
374
|
-
<span class="mesh-node">scout</span>
|
|
375
|
-
<span class="mesh-node">research</span>
|
|
376
|
-
<span class="mesh-node">verification</span>
|
|
377
|
-
<span class="mesh-node">git</span>
|
|
378
|
-
<span class="mesh-node">docs</span>
|
|
379
|
-
<span class="mesh-node mesh-node-more">+20 more</span>
|
|
380
|
-
</div>
|
|
381
|
-
</div>
|
|
382
|
-
<div class="mesh-layer">
|
|
383
|
-
<span class="mesh-layer-label">L4</span>
|
|
384
|
-
<div class="mesh-nodes">
|
|
385
|
-
<span class="mesh-node">@rune/ui</span>
|
|
386
|
-
<span class="mesh-node">@rune/backend</span>
|
|
387
|
-
<span class="mesh-node">@rune/saas</span>
|
|
388
|
-
<span class="mesh-node">@rune/mobile</span>
|
|
389
|
-
<span class="mesh-node mesh-node-more">+10 packs</span>
|
|
390
|
-
</div>
|
|
391
|
-
</div>
|
|
392
|
-
</div>
|
|
393
|
-
<div class="mesh-flow-example">
|
|
394
|
-
<span class="mesh-flow-label">Example flow:</span>
|
|
395
|
-
<code class="mesh-flow">cook → plan → test <span class="mesh-flow-fail">✗</span> → debug → fix → test <span class="mesh-flow-pass">✓</span> → review → sentinel → git</code>
|
|
396
|
-
</div>
|
|
397
|
-
</div>
|
|
398
|
-
|
|
399
|
-
<!-- Connection arrows -->
|
|
400
|
-
<div class="mesh-arrows">
|
|
401
|
-
<div class="mesh-arrow-line"></div>
|
|
402
|
-
<div class="mesh-arrow-labels">
|
|
403
|
-
<span class="mesh-arrow-label">+57 new connections</span>
|
|
404
|
-
<span class="mesh-arrow-desc">Pro skills plug into cook, team, ba, sentinel, git, research</span>
|
|
405
|
-
</div>
|
|
406
|
-
</div>
|
|
407
|
-
|
|
408
|
-
<div class="mesh-tier mesh-tier-pro">
|
|
409
|
-
<div class="mesh-tier-header">
|
|
410
|
-
<span class="mesh-tier-badge mesh-badge-pro">PRO $49</span>
|
|
411
|
-
<strong>Department Skills</strong>
|
|
412
|
-
<span class="mesh-tier-stats">+25 skills • +57 connections into core</span>
|
|
413
|
-
</div>
|
|
414
|
-
<div class="mesh-nodes mesh-nodes-grid">
|
|
415
|
-
<div class="mesh-pack">
|
|
416
|
-
<strong>Product</strong>
|
|
417
|
-
<span>PRDs, roadmaps, KPIs, release comms</span>
|
|
418
|
-
</div>
|
|
419
|
-
<div class="mesh-pack">
|
|
420
|
-
<strong>Sales</strong>
|
|
421
|
-
<span>Pipeline, outreach, account research</span>
|
|
422
|
-
</div>
|
|
423
|
-
<div class="mesh-pack">
|
|
424
|
-
<strong>Data Science</strong>
|
|
425
|
-
<span>SQL exploration, dashboards, ML eval</span>
|
|
426
|
-
</div>
|
|
427
|
-
<div class="mesh-pack">
|
|
428
|
-
<strong>Support</strong>
|
|
429
|
-
<span>Ticket triage, KB, escalation</span>
|
|
430
|
-
</div>
|
|
431
|
-
</div>
|
|
432
|
-
<p class="mesh-tier-note">Pro packs register as <code>Called By ← cook</code> — activated by the same orchestrator as core skills. No configuration needed.</p>
|
|
433
|
-
</div>
|
|
434
|
-
|
|
435
|
-
<!-- Connection arrows -->
|
|
436
|
-
<div class="mesh-arrows">
|
|
437
|
-
<div class="mesh-arrow-line mesh-arrow-line-biz"></div>
|
|
438
|
-
<div class="mesh-arrow-labels">
|
|
439
|
-
<span class="mesh-arrow-label">+54 connections + 13 cross-tier</span>
|
|
440
|
-
<span class="mesh-arrow-desc">Business calls Pro data: finance uses sales pipeline, legal uses product specs</span>
|
|
441
|
-
</div>
|
|
442
|
-
</div>
|
|
443
|
-
|
|
444
|
-
<div class="mesh-tier mesh-tier-biz">
|
|
445
|
-
<div class="mesh-tier-header">
|
|
446
|
-
<span class="mesh-tier-badge mesh-badge-biz">BUSINESS $149</span>
|
|
447
|
-
<strong>Enterprise Skills</strong>
|
|
448
|
-
<span class="mesh-tier-stats">+26 skills • includes all Pro skills</span>
|
|
449
|
-
</div>
|
|
450
|
-
<div class="mesh-nodes mesh-nodes-grid">
|
|
451
|
-
<div class="mesh-pack">
|
|
452
|
-
<strong>Finance</strong>
|
|
453
|
-
<span>Budget from <em>sales pipeline</em> + <em>product roadmap</em></span>
|
|
454
|
-
</div>
|
|
455
|
-
<div class="mesh-pack">
|
|
456
|
-
<strong>Legal</strong>
|
|
457
|
-
<span>Compliance via <em>product specs</em> + <em>support KB</em></span>
|
|
458
|
-
</div>
|
|
459
|
-
<div class="mesh-pack">
|
|
460
|
-
<strong>HR</strong>
|
|
461
|
-
<span>Recruiting, onboarding, role design</span>
|
|
462
|
-
</div>
|
|
463
|
-
<div class="mesh-pack">
|
|
464
|
-
<strong>Enterprise Search</strong>
|
|
465
|
-
<span>Cross-department knowledge from <em>support KB</em> + <em>product docs</em></span>
|
|
466
|
-
</div>
|
|
467
|
-
</div>
|
|
468
|
-
<p class="mesh-tier-note">Business includes Pro because it depends on Pro data. Finance can’t forecast without sales pipeline. Legal can’t audit without product specs. That’s why they’re bundled.</p>
|
|
469
|
-
</div>
|
|
470
|
-
</div>
|
|
471
|
-
|
|
472
|
-
<!-- Key Points -->
|
|
473
|
-
<div class="mesh-points">
|
|
474
|
-
<div class="mesh-point">
|
|
475
|
-
<div class="mesh-point-icon">◆</div>
|
|
476
|
-
<h3>Free is complete</h3>
|
|
477
|
-
<p>The full development workflow — plan, build, test, review, deploy — runs entirely on Free. You never hit a paywall while coding.</p>
|
|
478
|
-
</div>
|
|
479
|
-
<div class="mesh-point">
|
|
480
|
-
<div class="mesh-point-icon">◾</div>
|
|
481
|
-
<h3>Pro extends, not replaces</h3>
|
|
482
|
-
<p>Pro skills plug into the existing mesh via <code>cook</code> and <code>team</code>. Same orchestrator, same quality gates, new department capabilities.</p>
|
|
483
|
-
</div>
|
|
484
|
-
<div class="mesh-point">
|
|
485
|
-
<div class="mesh-point-icon">◾</div>
|
|
486
|
-
<h3>Business needs Pro</h3>
|
|
487
|
-
<p>Finance pulls from sales pipeline. Legal checks product specs. Enterprise search indexes support KB. That’s 13 cross-tier connections — and why Business includes Pro.</p>
|
|
488
|
-
</div>
|
|
489
|
-
</div>
|
|
490
|
-
</div>
|
|
491
|
-
</section>
|
|
492
|
-
|
|
493
|
-
<!-- PRICING -->
|
|
494
|
-
<section class="section section-dark" id="pricing">
|
|
495
|
-
<div class="container">
|
|
496
|
-
<h2>Pick Your Pack</h2>
|
|
497
|
-
<p class="section-sub">The full development mesh is free forever. Pro and Business add department-specific skills for teams that ship products.</p>
|
|
498
|
-
|
|
499
|
-
<!-- Who needs what -->
|
|
500
|
-
<div class="pricing-personas">
|
|
501
|
-
<div class="persona-card">
|
|
502
|
-
<div class="persona-icon">✍</div>
|
|
503
|
-
<p><strong>Solo dev or open-source contributor?</strong> Free has everything you need. 58 core skills, 14 domain packs, all platforms.</p>
|
|
504
|
-
</div>
|
|
505
|
-
<div class="persona-card">
|
|
506
|
-
<div class="persona-icon">⚙</div>
|
|
507
|
-
<p><strong>Shipping a product with a team?</strong> Pro adds Product, Sales, Data Science, and Support workflows to your AI assistant.</p>
|
|
508
|
-
</div>
|
|
509
|
-
<div class="persona-card">
|
|
510
|
-
<div class="persona-icon">🏢</div>
|
|
511
|
-
<p><strong>Running a company?</strong> Business adds Finance, Legal, HR, and Enterprise Search on top of Pro.</p>
|
|
512
|
-
</div>
|
|
513
|
-
</div>
|
|
514
|
-
|
|
515
|
-
<div class="pricing-grid pricing-grid-3">
|
|
516
|
-
<!-- FREE -->
|
|
517
|
-
<div class="pricing-card pricing-free">
|
|
518
|
-
<div class="pricing-tier">
|
|
519
|
-
<span class="pricing-badge pricing-badge-free">MIT License</span>
|
|
520
|
-
<h3>Rune</h3>
|
|
521
|
-
<div class="pricing-price">Free<span class="pricing-forever"> forever</span></div>
|
|
522
|
-
</div>
|
|
523
|
-
<p class="pricing-desc">Everything you need to build, test, deploy, and maintain software.</p>
|
|
524
|
-
<p class="pricing-who">Best for: individual developers, open-source projects, learning AI-assisted coding.</p>
|
|
525
|
-
<ul class="pricing-features">
|
|
526
|
-
<li>58 core skills (L0–L3)</li>
|
|
527
|
-
<li>14 domain extension packs</li>
|
|
528
|
-
<li>200+ mesh connections</li>
|
|
529
|
-
<li>5-layer architecture</li>
|
|
530
|
-
<li>Multi-platform compiler (8 targets)</li>
|
|
531
|
-
<li>Phase-aware execution</li>
|
|
532
|
-
<li>Security gates (sentinel, sast)</li>
|
|
533
|
-
<li>Adaptive model routing</li>
|
|
534
|
-
<li>Session persistence</li>
|
|
535
|
-
<li>Context delegation (spawn-agent)</li>
|
|
536
|
-
<li>Community support</li>
|
|
537
|
-
</ul>
|
|
538
|
-
<a href="#install" class="btn btn-primary" style="width:100%">Get Started</a>
|
|
539
|
-
</div>
|
|
540
|
-
|
|
541
|
-
<!-- PRO -->
|
|
542
|
-
<div class="pricing-card pricing-pro">
|
|
543
|
-
<div class="pricing-tier">
|
|
544
|
-
<span class="pricing-badge pricing-badge-pro">Premium</span>
|
|
545
|
-
<h3>Rune Pro</h3>
|
|
546
|
-
<div class="pricing-price">$49<span class="pricing-period"> lifetime</span></div>
|
|
547
|
-
</div>
|
|
548
|
-
<p class="pricing-desc">Business department skills that turn your AI assistant into a cross-functional teammate.</p>
|
|
549
|
-
<p class="pricing-who">Best for: product teams, startups, SaaS companies shipping features to real users.</p>
|
|
550
|
-
<ul class="pricing-features">
|
|
551
|
-
<li><strong>Everything in Free, plus:</strong></li>
|
|
552
|
-
<li>Product Management — PRDs, roadmaps, KPI tracking, release comms</li>
|
|
553
|
-
<li>Sales Enablement — account research, outreach sequences, pipeline review</li>
|
|
554
|
-
<li>Data Science — exploration, advanced SQL, dashboards, ML eval</li>
|
|
555
|
-
<li>Customer Support — ticket triage, knowledge base, escalation</li>
|
|
556
|
-
<li>Business memory layer — stakeholders, glossary, processes</li>
|
|
557
|
-
<li>MCP connector templates — Slack, CRM, Linear, Notion</li>
|
|
558
|
-
<li>All future Pro packs included</li>
|
|
559
|
-
</ul>
|
|
560
|
-
<button class="btn btn-pro" style="width:100%" onclick="openPayment('rune-pro')">Get Rune Pro — $49</button>
|
|
561
|
-
<p class="pricing-note pricing-guarantee">💰 14-Day Money-Back Guarantee — no questions asked</p>
|
|
562
|
-
</div>
|
|
563
|
-
|
|
564
|
-
<!-- BUSINESS -->
|
|
565
|
-
<div class="pricing-card pricing-biz">
|
|
566
|
-
<div class="pricing-tier">
|
|
567
|
-
<span class="pricing-badge pricing-badge-best">★ BEST VALUE</span>
|
|
568
|
-
<h3>Rune Business</h3>
|
|
569
|
-
<div class="pricing-price">$149<span class="pricing-period"> lifetime</span></div>
|
|
570
|
-
</div>
|
|
571
|
-
<p class="pricing-desc">Full department coverage — every business function, one purchase.</p>
|
|
572
|
-
|
|
573
|
-
<!-- What's Included breakdown -->
|
|
574
|
-
<div class="includes-breakdown">
|
|
575
|
-
<p class="includes-label">What’s Included:</p>
|
|
576
|
-
<div class="includes-box includes-box-pro">
|
|
577
|
-
<strong>Rune Pro</strong> <span class="includes-value">$49 value</span>
|
|
578
|
-
<ul>
|
|
579
|
-
<li>Product Management, Sales, Data Science, Support</li>
|
|
580
|
-
<li>Business memory layer + MCP connectors</li>
|
|
581
|
-
</ul>
|
|
582
|
-
</div>
|
|
583
|
-
<div class="includes-box includes-box-biz">
|
|
584
|
-
<strong>Rune Business</strong> <span class="includes-value">$100 value</span>
|
|
585
|
-
<ul>
|
|
586
|
-
<li>Finance Ops, Legal & Compliance, HR & Recruiting</li>
|
|
587
|
-
<li>Enterprise Search + Priority support</li>
|
|
588
|
-
</ul>
|
|
589
|
-
</div>
|
|
590
|
-
</div>
|
|
591
|
-
|
|
592
|
-
<ul class="pricing-features">
|
|
593
|
-
<li>All future Pro + Business packs included</li>
|
|
594
|
-
<li>Lifetime access — no subscriptions ever</li>
|
|
595
|
-
</ul>
|
|
596
|
-
<button class="btn btn-biz" style="width:100%" onclick="openPayment('rune-biz')">Get Rune Business — $149</button>
|
|
597
|
-
<p class="pricing-note pricing-guarantee">💰 14-Day Money-Back Guarantee — no questions asked</p>
|
|
598
|
-
</div>
|
|
599
|
-
</div>
|
|
600
|
-
|
|
601
|
-
<!-- Comparison table -->
|
|
602
|
-
<div class="pricing-compare">
|
|
603
|
-
<h3>Feature Comparison</h3>
|
|
604
|
-
<table class="compare-table">
|
|
605
|
-
<thead>
|
|
606
|
-
<tr>
|
|
607
|
-
<th>Capability</th>
|
|
608
|
-
<th>Free</th>
|
|
609
|
-
<th>Pro <span class="table-price">$49</span></th>
|
|
610
|
-
<th>Business <span class="table-price">$149</span></th>
|
|
611
|
-
</tr>
|
|
612
|
-
</thead>
|
|
613
|
-
<tbody>
|
|
614
|
-
<tr>
|
|
615
|
-
<td>Core dev skills (58)</td>
|
|
616
|
-
<td class="check">✓</td>
|
|
617
|
-
<td class="check">✓</td>
|
|
618
|
-
<td class="check">✓</td>
|
|
619
|
-
</tr>
|
|
620
|
-
<tr>
|
|
621
|
-
<td>Domain packs (14)</td>
|
|
622
|
-
<td class="check">✓</td>
|
|
623
|
-
<td class="check">✓</td>
|
|
624
|
-
<td class="check">✓</td>
|
|
625
|
-
</tr>
|
|
626
|
-
<tr>
|
|
627
|
-
<td>Multi-platform compiler</td>
|
|
628
|
-
<td class="check">✓</td>
|
|
629
|
-
<td class="check">✓</td>
|
|
630
|
-
<td class="check">✓</td>
|
|
631
|
-
</tr>
|
|
632
|
-
<tr>
|
|
633
|
-
<td>Security gates & SAST</td>
|
|
634
|
-
<td class="check">✓</td>
|
|
635
|
-
<td class="check">✓</td>
|
|
636
|
-
<td class="check">✓</td>
|
|
637
|
-
</tr>
|
|
638
|
-
<tr>
|
|
639
|
-
<td>Product Management</td>
|
|
640
|
-
<td class="dash">—</td>
|
|
641
|
-
<td class="check">✓</td>
|
|
642
|
-
<td class="check">✓</td>
|
|
643
|
-
</tr>
|
|
644
|
-
<tr>
|
|
645
|
-
<td>Sales Enablement</td>
|
|
646
|
-
<td class="dash">—</td>
|
|
647
|
-
<td class="check">✓</td>
|
|
648
|
-
<td class="check">✓</td>
|
|
649
|
-
</tr>
|
|
650
|
-
<tr>
|
|
651
|
-
<td>Data Science</td>
|
|
652
|
-
<td class="dash">—</td>
|
|
653
|
-
<td class="check">✓</td>
|
|
654
|
-
<td class="check">✓</td>
|
|
655
|
-
</tr>
|
|
656
|
-
<tr>
|
|
657
|
-
<td>Customer Support</td>
|
|
658
|
-
<td class="dash">—</td>
|
|
659
|
-
<td class="check">✓</td>
|
|
660
|
-
<td class="check">✓</td>
|
|
661
|
-
</tr>
|
|
662
|
-
<tr>
|
|
663
|
-
<td>Business memory layer</td>
|
|
664
|
-
<td class="dash">—</td>
|
|
665
|
-
<td class="check">✓</td>
|
|
666
|
-
<td class="check">✓</td>
|
|
667
|
-
</tr>
|
|
668
|
-
<tr>
|
|
669
|
-
<td>MCP connector templates</td>
|
|
670
|
-
<td class="dash">—</td>
|
|
671
|
-
<td class="check">✓</td>
|
|
672
|
-
<td class="check">✓</td>
|
|
673
|
-
</tr>
|
|
674
|
-
<tr>
|
|
675
|
-
<td>Finance Ops</td>
|
|
676
|
-
<td class="dash">—</td>
|
|
677
|
-
<td class="dash">—</td>
|
|
678
|
-
<td class="check">✓</td>
|
|
679
|
-
</tr>
|
|
680
|
-
<tr>
|
|
681
|
-
<td>Legal & Compliance</td>
|
|
682
|
-
<td class="dash">—</td>
|
|
683
|
-
<td class="dash">—</td>
|
|
684
|
-
<td class="check">✓</td>
|
|
685
|
-
</tr>
|
|
686
|
-
<tr>
|
|
687
|
-
<td>HR & Recruiting</td>
|
|
688
|
-
<td class="dash">—</td>
|
|
689
|
-
<td class="dash">—</td>
|
|
690
|
-
<td class="check">✓</td>
|
|
691
|
-
</tr>
|
|
692
|
-
<tr>
|
|
693
|
-
<td>Enterprise Search</td>
|
|
694
|
-
<td class="dash">—</td>
|
|
695
|
-
<td class="dash">—</td>
|
|
696
|
-
<td class="check">✓</td>
|
|
697
|
-
</tr>
|
|
698
|
-
<tr>
|
|
699
|
-
<td>Skill Forge (build custom skills)</td>
|
|
700
|
-
<td class="check">✓</td>
|
|
701
|
-
<td class="check">✓</td>
|
|
702
|
-
<td class="check">✓</td>
|
|
703
|
-
</tr>
|
|
704
|
-
<tr>
|
|
705
|
-
<td>Priority support</td>
|
|
706
|
-
<td class="dash">—</td>
|
|
707
|
-
<td class="dash">—</td>
|
|
708
|
-
<td class="check">✓</td>
|
|
709
|
-
</tr>
|
|
710
|
-
</tbody>
|
|
711
|
-
</table>
|
|
712
|
-
</div>
|
|
713
|
-
</div>
|
|
714
|
-
</section>
|
|
715
|
-
|
|
716
|
-
<!-- EXTENSIONS -->
|
|
717
|
-
<section class="section" id="extensions">
|
|
718
|
-
<div class="container">
|
|
719
|
-
<h2>Free Extension Packs</h2>
|
|
720
|
-
<p class="section-sub">14 domain-specific packs included with Rune. Install what you need.</p>
|
|
721
|
-
<div class="ext-grid">
|
|
722
|
-
<div class="ext-card"><strong>@rune/ui</strong><span>Frontend</span></div>
|
|
723
|
-
<div class="ext-card"><strong>@rune/backend</strong><span>Backend</span></div>
|
|
724
|
-
<div class="ext-card"><strong>@rune/devops</strong><span>DevOps</span></div>
|
|
725
|
-
<div class="ext-card"><strong>@rune/mobile</strong><span>Mobile</span></div>
|
|
726
|
-
<div class="ext-card"><strong>@rune/security</strong><span>Security</span></div>
|
|
727
|
-
<div class="ext-card"><strong>@rune/trading</strong><span>Fintech</span></div>
|
|
728
|
-
<div class="ext-card"><strong>@rune/saas</strong><span>SaaS</span></div>
|
|
729
|
-
<div class="ext-card"><strong>@rune/ecommerce</strong><span>E-commerce</span></div>
|
|
730
|
-
<div class="ext-card"><strong>@rune/ai-ml</strong><span>AI/ML</span></div>
|
|
731
|
-
<div class="ext-card"><strong>@rune/gamedev</strong><span>Games</span></div>
|
|
732
|
-
<div class="ext-card"><strong>@rune/content</strong><span>Content</span></div>
|
|
733
|
-
<div class="ext-card"><strong>@rune/analytics</strong><span>Growth</span></div>
|
|
734
|
-
<div class="ext-card"><strong>@rune/chrome-ext</strong><span>Browser</span></div>
|
|
735
|
-
<div class="ext-card"><strong>@rune/zalo</strong><span>Messaging</span></div>
|
|
736
|
-
</div>
|
|
737
|
-
</div>
|
|
738
|
-
</section>
|
|
739
|
-
|
|
740
|
-
<!-- NUMBERS -->
|
|
741
|
-
<section class="section" id="numbers">
|
|
742
|
-
<div class="container">
|
|
743
|
-
<div class="stats-grid">
|
|
744
|
-
<div class="stat">
|
|
745
|
-
<span class="stat-num" data-target="58">0</span>
|
|
746
|
-
<span class="stat-label">Core Skills</span>
|
|
747
|
-
</div>
|
|
748
|
-
<div class="stat">
|
|
749
|
-
<span class="stat-num" data-target="206">0</span>
|
|
750
|
-
<span class="stat-label">Cross-References</span>
|
|
751
|
-
</div>
|
|
752
|
-
<div class="stat">
|
|
753
|
-
<span class="stat-num" data-target="14">0</span>
|
|
754
|
-
<span class="stat-label">Extension Packs</span>
|
|
755
|
-
</div>
|
|
756
|
-
<div class="stat">
|
|
757
|
-
<span class="stat-num" data-target="8">0</span>
|
|
758
|
-
<span class="stat-label">Platforms</span>
|
|
759
|
-
</div>
|
|
760
|
-
</div>
|
|
761
|
-
</div>
|
|
762
|
-
</section>
|
|
763
|
-
|
|
764
|
-
<!-- FOOTER -->
|
|
765
|
-
<footer class="footer">
|
|
766
|
-
<div class="container footer-inner">
|
|
767
|
-
<p><span class="logo-rune">◆</span> Rune — Less skills. Deeper connections.</p>
|
|
768
|
-
<div class="footer-links">
|
|
769
|
-
<a href="https://github.com/rune-kit/rune" target="_blank" rel="noopener">GitHub</a>
|
|
770
|
-
<a href="https://github.com/rune-kit/rune/blob/master/LICENSE" target="_blank" rel="noopener">MIT License</a>
|
|
771
|
-
<a href="https://github.com/rune-kit/rune/issues" target="_blank" rel="noopener">Issues</a>
|
|
772
|
-
</div>
|
|
773
|
-
</div>
|
|
774
|
-
</footer>
|
|
775
|
-
|
|
776
|
-
<!-- Payment Modal -->
|
|
777
|
-
<div id="pay-modal" class="pay-modal" hidden>
|
|
778
|
-
<div class="pay-backdrop" onclick="closePayment()"></div>
|
|
779
|
-
<div class="pay-dialog">
|
|
780
|
-
<!-- Step 1: Choose payment method -->
|
|
781
|
-
<div id="pay-step-1" class="pay-step">
|
|
782
|
-
<button class="pay-close" onclick="closePayment()" aria-label="Close">×</button>
|
|
783
|
-
<h3 id="pay-title">Get Rune Pro</h3>
|
|
784
|
-
<p class="pay-subtitle">Choose your payment method</p>
|
|
785
|
-
<div class="pay-options">
|
|
786
|
-
<button class="pay-option" onclick="showVNPayment()">
|
|
787
|
-
<img src="https://flagcdn.com/w40/vn.png" width="32" height="21" alt="VN" style="border-radius:3px" />
|
|
788
|
-
<div class="pay-option-info">
|
|
789
|
-
<strong>Vietnam</strong>
|
|
790
|
-
<span>Bank Transfer (VietQR)</span>
|
|
791
|
-
<span class="pay-option-price" id="pay-price-vn">1,190,000 VND</span>
|
|
792
|
-
</div>
|
|
793
|
-
<span class="pay-option-arrow">→</span>
|
|
794
|
-
</button>
|
|
795
|
-
<button class="pay-option" onclick="showIntlPayment()">
|
|
796
|
-
<span class="pay-option-flag">🌐</span>
|
|
797
|
-
<div class="pay-option-info">
|
|
798
|
-
<strong>International</strong>
|
|
799
|
-
<span>Card / PayPal (Polar)</span>
|
|
800
|
-
<span class="pay-option-price" id="pay-price-intl">$49 USD</span>
|
|
801
|
-
</div>
|
|
802
|
-
<span class="pay-option-arrow">→</span>
|
|
803
|
-
</button>
|
|
804
|
-
</div>
|
|
805
|
-
</div>
|
|
806
|
-
|
|
807
|
-
<!-- Step 2: VN — GitHub username -->
|
|
808
|
-
<div id="pay-step-2" class="pay-step" hidden>
|
|
809
|
-
<button class="pay-close" onclick="closePayment()" aria-label="Close">×</button>
|
|
810
|
-
<button class="pay-back" onclick="showPayStep(1)" aria-label="Back">← Back</button>
|
|
811
|
-
<h3 id="pay-title-2">Get Rune Pro</h3>
|
|
812
|
-
<p class="pay-subtitle" id="pay-amount-2">1,190,000 VND (~$49 USD)</p>
|
|
813
|
-
<label class="pay-label" for="pay-github">GitHub Username</label>
|
|
814
|
-
<input type="text" id="pay-github" class="pay-input" placeholder="your-github-username" autocomplete="off" spellcheck="false" />
|
|
815
|
-
<label class="pay-label" for="pay-email">Email <span style="color:var(--text-muted)">(optional)</span></label>
|
|
816
|
-
<input type="email" id="pay-email" class="pay-input" placeholder="you@example.com" />
|
|
817
|
-
<button id="pay-submit" class="btn btn-pro" style="width:100%;margin-top:16px" onclick="createOrder()">Continue to Payment</button>
|
|
818
|
-
<p class="pay-error" id="pay-error" hidden></p>
|
|
819
|
-
</div>
|
|
820
|
-
|
|
821
|
-
<!-- Step 3: VN — QR Code -->
|
|
822
|
-
<div id="pay-step-3" class="pay-step" hidden>
|
|
823
|
-
<button class="pay-close" onclick="closePayment()" aria-label="Close">×</button>
|
|
824
|
-
<h3>Scan to Pay</h3>
|
|
825
|
-
<p class="pay-subtitle">Transfer the exact amount with the code below</p>
|
|
826
|
-
<div class="pay-qr">
|
|
827
|
-
<img id="pay-qr-img" alt="VietQR Payment" />
|
|
828
|
-
</div>
|
|
829
|
-
<div class="pay-details">
|
|
830
|
-
<div class="pay-detail-row"><span>Bank</span><strong>TPBank</strong></div>
|
|
831
|
-
<div class="pay-detail-row"><span>Account</span><strong class="pay-mono">04162263666</strong></div>
|
|
832
|
-
<div class="pay-detail-row"><span>Amount</span><strong class="pay-mono" id="pay-detail-amount"></strong></div>
|
|
833
|
-
<div class="pay-detail-row"><span>Content</span><strong class="pay-mono" id="pay-detail-code"></strong></div>
|
|
834
|
-
</div>
|
|
835
|
-
<div class="pay-status" id="pay-status">
|
|
836
|
-
<span class="pay-spinner"></span> Waiting for payment...
|
|
837
|
-
</div>
|
|
838
|
-
<p class="pay-hint">Open your banking app → Scan QR or transfer manually → We'll detect it automatically</p>
|
|
839
|
-
</div>
|
|
840
|
-
|
|
841
|
-
<!-- Step 4: Success -->
|
|
842
|
-
<div id="pay-step-4" class="pay-step pay-success" hidden>
|
|
843
|
-
<div class="pay-success-badge">
|
|
844
|
-
<svg class="pay-success-check" viewBox="0 0 52 52" width="52" height="52">
|
|
845
|
-
<circle class="pay-success-circle" cx="26" cy="26" r="24" fill="none" stroke="currentColor" stroke-width="2.5"/>
|
|
846
|
-
<path class="pay-success-tick" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" d="M15 27l7 7 15-15"/>
|
|
847
|
-
</svg>
|
|
848
|
-
</div>
|
|
849
|
-
<h3 class="pay-success-title">You're in!</h3>
|
|
850
|
-
<p class="pay-success-sub">A GitHub repo invitation is on its way to <strong id="pay-success-user"></strong></p>
|
|
851
|
-
|
|
852
|
-
<div class="pay-success-steps">
|
|
853
|
-
<div class="pay-success-step">
|
|
854
|
-
<span class="pay-success-num">1</span>
|
|
855
|
-
<div>
|
|
856
|
-
<strong>Check your GitHub email</strong>
|
|
857
|
-
<span>Look for an invite from <code>noreply@github.com</code> — usually within 1 minute</span>
|
|
858
|
-
</div>
|
|
859
|
-
</div>
|
|
860
|
-
<div class="pay-success-step">
|
|
861
|
-
<span class="pay-success-num">2</span>
|
|
862
|
-
<div>
|
|
863
|
-
<strong>Accept the invitation</strong>
|
|
864
|
-
<span>Click "View invitation" to join the private repo</span>
|
|
865
|
-
</div>
|
|
866
|
-
</div>
|
|
867
|
-
<div class="pay-success-step">
|
|
868
|
-
<span class="pay-success-num">3</span>
|
|
869
|
-
<div>
|
|
870
|
-
<strong>Install your packs</strong>
|
|
871
|
-
<span id="pay-success-install">Follow the setup guide in the repo README</span>
|
|
872
|
-
</div>
|
|
873
|
-
</div>
|
|
874
|
-
</div>
|
|
875
|
-
|
|
876
|
-
<button class="btn btn-primary pay-success-done" onclick="closePayment()">Got it</button>
|
|
877
|
-
<p class="pay-success-help">Didn't get the invite? Check spam, or email <a href="mailto:claude@theio.vn">claude@theio.vn</a></p>
|
|
878
|
-
</div>
|
|
879
|
-
|
|
880
|
-
<!-- Step 5: International — GitHub username + Polar checkout -->
|
|
881
|
-
<div id="pay-step-5" class="pay-step" hidden>
|
|
882
|
-
<button class="pay-close" onclick="closePayment()" aria-label="Close">×</button>
|
|
883
|
-
<button class="pay-back" onclick="showPayStep(1)" aria-label="Back">← Back</button>
|
|
884
|
-
<h3 id="pay-title-5">Get Rune Pro</h3>
|
|
885
|
-
<p class="pay-subtitle" id="pay-amount-5">$49 USD</p>
|
|
886
|
-
<label class="pay-label" for="pay-intl-github">GitHub Username</label>
|
|
887
|
-
<input type="text" id="pay-intl-github" class="pay-input" placeholder="your-github-username" autocomplete="off" spellcheck="false" />
|
|
888
|
-
<label class="pay-label" for="pay-intl-email">Email <span style="color:var(--text-muted)">(for receipt)</span></label>
|
|
889
|
-
<input type="email" id="pay-intl-email" class="pay-input" placeholder="you@example.com" />
|
|
890
|
-
<p id="pay-intl-error" class="pay-error" hidden></p>
|
|
891
|
-
<button id="pay-intl-submit" class="btn btn-pro" style="width:100%;margin-top:16px" onclick="startPolarCheckout()">Pay with Card / PayPal</button>
|
|
892
|
-
<p class="pay-hint" style="margin-top:12px">You'll be redirected to Polar's secure checkout page</p>
|
|
893
|
-
</div>
|
|
894
|
-
|
|
895
|
-
<!-- Step 6: Success (Vietnamese — for SePay flow) -->
|
|
896
|
-
<div id="pay-step-6" class="pay-step pay-success notranslate" translate="no" hidden>
|
|
897
|
-
<div class="pay-success-badge">
|
|
898
|
-
<svg class="pay-success-check" viewBox="0 0 52 52" width="52" height="52">
|
|
899
|
-
<circle class="pay-success-circle" cx="26" cy="26" r="24" fill="none" stroke="currentColor" stroke-width="2.5"/>
|
|
900
|
-
<path class="pay-success-tick" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" d="M15 27l7 7 15-15"/>
|
|
901
|
-
</svg>
|
|
902
|
-
</div>
|
|
903
|
-
<h3 class="pay-success-title">Thanh toán thành công!</h3>
|
|
904
|
-
<p class="pay-success-sub">Lời mời truy cập repo đã được gửi đến <strong id="pay-success-user-vn"></strong></p>
|
|
905
|
-
|
|
906
|
-
<div class="pay-success-steps">
|
|
907
|
-
<div class="pay-success-step">
|
|
908
|
-
<span class="pay-success-num">1</span>
|
|
909
|
-
<div>
|
|
910
|
-
<strong>Kiểm tra email GitHub</strong>
|
|
911
|
-
<span>Tìm email mời từ <code>noreply@github.com</code> — thường trong vòng 1 phút</span>
|
|
912
|
-
</div>
|
|
913
|
-
</div>
|
|
914
|
-
<div class="pay-success-step">
|
|
915
|
-
<span class="pay-success-num">2</span>
|
|
916
|
-
<div>
|
|
917
|
-
<strong>Chấp nhận lời mời</strong>
|
|
918
|
-
<span>Nhấn "View invitation" để vào private repo</span>
|
|
919
|
-
</div>
|
|
920
|
-
</div>
|
|
921
|
-
<div class="pay-success-step">
|
|
922
|
-
<span class="pay-success-num">3</span>
|
|
923
|
-
<div>
|
|
924
|
-
<strong>Cài đặt skill packs</strong>
|
|
925
|
-
<span id="pay-success-install-vn">Làm theo hướng dẫn trong README của repo</span>
|
|
926
|
-
</div>
|
|
927
|
-
</div>
|
|
928
|
-
</div>
|
|
929
|
-
|
|
930
|
-
<button class="btn btn-primary pay-success-done" onclick="closePayment()">Xong</button>
|
|
931
|
-
<p class="pay-success-help">Chưa nhận được? Kiểm tra spam, hoặc email <a href="mailto:claude@theio.vn">claude@theio.vn</a></p>
|
|
932
|
-
</div>
|
|
933
|
-
</div>
|
|
934
|
-
</div>
|
|
935
|
-
|
|
936
|
-
<script src="script.js"></script>
|
|
937
|
-
|
|
938
|
-
<!-- Theme toggle -->
|
|
939
|
-
<script>
|
|
940
|
-
(function initTheme() {
|
|
941
|
-
const toggle = document.getElementById('theme-toggle');
|
|
942
|
-
const stored = localStorage.getItem('rune-theme');
|
|
943
|
-
const theme = stored || 'light'; // default light (warm cream)
|
|
944
|
-
|
|
945
|
-
if (theme === 'dark') {
|
|
946
|
-
document.documentElement.setAttribute('data-theme', 'dark');
|
|
947
|
-
toggle.innerHTML = '☾'; // moon
|
|
948
|
-
} else {
|
|
949
|
-
toggle.innerHTML = '☀'; // sun
|
|
950
|
-
}
|
|
951
|
-
|
|
952
|
-
toggle.addEventListener('click', () => {
|
|
953
|
-
const isDark = document.documentElement.getAttribute('data-theme') === 'dark';
|
|
954
|
-
if (isDark) {
|
|
955
|
-
document.documentElement.removeAttribute('data-theme');
|
|
956
|
-
toggle.innerHTML = '☀'; // sun
|
|
957
|
-
localStorage.setItem('rune-theme', 'light');
|
|
958
|
-
} else {
|
|
959
|
-
document.documentElement.setAttribute('data-theme', 'dark');
|
|
960
|
-
toggle.innerHTML = '☾'; // moon
|
|
961
|
-
localStorage.setItem('rune-theme', 'dark');
|
|
962
|
-
}
|
|
963
|
-
});
|
|
964
|
-
})();
|
|
965
|
-
</script>
|
|
966
|
-
|
|
967
|
-
<!-- Language Switcher (Google Translate via cookie) -->
|
|
968
|
-
<script>
|
|
969
|
-
(() => {
|
|
970
|
-
const btn = document.getElementById('lang-btn');
|
|
971
|
-
const menu = document.getElementById('lang-menu');
|
|
972
|
-
const wrap = document.getElementById('lang-dropdown');
|
|
973
|
-
|
|
974
|
-
btn.addEventListener('click', () => {
|
|
975
|
-
const open = !menu.hidden;
|
|
976
|
-
menu.hidden = open;
|
|
977
|
-
btn.setAttribute('aria-expanded', String(!open));
|
|
978
|
-
});
|
|
979
|
-
|
|
980
|
-
document.addEventListener('click', (e) => {
|
|
981
|
-
if (!wrap.contains(e.target)) menu.hidden = true;
|
|
982
|
-
});
|
|
983
|
-
|
|
984
|
-
menu.addEventListener('click', (e) => {
|
|
985
|
-
const lang = e.target.dataset.lang;
|
|
986
|
-
if (lang === undefined) return;
|
|
987
|
-
menu.hidden = true;
|
|
988
|
-
if (!lang) {
|
|
989
|
-
// Reset to English
|
|
990
|
-
document.cookie = 'googtrans=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/';
|
|
991
|
-
document.cookie = 'googtrans=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/; domain=.' + location.hostname;
|
|
992
|
-
location.reload();
|
|
993
|
-
return;
|
|
994
|
-
}
|
|
995
|
-
document.cookie = 'googtrans=/en/' + lang + '; path=/';
|
|
996
|
-
document.cookie = 'googtrans=/en/' + lang + '; path=/; domain=.' + location.hostname;
|
|
997
|
-
location.reload();
|
|
998
|
-
});
|
|
999
|
-
})();
|
|
1000
|
-
</script>
|
|
1001
|
-
<script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
|
|
1002
|
-
<script>function googleTranslateElementInit() { new google.translate.TranslateElement({ pageLanguage: 'en', autoDisplay: false }, '_gt_dummy'); }</script>
|
|
1003
|
-
<div id="_gt_dummy" style="display:none"></div>
|
|
1004
|
-
</body>
|
|
1005
|
-
</html>
|