PageSourceSearch

https://instoo.com/

html instoo.com collected 2026-09-29 11:34:25 UTC 134,118 bytes, 2,197 lines download raw bytes

1<!doctype html>
2<html lang="en">
3<head>
4  <meta charset="utf-8">
5  <!-- Meta Pixel Code -->
6  
6<script>
vendor: 435 bytes, lines 6-15
6
7    !function(f,b,e,v,n,t,s)
8    {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
9    n.callMethod.apply(n,arguments):n.queue.push(arguments)};
10    if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
11    n.queue=[];t=b.createElement(e);t.async=!0;
12    t.src=v;s=b.getElementsByTagName(e)[0];
13    s.parentNode.insertBefore(t,s)}(window, document,'script',
14    'https://connect.facebook.net/en_US/fbevents.js');
15    fbq('init', '
15107056183303487
vendor: 36 bytes, lines 15-17
15');
16    fbq('track', 'PageView');
17  
17</script>
17
18  <!-- End Meta Pixel Code -->
19  <meta name="viewport" content="width=device-width, initial-scale=1">
20  <meta name="theme-color" content="#ffffff">
21  <title>SuperPowers AI | Super, the AI Assistant with Her Own Apps</title>
22  <meta name="description" content="Text Super to order food, book rides, build websites, browse the web, and finish cloud tasks from iMessage or Meta Display glasses.">
23  <meta name="keywords" content="Super AI assistant, AI with apps, iMessage AI assistant, Meta Display AI, AI agent, ChatGPT alternative, Poke alternative, Comet alternative, voice-first AI assistant, personal AI assistant, order food with AI, schedule rides with AI, build websites with AI">
24  <meta name="author" content="SuperPowers AI">
25  <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
26  <meta name="application-name" content="Super">
27  <meta name="apple-mobile-web-app-title" content="Super">
28  <link rel="canonical" href="https://getsupers.com/">
29  <link rel="sitemap" type="application/xml" href="https://getsupers.com/sitemap.xml">
30  <link rel="alternate" type="text/markdown" href="https://getsupers.com/index.md" title="SuperPowers AI homepage in Markdown">
31  <link rel="alternate" type="application/json" href="https://getsupers.com/openapi.json" title="Super API OpenAPI specification">
32  <link rel="api-catalog" type="application/linkset+json" href="https://getsupers.com/.well-known/api-catalog">
33  <link rel="service-desc" type="application/vnd.oai.openapi+json" href="https://getsupers.com/openapi.json">
34  <link rel="service-doc" type="text/html" href="https://getsupers.com/developers/">
35  <link rel="ai-catalog" type="application/ai-catalog+json" href="https://getsupers.com/.well-known/ai-catalog.json">
36  <link rel="alternate" type="application/mcp-server-card+json" href="https://getsupers.com/.well-known/mcp/server-card.json" title="Super hosted MCP Server Card">
37  <meta property="og:type" content="website">
38  <meta property="og:locale" content="en_US">
39  <meta property="og:site_name" content="SuperPowers AI">
40  <meta property="og:title" content="Text Super. She handles the apps.">
41  <meta property="og:description" content="Text Super to order food, book rides, build websites, browse the web, and finish cloud tasks from iMessage or Meta Display glasses.">
42  <meta property="og:url" content="https://getsupers.com/">
43  <meta property="og:image" content="https://getsupers.com/hero-demo-poster.jpg">
44  <meta property="og:image:alt" content="Super product demo showing an AI assistant controlling real-world apps">
45  <meta property="og:image:width" content="1280">
46  <meta property="og:image:height" content="720">
47  <meta property="og:video" content="https://storage.googleapis.com/cheatlayer/landing/hero-0607-2-3.mp4">
48  <meta property="og:video:type" content="video/mp4">
49  <meta name="twitter:card" content="summary_large_image">
50  <meta name="twitter:title" content="Text Super. She handles the apps.">
51  <meta name="twitter:description" content="Text Super to order food, book rides, build websites, browse the web, and finish cloud tasks from iMessage or Meta Display glasses.">
52  <meta name="twitter:image" content="https://getsupers.com/hero-demo-poster.jpg">
53  <meta name="twitter:image:alt" content="Super product demo showing an AI assistant controlling real-world apps">
54  <meta name="twitter:site" content="@Super_Powers_AI">
55  <meta name="twitter:creator" content="@Super_Powers_AI">
56  <link rel="icon" type="image/png" sizes="512x512" href="https://storage.googleapis.com/cheatlayer/landing/icon-transparent-512.png">
57  <link rel="icon" type="image/png" sizes="192x192" href="https://storage.googleapis.com/cheatlayer/landing/icon-transparent-192.png">
58  <link rel="apple-touch-icon" sizes="180x180" href="https://storage.googleapis.com/cheatlayer/landing/icon-transparent-180.png">
59  <link rel="preload" as="image" href="/hero-demo-poster.jpg" fetchpriority="high">
60  <link rel="preconnect" href="https://storage.googleapis.com">
61  <link rel="preconnect" href="https://unavatar.io">
62  <link rel="preconnect" href="https://api.fontshare.com">
63  <noscript><style>.intro-loading .nav,.intro-loading .hero-subheading,.intro-loading .hero-actions,.intro-loading .hero-video-frame,.intro-loading .page>section:not(.hero),.intro-loading .footer{opacity:1!important;transform:none!important;pointer-events:auto!important}.intro-loading .hero h1{opacity:1!important}.intro-loading .hero-word{opacity:1!important;transform:none!important}</style></noscript>
64  <link rel="stylesheet" href="https://api.fontshare.com/v2/css?f[]=cabinet-grotesk@400,500,700,800,900&display=swap">
65  
65<script type="application/ld+json">
66    {
67        "@context": "https://schema.org",
68        "@graph": [
69            {
70                "@type": "Organization",
71                "@id": "https://getsupers.com/#organization",
72                "name": "SuperPowers AI",
73                "alternateName": [
74                    "Super",
75                    "Super AI Assistant",
76                    "Super by SuperPowers AI"
77                ],
78                "url": "https://getsupers.com/",
79                "description": "SuperPowers AI builds Super, an action-oriented AI assistant with apps, browsers, cloud sandboxes, APIs, hosted MCP servers, and connected-device clients.",
80                "email": "[email protected]",
81                "address": {
82                    "@type": "PostalAddress",
83                    "addressLocality": "San Francisco",
84                    "addressRegion": "CA",
85                    "addressCountry": "US"
86                },
87                "contactPoint": [
88                    {
89                        "@type": "ContactPoint",
90                        "contactType": "customer support",
91                        "email": "[email protected]",
92                        "url": "https://getsupers.com/contact",
93                        "availableLanguage": ["English"]
94                    },
95                    {
96                        "@type": "ContactPoint",
97                        "contactType": "Super assistant SMS",
98                        "telephone": "+1-424-303-9212",
99                        "url": "https://getsupers.com/contact",
100                        "availableLanguage": ["English"]
101                    }
102                ],
103                "logo": {
104                    "@type": "ImageObject",
105                    "url": "https://storage.googleapis.com/cheatlayer/landing/icon-transparent-512.png",
106                    "width": 512,
107                    "height": 512,
108                    "caption": "Super AI assistant app logo"
109                },
110                "sameAs": [
111                    "https://x.com/Super_Powers_AI",
112                    "https://github.com/rohanarun/phoneclaw",
113                    "https://discord.gg/supers",
114                    "https://apps.apple.com/us/app/super-real-time-ai-assistant/id6758969961",
115                    "https://chromewebstore.google.com/detail/superpowers-ai/oolmdenpaebkcokkccakmlmhcpnogalc",
116                    "https://www.npmjs.com/package/superpowers-ai"
117                ]
118            },
119            {
120                "@type": "WebSite",
121                "@id": "https://getsupers.com/#website",
122                "url": "https://getsupers.com/",
123                "name": "SuperPowers AI",
124                "alternateName": "Super",
125                "description": "Text Super to order food, book rides, build websites, browse the web, and finish cloud tasks from iMessage or Meta Display glasses.",
126                "publisher": {
127                    "@id": "https://getsupers.com/#organization"
128                },
129                "inLanguage": "en-US"
130            },
131            {
132                "@type": "ItemList",
133                "@id": "https://getsupers.com/#comparison-pages",
134                "name": "Super AI assistant comparison pages",
135                "itemListElement": [
136                    {
137                        "@type": "ListItem",
138                        "position": 1,
139                        "name": "Super vs ChatGPT",
140                        "url": "https://getsupers.com/vs/chatgpt/"
141                    },
142                    {
143                        "@type": "ListItem",
144                        "position": 2,
145                        "name": "Super vs Poke",
146                        "url": "https://getsupers.com/vs/poke/"
147                    },
148                    {
149                        "@type": "ListItem",
150                        "position": 3,
151                        "name": "Super vs Comet",
152                        "url": "https://getsupers.com/vs/comet/"
153                    }
154                ]
155            },
156            {
157                "@type": "SoftwareApplication",
158                "@id": "https://getsupers.com/#super-app",
159                "name": "Super by SuperPowers AI",
160                "alternateName": "Super",
161                "applicationCategory": "ProductivityApplication",
162                "operatingSystem": "iOS, Android, macOS, Windows, Web, Meta Display",
163                "url": "https://getsupers.com/",
164                "downloadUrl": "https://apps.apple.com/us/app/super-real-time-ai-assistant/id6758969961",
165                "description": "Super is an AI assistant with her own cloud apps, email, phone, browser, and sandboxes so users can schedule rides, order food, build websites, browse the web, and automate real-world tasks from chat.",
166                "image": "https://storage.googleapis.com/cheatlayer/landing/icon-transparent-512.png",
167                "publisher": {
168                    "@id": "https://getsupers.com/#organization"
169                },
170                "offers": {
171                    "@type": "Offer",
172                    "price": 0,
173                    "priceCurrency": "USD",
174                    "description": "Start free, then top up Super's wallet and pay as you go."
175                },
176                "aggregateRating": {
177                    "@type": "AggregateRating",
178                    "ratingValue": 4.6,
179                    "bestRating": 5,
180                    "worstRating": 1,
181                    "ratingCount": 57
182                }
183            },
184            {
185                "@type": "WebAPI",
186                "@id": "https://getsupers.com/#super-api",
187                "name": "SuperPowers AI Super API",
188                "alternateName": "Super API",
189                "description": "OpenAI-compatible model discovery and completion API with self-serve keys, OAuth, typed OpenAPI schemas, and standard rate-limit response fields.",
190                "url": "https://getsupers.com/developers/",
191                "documentation": "https://getsupers.com/openapi.json",
192                "serviceUrl": "https://app.getsupers.com/v1",
193                "provider": {
194                    "@id": "https://getsupers.com/#organization"
195                }
196            },
197            {
198                "@type": "SoftwareApplication",
199                "@id": "https://getsupers.com/#super-cli",
200                "name": "SuperPowers AI CLI",
201                "alternateName": "superpowers-ai",
202                "applicationCategory": "DeveloperApplication",
203                "operatingSystem": "macOS, Windows, Linux",
204                "url": "https://getsupers.com/developers/cli",
205                "downloadUrl": "https://www.npmjs.com/package/superpowers-ai",
206                "publisher": {
207                    "@id": "https://getsupers.com/#organization"
208                },
209                "offers": {
210                    "@type": "Offer",
211                    "price": 0,
212                    "priceCurrency": "USD"
213                }
214            },
215            {
216                "@type": "VideoObject",
217                "@id": "https://getsupers.com/#hero-video",
218                "name": "Build a live interactive tool with Super",
219                "description": "A product demo showing Super automating tasks like rides, food, website building, and cloud app control from iMessage and Meta Display glasses.",
220                "thumbnailUrl": [
221                    "https://getsupers.com/hero-demo-poster.jpg"
222                ],
223                "contentUrl": "https://storage.googleapis.com/cheatlayer/landing/hero-0607-2-3.mp4",
224                "uploadDate": "2026-06-07",
225                "publisher": {
226                    "@id": "https://getsupers.com/#organization"
227                },
228                "duration": "PT2M5S",
229                "transcript": "Transcript summary: Super receives requests from text and Meta Display glasses, then uses her own cloud apps, browser, phone, email, and sandboxes to order food, book rides, build websites, browse the web, and finish practical tasks end to end."
230            },
231            {
232                "@type": "FAQPage",
233                "@id": "https://getsupers.com/#faq-schema",
234                "mainEntity": [
235                    {
236                        "@type": "Question",
237                        "name": "How does the agent wallet work?",
238                        "acceptedAnswer": {
239                            "@type": "Answer",
240                            "text": "You top up your Super wallet and pay as you go. Wallet funds are used by Super to purchase products, services, and optional premium models."
241                        }
242                    },
243                    {
244                        "@type": "Question",
245                        "name": "Is there a subscription?",
246                        "acceptedAnswer": {
247                            "@type": "Answer",
248                            "text": "Super can be used free with pay-as-you-go wallet top-ups. Optional fleet subscriptions cost $199 per month for 10 devices or $999 per month for 100 devices and include private agents, live onboarding, and forward-deployed engineering for custom agents."
249                        }
250                    },
251                    {
252                        "@type": "Question",
253                        "name": "Does computer-use spend wallet funds?",
254                        "acceptedAnswer": {
255                            "@type": "Answer",
256                            "text": "No. Computer-use work does not spend wallet funds. Super's computer-use cache allows cloud app automation at zero computer-use cost for customers."
257                        }
258                    },
259                    {
260                        "@type": "Question",
261                        "name": "Can Super use different models?",
262                        "acceptedAnswer": {
263                            "@type": "Answer",
264                            "text": "Yes. Super can use frontier, cheap, or free model modes depending on the task and the user's budget."
265                        }
266                    },
267                    {
268                        "@type": "Question",
269                        "name": "What can Super actually do?",
270                        "acceptedAnswer": {
271                            "@type": "Answer",
272                            "text": "Super can schedule Uber rides, order groceries, order Starbucks, run arbitrary cloud code, build websites, help with downloads or file work, and thousands more tasks."
273                        }
274                    },
275                    {
276                        "@type": "Question",
277                        "name": "Do you have an API?",
278                        "acceptedAnswer": {
279                            "@type": "Answer",
280                            "text": "Yes. Developers can build similar experiences using the Super API dashboard at https://app.getsupers.com/developer/api-dashboard."
281                        }
282                    }
283                ]
284            }
285        ]
286    }
287  </script>
287
288  
288<script>
289    (function () {
290      try {
291        var params = new URLSearchParams(window.location.search || '');
292        var shouldStayOnWeb = params.get('no_app_redirect') === '1' || params.get('web') === '1' || params.get('stay') === '1';
293        var standalone = (window.matchMedia && window.matchMedia('(display-mode: standalone)').matches) || window.navigator.standalone === true;
294        var messageHandlers = window.webkit && window.webkit.messageHandlers;
295        var nativeBridge = !!(
296          window.ReactNativeWebView ||
297          (messageHandlers && (messageHandlers.iosPowerRunner || messageHandlers.webrtcEvent || messageHandlers.voiceAction))
298        );
299        var userAgent = navigator.userAgent || navigator.vendor || '';
300        var isIPhone = /iPhone|iPod/i.test(userAgent);
301
302        if (!isIPhone || shouldStayOnWeb || standalone || nativeBridge) return;
303        document.documentElement.classList.add('is-iphone-browser');
304      } catch (_error) {
305        // Keep the landing page available if browser detection fails.
306      }
307    })();
308  </script>
308
309  <link rel="stylesheet" href="/landing.0544356615.min.css">
310  <style>
311    body.nav-at-tool .nav,body.nav-at-tool.intro-loading .nav{opacity:0;visibility:hidden;transform:translate(-50%,-30px);pointer-events:none}
312    body.nav-below-tool .nav,body.nav-below-tool.intro-loading .nav{opacity:1;visibility:visible;transform:translate(-50%,0);pointer-events:auto}
313    .hero{min-height:auto;padding:0 0 118px}
314    .hero-inner{width:100%;max-width:none;gap:clamp(28px,5vw,72px)}
315    .tool-generator{width:100%;min-height:100svh;display:grid;grid-template-rows:minmax(0,0fr) auto auto auto auto;gap:14px;align-content:center;padding:clamp(22px,4vw,54px);text-align:left;background:#fff;border-bottom:1px solid rgba(0,0,0,.12);isolation:isolate;overflow-anchor:none;transition:grid-template-rows 680ms var(--ease),min-height 680ms var(--ease)}
316    .tool-generator.is-active{box-sizing:border-box;height:130svh;min-height:130svh;max-height:130svh;grid-template-rows:minmax(0,1fr) auto auto auto auto;align-content:stretch;overflow:hidden}
317    body.intro-loading .tool-generator{opacity:1;transform:none;pointer-events:auto}
318    .tool-generator-preview{display:grid;grid-template-rows:minmax(0,1fr);position:relative;overflow:hidden;width:100%;height:100%;min-height:0;border:1px solid rgba(10,10,10,.13);border-radius:34px;background:#fff;box-shadow:0 28px 84px rgba(27,25,20,.16);isolation:isolate;visibility:hidden;opacity:0}
319    .tool-generator.is-active .tool-generator-preview{visibility:visible;opacity:1;animation:tool-preview-arrive 520ms var(--ease) both}
320    .tool-generator-stage{position:relative;min-width:0;min-height:0;overflow:hidden;background:#fff}
321    .tool-generator-frame{position:absolute;inset:0;z-index:4;display:block;width:100%;height:100%;min-height:0;overflow:auto;border:0;background:#fff;color:#111;opacity:0;transition:opacity 420ms var(--ease)}
322    .tool-generator.has-output .tool-generator-frame{opacity:1}
323    .tool-generator-webgl{position:absolute;inset:0;z-index:3;width:100%;height:100%;background:transparent;opacity:0;transition:opacity 180ms var(--ease);pointer-events:none}
324    .tool-generator.has-stream.texture-ready:not(.has-output) .tool-generator-webgl{opacity:1}
325    .tool-generator.has-output .tool-generator-webgl{opacity:0}
326    .tool-generator-webgl.is-unavailable{display:none}
327    .tool-generator-texture-video{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
328    .tool-generator-stream-source{position:absolute;inset:0;z-index:2;width:100%;height:100%;overflow:hidden;border:0;opacity:0;pointer-events:none;background:#fff;transition:opacity 180ms var(--ease)}
329    .tool-generator-loading{position:absolute;inset:0;z-index:5;display:grid;place-items:center;pointer-events:none;transition:opacity 260ms var(--ease),visibility 260ms var(--ease)}
330    .tool-generator.has-stream .tool-generator-loading,.tool-generator.has-output .tool-generator-loading{opacity:0;visibility:hidden}
331    .tool-generator-loading-copy{display:grid;gap:11px;justify-items:center;padding:14px 18px;border:1px solid rgba(10,10,10,.1);border-radius:18px;background:rgba(255,255,255,.72);box-shadow:0 14px 44px rgba(27,25,20,.12);backdrop-filter:blur(16px);color:var(--muted);font-size:14px;font-weight:800}
332    .tool-generator-pulse{width:12px;height:12px;border-radius:3px;background:var(--ink);box-shadow:-18px 0 rgba(10,10,10,.22),18px 0 rgba(10,10,10,.38);animation:tool-generator-grid-pulse 1.1s ease-in-out infinite}
333    .tool-generator-share{display:flex;align-items:center;gap:10px;min-width:0;padding:0 8px;white-space:nowrap}
334    .tool-generator-share[hidden]{display:none}
335    .tool-generator-share-button{flex:0 0 auto;min-height:40px;padding:0 16px;border:1px solid var(--ink);border-radius:999px;background:var(--ink);color:#fff;font:900 13px/1 'Cabinet Grotesk',sans-serif;cursor:pointer;transition:transform 180ms var(--ease),background 180ms var(--ease),color 180ms var(--ease)}
336    .tool-generator-share-button:hover,.tool-generator-share-button:focus-visible{transform:translateY(-2px);background:#fff;color:var(--ink);outline:0}
337    .tool-generator-site-link{min-width:0;overflow:hidden;color:var(--muted);font-size:12px;font-weight:800;text-decoration:underline;text-overflow:ellipsis;text-underline-offset:3px;white-space:nowrap}
338    .tool-generator-launcher{display:grid;gap:10px;justify-self:center;width:100%;max-width:800px;min-width:0;transition:max-width 680ms var(--ease),transform 680ms var(--ease)}
339    .tool-generator.is-composer-expanded .tool-generator-launcher{max-width:1600px}
340    .tool-generator-prompts{display:flex;gap:8px;align-items:center;justify-content:center;width:100%;overflow-x:auto;scrollbar-width:none;padding:1px 2px 2px}
341    .tool-generator-prompts::-webkit-scrollbar{display:none}
342    .tool-generator-prompt{flex:0 0 auto;min-height:38px;padding:0 15px;border:1px solid rgba(10,10,10,.13);border-radius:999px;background:rgba(255,255,255,.72);color:var(--ink);font:800 13px/1 'Cabinet Grotesk',sans-serif;cursor:pointer;backdrop-filter:blur(14px);transition:transform 180ms var(--ease),background 180ms var(--ease),border-color 180ms var(--ease)}
343    .tool-generator-prompt:hover,.tool-generator-prompt:focus-visible{transform:translateY(-2px);background:#fff;border-color:rgba(10,10,10,.28);outline:0}
344    .tool-generator-composer{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end;justify-self:center;width:78%;min-width:560px;padding:10px 10px 10px 22px;border:1px solid rgba(10,10,10,.14);border-radius:28px;background:rgba(255,255,255,.86);box-shadow:0 18px 60px rgba(27,25,20,.11);backdrop-filter:blur(22px);transition:width 680ms var(--ease),min-width 680ms var(--ease),box-shadow 680ms var(--ease)}
345    .tool-generator.is-composer-expanded .tool-generator-composer{width:100%;min-width:0;box-shadow:0 24px 72px rgba(27,25,20,.14)}
346    .tool-generator-input{width:100%;min-height:48px;max-height:148px;resize:none;overflow-y:auto;border:0;outline:0;background:transparent;color:var(--ink);font:600 clamp(1rem,1.8vw,1.2rem)/1.4 'Cabinet Grotesk',sans-serif;letter-spacing:-.008em;padding:11px 0 8px}
347    .tool-generator-input::placeholder{color:rgba(10,10,10,.46)}
348    .tool-generator-submit{width:54px;height:54px;display:grid;place-items:center;border:1px solid var(--ink);border-radius:20px;background:var(--ink);color:#fff;cursor:pointer;transition:transform 180ms var(--ease),background 180ms var(--ease),color 180ms var(--ease)}
349    .tool-generator-submit:hover{transform:translateY(-2px);background:#fff;color:var(--ink)}
350    .tool-generator-submit:disabled{cursor:wait;opacity:.55;transform:none}
351    .tool-generator-submit svg{width:23px;height:23px}
352    .tool-generator-recents{display:grid;gap:8px;min-width:0;padding:0 2px;opacity:0;visibility:hidden;transform:translateY(18px);pointer-events:none;transition:opacity 520ms var(--ease),transform 520ms var(--ease),visibility 520ms var(--ease)}
353    .tool-generator-recents.is-visible{opacity:1;visibility:visible;transform:none;pointer-events:auto}
354    .tool-generator-recents[hidden]{display:none}
355    .tool-generator-recents-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:0 6px;color:var(--muted);font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
356    .tool-generator-recents-signal{display:inline-flex;align-items:center;justify-content:flex-end;
356gap:8px;white-space:nowrap}
357    .tool-generator-recents-live{display:inline-flex;align-items:center;gap:6px;color:var(--ink)}
358    .tool-generator-recents-live::before{content:"";width:6px;height:6px;border-radius:50%;background:#000;animation:tool-recents-live 1.8s ease-in-out infinite}
359    .tool-generator-recents-metric{color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:.02em;text-transform:none}
360    .tool-generator-recents-metric::before{content:"·";margin-right:8px;color:var(--quiet)}
361    .tool-generator-recents-metric[hidden]{display:none}
362    .tool-generator-recent-list{display:flex;gap:8px;min-width:0;overflow-x:auto;padding:1px 2px 3px;scrollbar-width:none}
363    .tool-generator-recent-list::-webkit-scrollbar{display:none}
364    .tool-generator-recent{flex:0 0 clamp(224px,28vw,330px);display:grid;gap:5px;min-width:0;padding:11px 13px;border:1px solid #dedede;border-radius:16px;background:#fff;color:#000;transition:transform 180ms var(--ease),border-color 180ms var(--ease)}
365    .tool-generator-recent:hover,.tool-generator-recent:focus-visible{transform:translateY(-2px);border-color:#000;outline:0}
366    .tool-generator-recent-question{overflow:hidden;font-size:13px;font-weight:850;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}
367    .tool-generator-recent-title{overflow:hidden;color:var(--muted);font-size:11px;font-weight:750;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}
368    .tool-generator-recent-meta{display:flex;align-items:center;gap:5px;color:var(--quiet);font-size:10px;font-weight:750;line-height:1.2}
369    .tool-generator-recent-impressions{color:var(--ink);font-variant-numeric:tabular-nums;font-weight:900}
370    .tool-generator-recent-meta time{color:var(--ink);font-weight:900}
371    .tool-generator-meta{min-height:20px;display:flex;justify-content:space-between;gap:16px;padding:0 8px;color:var(--quiet);font-size:13px;font-weight:800;letter-spacing:0}
372    .tool-generator-status[data-tone="error"]{color:#a42b23}
373    .tool-nav-sentinel{width:100%;height:1px;margin-top:-1px;pointer-events:none}
374    .ios-app-suggestion{display:none;position:fixed;z-index:80;left:50%;bottom:max(14px,env(safe-area-inset-bottom));width:min(calc(100% - 24px),520px);transform:translateX(-50%);grid-template-columns:auto minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:12px;border:1px solid rgba(10,10,10,.14);border-radius:22px;background:rgba(255,255,255,.94);box-shadow:0 24px 72px rgba(27,25,20,.24);backdrop-filter:blur(24px)}
375    .is-iphone-browser .ios-app-suggestion.is-visible{display:grid;animation:tool-ios-arrive 420ms var(--ease) both}
376    .ios-app-suggestion img{width:44px;height:44px;border-radius:13px}
377    .ios-app-suggestion-copy{display:grid;gap:2px;color:var(--ink);font-size:14px;line-height:1.18}
378    .ios-app-suggestion-copy strong{font-size:15px}
379    .ios-app-suggestion-link{min-height:40px;display:inline-flex;align-items:center;padding:0 14px;border-radius:14px;background:var(--ink);color:#fff;font-size:13px;font-weight:900}
380    .ios-app-suggestion-close{width:40px;height:40px;border:0;background:transparent;color:var(--ink);font-size:24px;line-height:1;cursor:pointer}
381    @keyframes tool-generator-grid-pulse{0%,100%{transform:scale(.7);opacity:.45}50%{transform:scale(1.1);opacity:1}}
382    @keyframes tool-recents-live{0%,100%{opacity:.35;transform:scale(.72)}50%{opacity:1;transform:scale(1)}}
383    @keyframes tool-preview-arrive{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
384    @keyframes tool-ios-arrive{from{opacity:0;transform:translate(-50%,18px)}to{opacity:1;transform:translate(-50%,0)}}
385    :root{--paper:#fff;--ink:#000;--muted:#5f5f5f;--quiet:#7a7a7a;--white:#fff;--line:#e5e5e5;--shadow-soft:0 24px 70px rgba(0,0,0,.09);--shadow-hard:0 26px 80px rgba(0,0,0,.16)}
386    html,body{background:#fff!important;color:#000}
387    .paper-noise{display:none}
388    .nav,.proof-strip,.service-icon,.compare-card,.review-card,.review-card.featured,.price-card,details,.footer-panel,.tool-generator-prompt,.tool-generator-composer,.tool-generator-loading-copy,.ios-app-suggestion{background:#fff}
389    .tool-generator,.compare,.wall,.pricing,.footer{background:#fff}
390    .pricing-tier-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:28px}
391    .price-card.pricing-tier-card{display:flex;flex-direction:column;gap:22px;min-height:100%;padding:clamp(24px,3vw,36px)}
392    .pricing-tier-card .price-summary,.pricing-tier-card .price-included{width:100%;max-width:none}
393    .pricing-tier-card .price-summary{position:static;top:auto}
394    .pricing-tier-card .price-included{margin-top:auto}
395    .pricing-tier-card .price-features{display:grid;gap:11px}
396    .pricing-tier-card[data-tier="devices_100"]{border-color:#111;box-shadow:0 26px 70px rgba(0,0,0,.11)}
397    @media (max-width:980px){.pricing-tier-grid{grid-template-columns:1fr}.price-card.pricing-tier-card{min-height:0}}
398    .feature-video-shell,.review-avatar{background:#f2f2f2}
399    .feature-list li{color:#222}
400    .nav,.proof-strip,.service-icon,.compare-card,.review-card,.review-card.featured,.price-card,details,.footer-panel,.tool-generator-preview,.tool-generator-prompt,.tool-generator-composer,.tool-generator-loading-copy,.ios-app-suggestion{border-color:#dedede}
401    @media (max-width:760px){.hero{padding:0 0 78px}.hero-inner{gap:34px}.tool-generator{min-height:100svh;gap:9px;padding:18px 12px max(18px,env(safe-area-inset-bottom))}.tool-generator-preview{min-height:0;border-radius:24px}.tool-generator-frame{height:100%;min-height:0}.tool-generator-launcher{max-width:100%}.tool-generator-prompts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;overflow:visible;margin-inline:0}.tool-generator-prompt{width:100%;min-height:48px;padding:6px 7px;font-size:11px;line-height:1.12;white-space:normal}.tool-generator-composer{width:min(88%,560px);min-width:0;padding:8px 8px 8px 17px;border-radius:23px}.tool-generator.is-composer-expanded .tool-generator-composer{width:100%;min-width:0}.tool-generator-submit{width:50px;height:50px;border-radius:17px}.tool-generator-meta{font-size:12px}.ios-app-suggestion{grid-template-columns:auto minmax(0,1fr) auto}.ios-app-suggestion-close{display:none}}
402    @media (prefers-reduced-motion:reduce){.tool-generator,.tool-generator-launcher,.tool-generator-composer{transition:none}.tool-generator-pulse{animation:none}.tool-generator.is-active .tool-generator-preview,.is-iphone-browser .ios-app-suggestion.is-visible{animation:none}.tool-generator-recents{transition:none}}
403    .launch-news{padding:clamp(80px,10vw,144px) 0;background:#fff}
404    .launch-news h2{margin:0;font-size:clamp(36px,5vw,64px);letter-spacing:-.04em}
405    .launch-news-intro{max-width:720px;margin:20px 0 48px;color:var(--muted);font-size:20px;line-height:1.5}
406    .launch-news-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:dense;gap:clamp(28px,5vw,72px)}
407    .launch-news-story{min-width:0;border-top:1px solid rgba(10,10,10,.18);padding-top:24px}
408    .launch-news-story h3{margin:14px 0 24px;font-size:clamp(26px,2.8vw,36px);line-height:1.15;letter-spacing:-.025em}
409    .launch-news-story p{font-size:17px;line-height:1.65;color:var(--muted)}
410    .launch-news-story .launch-news-date{font-size:14px;color:var(--ink);font-weight:700}
411    .launch-news-video{display:block;width:100%;aspect-ratio:16/9;object-fit:contain;border-radius:18px;background:#111;margin-bottom:24px}
412    .launch-news-links{display:flex;flex-wrap:wrap;gap:16px 24px;margin-top:28px}
413    .launch-news-links a{color:var(--ink);font-weight:800;text-decoration:underline;text-underline-offset:5px}
414    .launch-news-links a:hover{opacity:.7}
415    @media(max-width:760px){.launch-news-grid{grid-template-columns:1fr;gap:48px}}
416    .developer-code-grid{display:block}
417    .developer-code-tabs{display:flex;gap:8px;padding:12px 16px;border-bottom:1px solid #dcdedb;background:#f5f6f3}
418    .developer-code-tabs button{padding:12px 18px;border:0;border-radius:10px;background:transparent;color:#454b48;font:inherit;font-weight:700;cursor:pointer}
419    .developer-code-tabs button[aria-selected="true"]{background:#171c19;color:#fff}
420    .developer-code-tabs button:focus-visible{outline:3px solid #4f8b64;outline-offset:2px}
421    .developer-code-panel[hidden]{display:none}
422    .developer-code-panel>a{margin:0 24px;font-weight:800;text-decoration:underline;text-underline-offset:4px}
423    .developer-code-card{min-width:0;overflow:hidden;background:#fff;border:1px solid #dcdedb;border-radius:20px;padding-bottom:24px}
424    .developer-code-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px;border-bottom:1px solid #dcdedb}
425    .developer-code-bar h3{margin:0;font-size:20px}
426    .developer-code-bar button{border:1px solid #454b48;border-radius:8px;background:#171c19;color:#fff;padding:8px 14px;font:700 14px inherit;cursor:pointer}
427    .developer-code-bar button:hover{background:#354139}
428    .developer-code-card pre{margin:0;padding:24px;min-height:210px;overflow-x:auto;background:#171c19;color:#e8f1eb;font:14px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace;tab-size:2}
429    .developer-code-card pre code{font:inherit}
430    .developer-code-card p{margin:20px 24px 16px;font-size:16px;line-height:1.55;color:var(--muted)}
431    .developer-code-card>a{margin:0 24px;font-weight:800;text-decoration:underline;text-underline-offset:4px}
432    .developer-code-footer{display:flex;flex-wrap:wrap;gap:20px;margin-top:24px;font-size:16px}
433    .developer-code-footer a{text-decoration:underline;text-underline-offset:4px}
434    .developer-code-bar button:focus-visible,.developer-code-card pre:focus-visible{outline:3px solid #4f8b64;outline-offset:3px}
435    @media(max-width:760px){.developer-code-grid{grid-template-columns:1fr}.developer-code-card pre{min-height:0}}
436    .nav-compare{position:relative}
437    #nav-compare-toggle{display:flex;align-items:center;gap:6px;border:0;background:transparent;color:inherit;font:inherit;font-weight:700;padding:10px 14px;cursor:pointer;border-radius:18px}
438    #nav-compare-toggle:hover,#nav-compare-toggle[aria-expanded="true"]{background:rgba(0,0,0,.06)}
439    #nav-compare-toggle:focus-visible{outline:2px solid currentColor;outline-offset:2px}
440    #nav-compare-links{position:absolute;top:calc(100% + 10px);left:0;min-width:210px;padding:8px;border:1px solid #ddd;border-radius:16px;background:#fff;color:#111;box-shadow:0 16px 40px rgba(0,0,0,.14);z-index:100}
441    #nav-compare-links:not([hidden]){display:grid}
442    #nav-compare-links a{display:block;white-space:nowrap;padding:12px 14px;border-radius:10px}
443    #nav-compare-links a:hover,#nav-compare-links a:focus-visible{background:#f0f2ef}
444    @media(max-width:760px){.nav-links{overflow:visible;flex-wrap:wrap}#nav-compare-toggle{padding:8px 11px;font-size:inherit}}
445    .app-download-actions{flex-wrap:wrap;scroll-margin-top:110px}
446    .app-download-actions a{white-space:nowrap}
447    @media(max-width:600px){.app-download-actions{display:grid;grid-template-columns:1fr;width:100%}.app-download-actions a{width:100%;justify-content:center;text-align:center}}
448    .page{overflow-x:clip}
449    .features{overflow:clip}
450    @media(min-width:1021px){.feature-visuals,.feature-visuals.is-gsap-pinned{position:sticky;top:clamp(84px,17svh,172px);align-self:start;transform:none!important}}
451    .app-download-actions a{display:flex;align-items:center;justify-content:center;gap:10px}
452    .download-platform-icon{width:22px;height:22px;flex:0 0 22px;display:block}
453    .download-label{display:flex;flex-direction:column;align-items:center;gap:4px;line-height:1.2}
454    .download-label small{display:block;font-size:12px;font-weight:500;line-height:1.3;letter-spacing:0;opacity:.75}
455    .app-download-actions{align-items:stretch}
456  </style>
457  
457<script>
458    document.addEventListener('DOMContentLoaded', () => {
459      const visuals = document.querySelector('.feature-visuals');
460      // Native sticky tracks layout changes without stale fixed-position pin coordinates.
461      if (visuals && window.ScrollTrigger) {
462        ScrollTrigger.getAll().filter(trigger => trigger.pin === visuals).forEach(trigger => trigger.kill(true));
463        visuals.classList.remove('is-gsap-pinned');
464      }
465      const features = document.querySelector('.features');
466      if (features) {
467        const syncPlayback = () => {
468          const bounds = features.getBoundingClientRect();
469          const visible = bounds.top < innerHeight && bounds.bottom > 0;
470          features.querySelectorAll('video').forEach(video => {
471            if (visible && video.closest('.feature-video').classList.contains('is-active')) {
472              if (video.paused) video.play().catch(() => {});
473            } else video.pause();
474          });
475        };
476        new IntersectionObserver(syncPlayback).observe(features);
477        syncPlayback();
478      }
479    }, {once:true});
480  </script>
480
481  
481<script>
482    !function(t,e){var o,n,p,r;e.__SV||(window.posthog=e,e._i=[],e.init=function(i,s,a){function g(t,e){var o=e.split(".");2==o.length&&(t=t[o[0]],e=o[1]),t[e]=function(){t.push([e].concat(Array.prototype.slice.call(arguments,0)))}}(p=t.createElement("script")).type="text/javascript",p.async=!0,p.src=s.api_host.replace(".i.posthog.com","-assets.i.posthog.com")+"/static/array.js",(r=t.getElementsByTagName("script")[0]).parentNode.insertBefore(p,r);var u=e;for(void 0!==a?u=e[a]=[]:a="posthog",u.people=u.people||[],u.toString=function(t){var e="posthog";return"posthog"!==a&&(e+="."+a),t||(e+=" (stub)"),e},u.people.toString=function(){return u.toString(1)+".people (stub)"},o="init capture register register_once register_for_session unregister opt_out_capturing has_opted_out_capturing opt_in_capturing reset isFeatureEnabled getFeatureFlag getFeatureFlagPayload reloadFeatureFlags group identify setPersonProperties setPersonPropertiesForFlags resetPersonPropertiesForFlags resetGroups onFeatureFlags addFeatureFlagsHandler onSessionId getSurveys getActiveMatchingSurveys renderSurvey canRenderSurvey getNextSurveyStep".split(" "),n=0;n<o.length;n++)g(u,o[n]);e._i.push([i,s,a])},e.__SV=1)}(document,window.posthog||[]);
483    posthog.init('phc_b0JgSM1YLRCR1Jv4nS9DufukjhTYntC2O1XQLlUsoGn', {
484        api_host: 'https://us.i.posthog.com',
485        defaults: '2026-01-30'
486    })
487  </script>
487
488<!-- personal-ai-agent-directory-style:start -->
489<!-- personal-ai-agent-directory-style:end -->
490<!-- personal-ai-agent-directory-script:start -->
491<!-- personal-ai-agent-directory-script:end -->
492  <link rel="stylesheet" href="/landing-typography.css?v=20260920">
493<script async data-super-google-tag src="https://app.getsupers.com/assets/google-tag.js"></script>
493</head>
494<body class="nav-at-tool">
495  <noscript><img height="1" width="1" style="display:none" alt=""
496    src="https://www.facebook.com/tr?id=107056183303487&amp;ev=PageView&amp;noscript=1"
497  ></noscript>
498  <div class="paper-noise" aria-hidden="true"></div>
499
500  <nav class="nav" aria-label="Main navigation">
501    <a class="brand" href="#top" aria-label="Super home">
502      <img class="brand-mark" src="https://storage.googleapis.com/cheatlayer/landing/icon-transparent-512.png" alt="Super AI assistant app logo" width="30" height="30">
503      <span>Super</span>
504    </a>
505    <div class="nav-links" aria-label="Page sections">
506      <a href="#features">Features</a>
507<!-- personal-ai-agent-directory-nav:start -->
508<!-- personal-ai-agent-directory-nav:end -->
509      <a href="#reviews">Reviews</a>
510      <a href="#pricing">Pricing</a>
511      <a href="#faq">FAQ</a>
512      <a href="/developers/">Developers</a>
513      <a href="/about">About</a>
514    </div>
515    <a class="nav-cta" href="#downloads">Download Super</a>
516  </nav>
517
518  <main class="page" id="top">
519    <section class="hero" aria-labelledby="hero-title">
520      <div class="shell hero-inner">
521        <h1 class="sr-only" id="hero-title">Build a live interactive tool with Super</h1>
522        <div class="tool-generator" data-tool-generator data-tailwind-runtime="https://getsupers.com/assets/tailwind-browser-3.4.17.js">
523          <div class="tool-generator-preview" data-tool-preview>
524            <div class="tool-generator-stage" data-tool-stage>
525              <canvas class="tool-generator-webgl" data-tool-webgl aria-hidden="true"></canvas>
526              <video class="tool-generator-texture-video" data-tool-texture-video muted autoplay playsinline aria-hidden="true"></video>
527              <div class="tool-generator-stream-source" data-tool-stream-source aria-hidden="true"></div>
528              <div class="tool-generator-loading" data-tool-loading>
529                <div class="tool-generator-loading-copy">
530                  <span class="tool-generator-pulse" aria-hidden="true"></span>
531                  <span>Building your live tool</span>
532                </div>
533              </div>
534              <iframe class="tool-generator-frame" data-tool-frame title="Generated interactive tool" sandbox="allow-scripts allow-forms allow-modals allow-downloads allow-popups"></iframe>
535            </div>
536          </div>
537          <div class="tool-generator-launcher" data-tool-launcher>
538            <div class="tool-generator-prompts" data-tool-prompts aria-label="Quick questions" aria-live="polite">
539              <button class="tool-generator-prompt" type="button" data-tool-question="How do transformers work?">How do transformers work?</button>
540              <button class="tool-generator-prompt" type="button" data-tool-question="Why do neural networks hallucinate?">Why do neural networks hallucinate?</button>
541              <button class="tool-generator-prompt" type="button" data-tool-question="Visualize how an eclipse happens">Visualize an eclipse</button>
542            </div>
543            <form class="tool-generator-composer" data-tool-form>
544              <label class="sr-only" for="tool-generator-input">Describe a question or tool for Super</label>
545              <textarea class="tool-generator-input" id="tool-generator-input" data-tool-input rows="1" maxlength="2000" placeholder="Ask a question. Super will build a tool to answer it." required></textarea>
546              <button class="tool-generator-submit" data-tool-submit type="submit" aria-label="Generate a live tool">
547                <svg viewBox="0 0 24 24" fill="none" aria-hidden="true"><path d="M12 19V5m0 0-6 6m6-6 6 6" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"/></svg>
548              </button>
549            </form>
550          </div>
551          <section class="tool-generator-recents" data-tool-recents aria-label="Recently generated tools" hidden>
552            <div class="tool-generator-recents-head">
553              <span>What people are building now</span>
554              <span class="tool-generator-recents-signal">
555                <span class="tool-generator-recents-live">Live</span>
556                <span class="tool-generator-recents-metric" data-tool-total-sites hidden></span>
557              </span>
558            </div>
559            <div class="tool-generator-recent-list" data-tool-recent-list role="list" aria-live="polite"></div>
560          </section>
561          <div class="tool-generator-meta">
562            <span class="tool-generator-status" data-tool-status aria-live="polite"></span>
563          </div>
564          <div class="tool-generator-share" data-tool-share hidden>
565            <button class="tool-generator-share-button" data-tool-share-button type="button">Share tool</button>
566            <a class="tool-generator-site-link" data-tool-site-link target="_blank" rel="noopener noreferrer"></a>
567          </div>
568        </div>
569        <div class="tool-nav-sentinel" data-tool-nav-sentinel aria-hidden="true"></div>
570        <div class="hero-video-frame" role="button" tabindex="0" aria-label="Play Super product video from the beginning with audio once">
571          <video class="hero-video" src="https://storage.googleapis.com/cheatlayer/landing/hero-0607-2-3.mp4" poster="/hero-demo-poster.jpg" autoplay muted loop playsinline controls preload="metadata" title="Super AI assistant product demo" aria-describedby="hero-video-description hero-video-transcript"></video>
572          <p class="sr-only" id="hero-video-description">Product demo of Super, an AI assistant with her own apps, automating tasks from iMessage and Meta Display glasses.</p>
573          <p class="sr-only" id="hero-video-transcript">Transcript summary: Super receives requests from text and Meta Display glasses, then uses her own cloud apps, browser, phone, email, and sandboxes to order food, book rides, build websites, browse the web, and finish practical tasks end to end.</p>
574          <div class="video-note">
575            <span>Click once for sound</span>
576          </div>
577        </div>
578        <div class="hero-actions app-download-actions" id="downloads" aria-label="Download Super">
579          <a class="hero-primary" href="https://storage.googleapis.com/cheatlayer/SuperPowersMac.dmg"><svg class="download-platform-icon" viewBox="0 0 24 24" fill="none" aria-hidden="true"><rect x="2" y="3" width="20" height="14" rx="2" stroke="currentColor" stroke-width="1.8"/><path d="M8 21h8m-4-4v4" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>Download for Mac</a>
580          <a class="hero-secondary" href="https://chromewebstore.google.com/detail/superpowers-ai/oolmdenpaebkcokkccakmlmhcpnogalc" target="_blank" rel="noopener noreferrer"><svg class="download-platform-icon" viewBox="0 0 24 24" aria-hidden="true"><path fill="#EA4335" d="M12 2a10 10 0 0 1 8.66 5H12a5 5 0 0 0-4.33 2.5L4.2 3.9A10 10 0 0 1 12 2Z"/><path fill="#FBBC05" d="M20.66 7A10 10 0 0 1 12 22l4.33-7.5A5 5 0 0 0 12 7Z"/><path fill="#34A853" d="M12 22A10 10 0 0 1 4.2 3.9l3.47 5.6A5 5 0 0 0 16.33 14.5Z"/><circle cx="12" cy="12" r="4.5" fill="#4285F4" stroke="#fff" stroke-width="1"/></svg><span class="download-label">Get Chrome extension<small>8,000+ users &middot; 4.6 stars</small></span></a>
581          <a class="hero-secondary" href="https://apps.apple.com/us/app/super-real-time-ai-assistant/id6758969961" target="_blank" rel="noopener noreferrer"><svg class="download-platform-icon" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M17.1 12.4c0-2.2 1.8-3.3 1.9-3.4-1.1-1.6-2.8-1.8-3.4-1.8-1.5-.2-2.9.9-3.7.9-.7 0-1.9-.9-3.1-.9-1.6 0-3.1 1-3.9 2.4-1.7 2.9-.4 7.3 1.2 9.6.8 1.1 1.7 2.3 2.9 2.2 1.2 0 1.6-.7 3.1-.7s1.9.7 3.2.7c1.3 0 2.1-1.1 2.9-2.2.9-1.3 1.3-2.6 1.3-2.7-.1 0-2.4-.9-2.4-4.1ZM14.7 5.7c.6-.8 1.1-1.9 1-3-1 .1-2.2.7-2.9 1.5-.6.7-1.2 1.8-1 2.9 1.1.1 2.2-.6 2.9-1.4Z"/></svg><span class="download-label">Download for iPhone<small>3,000 users &middot; 4.9 stars</small></span></a>
582        </div>
583      </div>
584    </section>
585
586    <section class="features" id="features" aria-labelledby="features-title">
587      <h2 class="sr-only" id="features-title">What Super can do</h2>
588      <div class="shell">
589        <div class="feature-showcase">
590          <div class="feature-visuals">
591            <div class="feature-video-shell" aria-live="polite">
592              <article class="feature-video is-active" data-feature-video="0">
593                <div class="feature-screen has-video">
594                  <video class="feature-screen-video" src="https://storage.googleapis.com/cheatlayer/landing/feature-no-integrations-0607.mp4" autoplay muted loop playsinline preload="none" title="Super automates cloud apps without integrations" aria-label="Video showing Super using cloud apps to automate rides, food, and real-world tasks without integrations"></video>
595                </div>
596              </article>
597              <article class="feature-video" data-feature-video="1">
598                <div class="feature-screen has-video">
599                  <video class="feature-screen-video" src="https://storage.googleapis.com/cheatlayer/landing/feature-no-subscriptions-0607.mp4" autoplay muted loop playsinline preload="none" title="Super agent wallet pay as you go demo" aria-label="Video showing Super wallet top-ups and pay-as-you-go agent spending for products and services"></video>
600                </div>
601              </article>
602              <article class="feature-video" data-feature-video="2">
603                <div class="feature-screen has-video">
604                  <video class="feature-screen-video" src="https://storage.googleapis.com/cheatlayer/landing/feature-openclaw-normies-0607.mp4" autoplay muted loop playsinline preload="none" title="Super cloud sandbox and browser automation demo" aria-label="Video showing Super using cloud sandboxes, browsers, and apps to solve everyday tasks for non-technical users"></video>
605                </div>
606              </article>
607              <article class="feature-video" data-feature-video="3">
608                <div class="feature-screen has-video">
609                  <video class="feature-screen-video" src="https://storage.googleapis.com/cheatlayer/landing/feature-computer-use-cache-impossible-agents.mp4" autoplay muted loop playsinline preload="none" title="Computer-Use Cache for repeatable agent tasks" aria-label="Video showing Computer-Use Cache reducing repeatable cloud automation costs for agents"></video>
610                </div>
611              </article>
612              <article class="feature-video" data-feature-video="4">
613                <div class="feature-screen has-video">
614                  <video class="feature-screen-video" src="/feature-super-mac-auto-building-agents-0911.mp4" autoplay muted loop playsinline preload="none" title="Super Mac for auto-building agents" aria-label="Super Mac for auto-building agents"></video>
615                </div>
616              </article>
617            </div>
618          </div>
619
620          <div class="feature-copy-stack">
621            <article class="feature-panel" data-feature-panel="0">
622              <h3>No integrations necessary.</h3>
623              <p>We solved reliable computer-use at $0 using our computer-use-cache, so Super automates her own apps 
623in the cloud and works out of the box.</p>
624              <div class="service-icons" aria-label="Example apps Super can use">
625                <span class="service-icon"><img class="service-mark" src="https://storage.googleapis.com/cheatlayer/landing/uber-favicon.ico" alt="Uber app logo" width="30" height="30" loading="lazy">Uber</span>
626                <span class="service-icon"><img class="service-mark doordash" src="https://storage.googleapis.com/cheatlayer/landing/doordash-favicon.ico" alt="DoorDash app logo" width="30" height="30" loading="lazy">DoorDash</span>
627                <span class="service-icon"><img class="service-mark starbucks" src="https://storage.googleapis.com/cheatlayer/landing/starbucks-favicon.ico" alt="Starbucks app logo" width="30" height="30" loading="lazy">Starbucks</span>
628              </div>
629              <ul class="feature-list">
630                <li>Order rides, food, and groceries without setup</li>
631                <li>Automate tasks other personal assistants cannot touch</li>
632                <li>Super has her own email, phone, and apps,<br>so you don't have to grant access to your private email or calendar.</li>
633              </ul>
634            </article>
635
636            <article class="feature-panel" data-feature-panel="1">
637              <h3>No required subscription.</h3>
638              <p>Top up Super's wallet and pay as you go, or choose the optional $199 monthly Pro plan when you need higher device and computer-use limits.</p>
639              <ul class="feature-list">
640                <li>Start without a monthly plan</li>
641                <li>Optional Pro through UCP, MPP, or x402</li>
642                <li>No extra cards to track</li>
643              </ul>
644            </article>
645
646            <article class="feature-panel" data-feature-panel="2">
647              <h3>AI for normies.</h3>
648              <p>Super has access to full cloud sandboxes, her own mobile apps, browsers, and 1000+ integrations so she can solve practical tasks end to end.</p>
649              <ul class="feature-list">
650                <li>Automated research and daily reports</li>
651                <li>Generate interactive websites: try a <a href="https://app.getsupers.com/sites/carrier-pigeon-message-simulator/">
651carrier pigeon simulator</a> or <a href="https://app.getsupers.com/sites/festival-setlist-sequencer-31/">festival setlist sequencer</a></li>
652                <li>Automate socials and connected apps</li>
653              </ul>
654            </article>
655
656            <article class="feature-panel" data-feature-panel="3">
657              <h3>Computer-Use Cache For Impossible Agents.</h3>
658              <p>We solved $0 computer-use for repeatable tasks using a model trained on actions, so Super can automate her own apps in the cloud without limits.</p>
659              <ul class="feature-list">
660                <li>Replay reliable app actions without paying per click</li>
661                <li>Train repeatable workflows from successful automations</li>
662                <li>Give agents durable cloud app control at launch scale</li>
663              </ul>
664            </article>
665            <article class="feature-panel" data-feature-panel="4">
666              <h3>Super Mac for auto-building agents</h3>
667              <p>Connect Codex, Claude, and Hermes agent to Super Mac to generate deterministic scripts that improve over time and reduce your repeated costs to $0 with our built-in computer-use cache</p>
668            </article>
669          </div>
670        </div>
671      </div>
672    </section>
673
674    <section class="wall" id="reviews" aria-labelledby="reviews-title">
675      <div class="shell">
676        <div class="wall-layout">
677          <div class="wall-header">
678            <h2 id="reviews-title">What people say about us</h2>
679          </div>
680
681          <div class="review-grid">
682            <article class="review-card featured">
683              <blockquote class="review-quote">"This goes way further than Apple showed."</blockquote>
684              <div class="review-footer">
685                <div class="review-person">
686                  <img class="review-avatar" src="/generated/robert-scoble-avatar.jpg" alt="Robert Scoble X profile photo" width="54" height="54" loading="lazy">
687                  <div>
688                    <span class="review-name">Robert Scoble</span>
689                    <span class="review-handle">@Scobleizer <span class="review-followers">588.8K followers</span></span>
690                  </div>
691                </div>
692                <a class="review-link" href="https://x.com/Scobleizer/status/2064055367320154204" target="_blank" rel="noopener noreferrer">Read on X</a>
693              </div>
694            </article>
695
696            <article class="review-card featured">
697              <blockquote class="review-quote">"Probably the most forward looking demo is an AI agent called Super, which can place Uber and Doordash orders using nothing but voice."</blockquote>
698              <div class="review-footer">
699                <div class="review-person">
700                  <img class="review-avatar" src="https://i.ytimg.com/vi/wGPNqPd1flE/hqdefault.jpg" alt="The Mysticle YouTube video thumbnail discussing Super AI agent demo" width="54" height="54" loading="lazy">
701                  <div>
702                    <span class="review-name">The Mysticle</span>
703                    <span class="review-handle">@TheMysticle <span class="review-followers">223K subscribers</span></span>
704                  </div>
705                </div>
706                <a class="review-link" href="https://www.youtube.com/watch?v=wGPNqPd1flE&t=710s" target="_blank" rel="noopener noreferrer">Watch on YouTube</a>
707              </div>
708            </article>
709
710            <article class="review-card">
711              <blockquote class="review-quote">"Super does something different: it actually completes the task."</blockquote>
712              <div class="review-footer">
713                <div class="review-person">
714                  <img class="review-avatar" src="https://unavatar.io/x/anujcodes_21" alt="Anuj X profile photo" width="54" height="54" loading="lazy">
715                  <div>
716                    <span class="review-name">Anuj</span>
717                    <span class="review-handle">@anujcodes_21 <span class="review-followers">21K followers</span></span>
718                  </div>
719                </div>
720                <a class="review-link" href="https://x.com/anujcodes_21/status/2064030957871780348" target="_blank" rel="noopener noreferrer">Read on X</a>
721              </div>
722            </article>
723
724            <article class="review-card">
725              <blockquote class="review-quote">"The unlock here for me is that it's not another LLM."</blockquote>
726              <div class="review-footer">
727                <div class="review-person">
728                  <img class="review-avatar" src="https://unavatar.io/x/thisiskp_" alt="KP X profile photo" width="54" height="54" loading="lazy">
729                  <div>
730                    <span class="review-name">KP</span>
731                    <span class="review-handle">@thisiskp_ <span class="review-followers">70.4K followers</span></span>
732                  </div>
733                </div>
734                <a class="review-link" href="https://x.com/thisiskp_/status/2064044881992147306" target="_blank" rel="noopener noreferrer">Read on X</a>
735              </div>
736            </article>
737
738            <article class="review-card">
739              <blockquote class="review-quote">"Your assistant can finally leave the chat box."</blockquote>
740              <div class="review-footer">
741                <div class="review-person">
742                  <img class="review-avatar" src="https://unavatar.io/x/FutureStacked" alt="Future Stacked X profile photo" width="54" height="54" loading="lazy">
743                  <div>
744                    <span class="review-name">Future Stacked</span>
745                    <span class="review-handle">@FutureStacked <span class="review-followers">283.1K followers</span></span>
746                  </div>
747                </div>
748                <a class="review-link" href="https://x.com/FutureStacked/status/2064030172228038759" target="_blank" rel="noopener noreferrer">Read on X</a>
749              </div>
750            </article>
751
752            <article class="review-card">
753              <blockquote class="review-quote">"Every AI assistant tells you how to do things. Super actually does them."</blockquote>
754              <div class="review-footer">
755                <div class="review-person">
756                  <img class="review-avatar" src="https://unavatar.io/x/socialwithaayan" alt="Muhammad Ayan X profile photo" width="54" height="54" loading="lazy">
757                  <div>
758                    <span class="review-name">Muhammad Ayan</span>
759                    <span class="review-handle">@socialwithaayan <span class="review-followers">69.3K followers</span></span>
760                  </div>
761                </div>
762                <a class="review-link" href="https://x.com/socialwithaayan/status/2064045078960865595" target="_blank" rel="noopener noreferrer">Read on X</a>
763              </div>
764            </article>
765          </div>
766
767        </div>
768      </div>
769    </section>
770
771
772    <section class="pricing" id="pricing" aria-labelledby="pricing-title">
773      <div class="shell">
774        <div class="pricing-layout">
775          <h2 id="pricing-title">Pricing</h2>
776          <p>Start free, then add a managed device fleet when you need private agents, onboarding, and custom implementation support.</p>
777
778          <div class="pricing-tier-grid">
779            <article class="price-card pricing-tier-card">
780              <div class="price-summary">
781                <h3>Free</h3>
782                <div class="price-amount">$0 <span>to start</span></div>
783                <p class="price-card-copy">Pay as you go with an agent wallet for chat, browser work, cloud code, website previews, orders, and real-world tasks.</p>
784                <a class="pricing-cta" data-signup href="https://app.getsupers.com/general?login=1&open_login=1">Text Super Now</a>
785              </div>
786              <div class="price-included">
787                <ul class="price-features">
788                  <li><span>Pay-as-you-go wallet</span></li>
789                  <li><span>Web, SMS, and app access</span></li>
790                  <li><span>Optional integrations</span></li>
791                </ul>
792              </div>
793            </article>
794
795            <article class="price-card pricing-tier-card" data-tier="devices_10">
796              <div class="price-summary">
797                <h3>10 Devices</h3>
798                <p class="price-card-copy">Automate 10 cloud sandboxes or your private devices</p>
799                <div class="price-amount">$199 <span>/ month</span></div>
800                <p class="price-card-copy">A managed fleet for teams starting with private agents and hands-on implementation.</p>
801                <a class="pricing-cta" data-tier-checkout="devices_10" href="#pricing" aria-disabled="true">Choose 10 Devices</a>
802              </div>
803              <div class="price-included">
804                <ul class="price-features">
805                  <li><span><strong>10 swappable devices</strong></span></li>
806                  <li><span>Access to private agents</span></li>
807                  <li><span>Live onboarding</span></li>
808                  <li><span>Forward-deployed engineering to build custom agents</span></li>
809                </ul>
810              </div>
811            </article>
812
813            <article class="price-card pricing-tier-card" data-tier="devices_100">
814              <div class="price-summary">
815                <h3>100 Devices</h3>
816                <p class="price-card-copy">Automate 100 cloud sandboxes or your private devices</p>
817                <div class="price-amount">$999 <span>/ month</span></div>
818                <p class="price-card-copy">Scale agents across a larger fleet with the same private agent, onboarding, and FDE access.</p>
819                <a class="pricing-cta" data-tier-checkout="devices_100" href="#pricing" aria-disabled="true">Choose 100 Devices</a>
820              </div>
821              <div class="price-included">
822                <ul class="price-features">
823                  <li><span><strong>100 swappable devices</strong></span></li>
824                  <li><span>Access to private agents</span></li>
825                  <li><span>Live onboarding</span></li>
826                  <li><span>Forward-deployed engineering to build custom agents</span></li>
827                </ul>
828              </div>
829            </article>
830          </div>
831        </div>
832      </div>
833    </section>
834
835    <section class="compare" id="developers" aria-labelledby="developers-title">
836      <div class="shell">
837        <div class="compare-header">
838          <h2 id="developers-title">Connect your agent to Super.</h2>
839          <p>Add Super to your MCP client, or bring your own computer online with the CLI.</p>
840        </div>
841        <div class="developer-code-grid developer-code-card">
842          <div class="developer-code-tabs" role="tablist" aria-label="Connection method">
843            <button type="button" id="super-mcp-tab" role="tab" aria-selected="true" aria-controls="super-mcp-panel">Hosted MCP</button>
844            <button type="button" id="super-cli-tab" role="tab" aria-selected="false" aria-controls="super-cli-panel" tabindex="-1">Desktop CLI</button>
845          </div>
846          <div class="developer-code-panel" id="super-mcp-panel" role="tabpanel" aria-labelledby="super-mcp-tab">
847            <div class="developer-code-bar"><h3>Hosted MCP</h3><button type="button" data-copy-code="super-mcp-code" aria-label="Copy MCP configuration">Copy</button></div>
848            <pre tabindex="0" aria-label="MCP configuration"><code id="super-mcp-code">{
849  "mcpServers": {
850    "super": {
851      "url": "https://app.getsupers.com/mcp"
852    }
853  }
854}</code></pre>
855            <p>For clients supporting remote HTTP MCP and this JSON configuration format. Complete Super sign-in through your client's OAuth flow.</p>
856            <a href="/developers/mcp">
856MCP setup guide</a>
857          </div>
858          <div class="developer-code-panel" id="super-cli-panel" role="tabpanel" aria-labelledby="super-cli-tab" hidden>
859            <div class="developer-code-bar"><h3>Desktop CLI</h3><button type="button" data-copy-code="super-cli-code" aria-label="Copy CLI commands">Copy</button></div>
860            <pre tabindex="0" aria-label="CLI commands"><code id="super-cli-code">npm install -g superpowers-ai
861superpowers login</code></pre>
862            <p>Requires Node.js and npm. Sign in with your email or phone, then open the private control link. Use <code>superpowers start</code> to start again later.</p>
863            <a href="/developers/cli">CLI setup guide</a>
864          </div>
865        </div>
866        <p class="developer-code-footer"><a href="/developers/">Explore the developer portal</a><span id="developer-copy-status" role="status" aria-live="polite"></span></p>
867      </div>
868    </section>
869
870    <section class="launch-news" id="news" aria-labelledby="news-title">
871      <div class="shell">
872        <h2 id="news-title">News</h2>
873        <div class="launch-news-grid">
874          <article class="launch-news-story" id="news-computer-use-cache">
875            <p class="launch-news-date">Open-source launch &middot; <time datetime="2026-06-08">June 8, 2026</time></p>
876            <h3>SuperPowers AI open-sources Computer-Use Cache</h3>
877            <video class="launch-news-video" controls playsinline preload="none" poster="/news-cache-poster.jpg" aria-label="SuperPowers AI Computer-Use Cache second launch video">
878              <source src="https://storage.googleapis.com/cheatlayer/landing/hero-0607-2-3.mp4" type="video/mp4">
879              <a href="https://storage.googleapis.com/cheatlayer/landing/hero-0607-2-3.mp4">Watch the second launch video</a>
880            </video>
881            <p>SuperPowers AI has released Computer-Use Cache, an MIT-licensed, OpenAI-compatible proxy designed to reduce the model cost of repeated agent workflows.</p>
882            <p>Instead of sending the same request to a model again, the cache stores successful responses and replays exact repeated requests. Cache misses still go to the upstream provider. Developers can use it for repeated browser, coding, and tool workflows, with setup options for Codex, Claude Code, Cursor, OpenClaw, and Hermes.</p>
883            <p>The release makes a practical idea available to developers: pay for new reasoning when it is needed, and reuse work when the request repeats. Cache hits avoid another upstream model call; other execution and infrastructure costs may still apply.</p>
884            <p>Interest in reliable, lower-cost automation is growing across the industry. In a separate announcement on June 10, 2026, Poetic reported a $50 million Series A for enterprise process automation. Its focus on software that combines AI learning with code-like execution reflects a related ambition, not evidence of identical technology.</p>
885            <div class="launch-news-links">
886              <a href="https://x.com/RohanArun/status/2064014542997459109">Read our launch announcement on X</a>
887            </div>
888          </article>
889          <article class="launch-news-story" id="news-first-launch">
890            <p class="launch-news-date">Product Hunt launch &middot; March 6, 2026</p>
891            <h3>SuperPowers AI earns #2 Product of the Day</h3>
892            <video class="launch-news-video" controls playsinline preload="none" poster="/news-launch-poster.jpg" aria-label="SuperPowers AI first launch video">
893              <source src="/superpowers-launch-faststart.mp4" type="video/mp4">
894              <a href="https://app.getsupers.com/growth/superpowers-ai-open-claw-wearables.mp4">Watch the launch video</a>
895            </video>
896            <p>SuperPowers AI launched with a vision for real-time visual agents on phones and wearables, earning #2 Product of the Day on Product Hunt on March 6, 2026.</p>
897            <p>The launch introduced a different way to interact with AI: bring an agent into the context of what you are doing, rather than stopping to de
897scribe everything in a chat box. The original launch video shows that vision in action.</p>
898            <p>The first launch established the product direction. Computer-Use Cache extends it by addressing the cost of repeating work, giving developers an open-source building block for reusable agent workflows.</p>
899            <div class="launch-news-links">
900              <a href="https://www.producthunt.com/products/superpowers-ai-2">View the Product Hunt launch</a>
901            </div>
902          </article>
903        </div>
904      </div>
905    </section>
906
907    <section class="faq" id="faq" aria-labelledby="faq-title">
908      <div class="shell">
909        <div class="faq-grid">
910          <div class="faq-title">
911            <h2 id="faq-title">FAQ</h2>
912          </div>
913          <div class="faq-list" data-faq-list></div>
914        </div>
915      </div>
916    </section>
917  </main>
918
919  <footer class="footer">
920    <div class="shell">
921      <div class="footer-panel">
922        <div class="footer-top">
923          <div class="footer-columns" aria-label="Footer links">
924            <div class="footer-column">
925              <a href="https://app.getsupers.com/general?login=1&open_login=1">Sign up</a>
926              <a href="#pricing">Pricing</a>
927              <a href="/vs/chatgpt/">
927Super vs ChatGPT</a>
928              <a href="/vs/poke/">Super vs Poke</a>
929              <a href="/vs/comet/">Super vs Comet</a>
930              <a href="https://app.getsupers.com/humans">Jobs</a>
931              <a href="/developers/">Developer portal</a>
932              <a href="/developers/api-lifecycle">API lifecycle</a>
933              <a href="https://app.getsupers.com/docs">Product docs</a>
934              <a class="footer-app-link" href="https://apps.apple.com/us/app/super-real-time-ai-assistant/id6758969961" target="_blank" rel="noopener noreferrer"><span class="footer-app-icon" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none"><path d="M9 3.5h6A2.5 2.5 0 0 1 17.5 6v12a2.5 2.5 0 0 1-2.5 2.5H9A2.5 2.5 0 0 1 6.5 18V6A2.5 2.5 0 0 1 9 3.5Z" stroke="currentColor" stroke-width="1.8"/><path d="M10.5 6h3" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/><path d="M11.5 18h1" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg></span>iOS app <span class="footer-app-count">2,000+ users</span></a>
935              <a class="footer-app-link" href="https://chromewebstore.google.com/detail/superpowers-ai/oolmdenpaebkcokkccakmlmhcpnogalc" target="_blank" rel="noopener noreferrer"><span class="footer-app-icon" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none"><path d="M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" stroke="currentColor" stroke-width="1.8"/><path d="M12 21 8.1 12M20 8H10.2M4 8h6.2L12 12" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/><path d="M15.2 12a3.2 3.2 0 1 1-6.4 0 3.2 3.2 0 0 1 6.4 0Z" stroke="currentColor" stroke-width="1.8"/></svg></span>Chrome extension <span class="footer-app-count">8,000+ users</span></a>
936              <a class="footer-app-link" href="https://storage.googleapis.com/cheatlayer/SuperPowersMac.dmg" target="_blank" rel="noopener noreferrer"><span class="footer-app-icon" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none"><path d="M5 5.5h14A1.5 1.5 0 0 1 20.5 7v8A1.5 1.5 0 0 1 19 16.5H5A1.5 1.5 0 0 1 3.5 15V7A1.5 1.5 0 0 1 5 5.5Z" stroke="currentColor" stroke-width="1.8"/><path d="M8 20h8M10 16.5 9.2 20M14 16.5l.8 3.5" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg></span>Mac app</a>
937              <a class="footer-app-link" href="/meta-display/"><span class="footer-app-icon" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none"><path d="M4 12.5c.7-2.7 2.1-4 4.2-4h1.3c1.1 0 1.9.4 2.5 1.2.6-.8 1.4-1.2 2.5-1.2h1.3c2.1 0 3.5 1.3 4.2 4l.5 2.1c.3 1.3-.7 2.4-2 2.4h-2.7c-1.2 0-2.2-.8-2.5-1.9l-.4-1.5h-1.8l-.4 1.5c-.3 1.1-1.3 1.9-2.5 1.9H5.5c-1.3 0-2.3-1.1-2-2.4l.5-2.1Z" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round"/><path d="M10.9 13.6h2.2" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/></svg></span>Meta Display</a>
938            </div>
939            <div class="footer-column">
940              <a href="/about">About SuperPowers AI</a>
941              <a href="/contact">Contact</a>
942              <a href="#faq">FAQ</a>
943              <a href="/privacy">Privacy policy</a>
944              <a href="https://app.getsupers.com/terms">Terms of service</a>
945            </div>
946            <div class="footer-column">
947              <a href="https://x.com/Super_Powers_AI">X <span class="social-count">4,053 members</span></a>
948              <a href="https://github.com/rohanarun/phoneclaw" target="_blank" rel="noopener noreferrer">GitHub <span class="github-stars" data-github-stars>537 stars</span></a>
949              <a href="https://discord.gg/supers">Discord <span class="social-count">2,070 members</span></a>
950            </div>
951          </div>
952          <div class="footer-brand">Super</div>
953        </div>
954        <div class="footer-bottom">
955          <span>© 2026 SuperPowers AI</span>
956          <span>Made with ❤️ in San Francisco</span>
957          <span class="footer-signoff">Apps are a vestige of the mobile era.</span>
958        </div>
959      </div>
960    </div>
961  </footer>
962
963  <aside class="ios-app-suggestion" data-ios-app-suggestion aria-label="Super iPhone app">
964    <img src="https://storage.googleapis.com/cheatlayer/landing/icon-transparent-180.png" alt="Super app icon" width="44" height="44">
965    <span class="ios-app-suggestion-copy"><strong>Take Super with you</strong><span>The iPhone app adds voice and mobile actions.</span></span>
966    <a class="ios-app-suggestion-link" href="https://apps.apple.com/us/app/super-real-time-ai-assistant/id6758969961" target="_blank" rel="noopener noreferrer">View app</a>
967    <button class="ios-app-suggestion-close" data-ios-app-close type="button" aria-label="Dismiss app suggestion">&times;</button>
968  </aside>
969
970  
970<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/gsap.min.js"></script>
970
971  
971<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/ScrollTrigger.min.js"></script>
971
972  
972<script src="/html2canvas.1.4.1.min.js"></script>
972
973  
973<script src="/webmcp.js" defer></script>
973
974  
974<script>
975    (function () {
976      var tabs = Array.from(document.querySelectorAll('.developer-code-tabs [role="tab"]'));
977      function activate(tab) {
978        tabs.forEach(function (item) {
979          var selected = item === tab;
980          item.setAttribute('aria-selected', String(selected));
981          item.tabIndex = selected ? 0 : -1;
982          document.getElementById(item.getAttribute('aria-controls')).hidden = !selected;
983        });
984        document.getElementById('developer-copy-status').textContent = '';
985      }
986      tabs.forEach(function (tab, index) {
987        tab.addEventListener('click', function () { activate(tab); });
988        tab.addEventListener('keydown', function (event) {
989          var next;
990          if (event.key === 'ArrowRight') next = (index + 1) % tabs.length;
991          else if (event.key === 'ArrowLeft') next = (index + tabs.length - 1) % tabs.length;
992          else if (event.key === 'Home') next = 0;
993          else if (event.key === 'End') next = tabs.length - 1;
994          else return;
995          event.preventDefault();
996          activate(tabs[next]);
997          tabs[next].focus();
998        });
999      });
1000    })();
1001    document.querySelectorAll('[data-copy-code]').forEach(function (button) {
1002      button.addEventListener('click', async function () {
1003        var code = document.getElementById(button.dataset.copyCode);
1004        var status = document.getElementById('developer-copy-status');
1005        try {
1006          await navigator.clipboard.writeText(code.textContent);
1007          status.textContent = button.dataset.copyCode === 'super-mcp-code' ? 'MCP configuration copied.' : 'CLI commands copied.';
1008        } catch (error) {
1009          var selection = window.getSelection();
1010          var range = document.createRange();
1011          range.selectNodeContents(code);
1012          selection.removeAllRanges();
1013          selection.addRange(range);
1014          status.textContent = 'Select and copy the highlighted code.';
1015        }
1016      });
1017    });
1018  </script>
1018
1019  
1019<script src="/landing.920a3c36cc.min.js" defer></script>
1019
1020  
1020<script>
1021    (function () {
1022      var generator = document.querySelector('[data-tool-generator]');
1023      var form = document.querySelector('[data-tool-form]');
1024      var input = document.querySelector('[data-tool-input]');
1025      var submit = document.querySelector('[data-tool-submit]');
1026      var frame = document.querySelector('[data-tool-frame]');
1027      var preview = document.querySelector('[data-tool-preview]');
1028      var toolStage = document.querySelector('[data-tool-stage]');
1029      var webglCanvas = document.querySelector('[data-tool-webgl]');
1030      var textureVideo = document.querySelector('[data-tool-texture-video]');
1031      var sharePanel = document.querySelector('[data-tool-share]');
1032      var shareButton = document.querySelector('[data-tool-share-button]');
1033      var siteLink = document.querySelector('[data-tool-site-link]');
1034      var recentPanel = document.querySelector('[data-tool-recents]');
1035      var recentList = document.querySelector('[data-tool-recent-list]');
1036      var totalSitesMetric = document.querySelector('[data-tool-total-sites]');
1037      var quickPromptsContainer = document.querySelector('[data-tool-prompts]');
1038      var quickPromptCount = quickPromptsContainer
1039        ? quickPromptsContainer.querySelectorAll('[data-tool-question]').length
1040        : 0;
1041      var status = document.querySelector('[data-tool-status]');
1042      var iosSuggestion = document.querySelector('[data-ios-app-suggestion]');
1043      var iosClose = document.querySelector('[data-ios-app-close]');
1044      var navSentinel = document.querySelector('[data-tool-nav-sentinel]');
1045      var activeController = null;
1046      var generationSequence = 0;
1047      var AUTHORITATIVEDATA = '';
1048      var FINALDATA = '';
1049      var publishedSiteUrl = '';
1050      var publishedSiteTitle = '';
1051      var authoritativeCaptureTimer = 0;
1052      var authoritativeCaptureRequested = false;
1053      var authoritativeCaptureInFlight = false;
1054      var authoritativePreviewTimer = 0;
1055      var authoritativePreviewHTML = '';
1056      var authoritativePreviewRevision = 0;
1057      var authoritativePreviewLoad = Promise.resolve();
1058      var navFrame = 0;
1059      var textureCanvas = document.createElement('canvas');
1060      var authoritativeTextureCanvas = document.createElement('canvas');
1061      var authoritativeTextureMirrorFrame = createTextureMirrorFrame('gemini');
1062      var webglState = null;
1063      var lastWebGLFrame = 0;
1064      var textureProgress = 0;
1065      var targetTextureProgress = 0;
1066      var textureVersion = 0;
1067      var authoritativeTextureVersion = 0;
1068      var authoritativeTextureReady = false;
1069      var authoritativeTextureMix = 0;
1070      var targetAuthoritativeTextureMix = 0;
1071      var authoritativeDataProgress = 0;
1072      var authoritativeAssemblyStarted = false;
1073      var TILE_COUNT = 240000;
1074      var AUTHORITATIVE_TEXTURE_CHARACTER_TARGET = 30000;
1075      var TAILWIND_RUNTIME_URL = String(generator.getAttribute('data-tailwind-runtime') || '').trim();
1076
1077      function compileShader(gl, type, source) {
1078        var shader = gl.createShader(type);
1079        gl.shaderSource(shader, source);
1080        gl.compileShader(shader);
1081        if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
1082          gl.deleteShader(shader);
1083          return null;
1084        }
1085        return shader;
1086      }
1087
1088      function initWebGL() {
1089        if (!webglCanvas) return;
1090        var gl = webglCanvas.getContext('webgl2', {alpha: true, antialias: false, powerPreference: 'high-performance'});
1091        if (!gl) {
1092          webglCanvas.classList.add('is-unavailable');
1093          return;
1094        }
1095        var vertexSource = [
1096          '#version 300 es',
1097          'precision highp float;',
1098          'uniform vec2 uGrid;',
1099          'uniform vec2 uViewport;',
1100          'uniform float uProgress;',
1101          'uniform float uTime;',
1102          'uniform float uLoadingMode;',
1103          'uniform float uLoadingCount;',
1104          'out vec2 vUv;',
1105          'out float vAlpha;',
1106          'out float vShade;',
1107          'out float vSettled;',
1108          'out float vLoading;',
1109          'uint hashBits(uint value){value^=value>>16;value*=0x7feb352du;value^=value>>15;value*=0x846ca68bu;value^=value>>16;return value;}',
1110          'float hash(uint value){return float(hashBits(value))/4294967295.0;}',
1111          'void main(){',
1112          '  uint particleId=uint(gl_VertexID);',
1113          '  if(uLoadingMode>0.5){',
1114          '    float loadingIndex=float(particleId);',
1115          '    float count=max(uLoadingCount,1.0);',
1116          '    float unit=loadingIndex/count;',
1117          '    float turn=unit*18.8495559-uTime*2.35;',
1118          '    float wave=sin(unit*37.6991118+uTime*3.1);',
1119          '    float radius=0.062+wave*0.010;',
1120          '    float aspect=uViewport.y/max(uViewport.x,1.0);',
1121          '    vec2 orbit=vec2(cos(turn)*radius*aspect,sin(turn)*radius);',
1122          '    gl_Position=vec4(orbit,0.0,1.0);',
1123          '    gl_PointSize=max(1.5,min(uViewport.x,uViewport.y)*mix(0.0022,0.0042,0.5+0.5*wave));',
1124          '    vUv=vec2(0.5);',
1125          '    vAlpha=0.28+0.72*pow(0.5+0.5*sin(turn+uTime*1.7),2.0);',
1126          '    vShade=unit;',
1127          '    vSettled=1.0;',
1128          '    vLoading=1.0;',
1129          '    return;',
1130          '  }',
1131          '  float tileId=float(particleId);',
1132          '  float column=mod(tileId,uGrid.x);',
1133          '  float row=floor(tileId/uGrid.x);',
1134          '  vec2 cell=vec2(column,row);',
1135          '  vec2 finalCenter=vec2(((column+0.5)/uGrid.x)*2.0-1.0,1.0-((row+0.5)/uGrid.y)*2.0);',
1136          '  float seed=hash(particleId+1u);',
1137          '  float verticalSeed=hash(particleId+317u);',
1138          '  float motionSeed=hash(particleId+1907u);',
1139          '  float motionVerticalSeed=hash(particleId+4099u);',
1140          '  float order=mix(row/max(uGrid.y-1.0,1.0),seed,0.34);',
1141          '  float startAt=order*0.72;',
1142          '  float pathProgress=smoothstep(startAt,min(1.0,startAt+0.28),uProgress);',
1143          '  float startY=min(1.05,finalCenter.y+mix(0.18,1.10,verticalSeed));',
1144          '  vec2 randomCenter=vec2(mix(-1.08,1.08,seed),startY);',
1145          '  vec2 randomMotion=vec2(sin(uTime*(0.55+motionSeed)+motionSeed*31.0),cos(uTime*(0.42+motionVerticalSeed)+motionVerticalSeed*29.0))*0.055;',
1146          '  randomCenter+=randomMotion*(1.0-pathProgress);',
1147          '  vec2 center=mix(randomCenter,finalCenter,pathProgress);',
1148          '  center.x+=sin(seed*12.0+pathProgress*9.0)*(1.0-pathProgress)*0.10;',
1149          '  gl_Position=vec4(center,0.0,1.0);',
1150          '  vec2 cellPixels=uViewport/max(uGrid,vec2(1.0));',
1151          '  float settledPointSize=sqrt(max(cellPixels.x*cellPixels.y,1.0));',
1152          '  float floatingPointSize=max(1.0,settledPointSize*0.34);',
1153          '  gl_PointSize=mix(floatingPointSize,settledPointSize,pathProgress);',
1154          '  vUv=(cell+vec2(0.5))/uGrid;',
1155          '  vAlpha=mix(0.24,1.0,smoothstep(0.0,0.08,pathProgress));',
1156          '  float rightSideDarken=smoothstep(0.50,1.0,seed)*0.16;',
1157          '  vShade=clamp(hash(particleId+911u)-rightSideDarken,0.0,1.0);',
1158          '  vSettled=pathProgress;',
1159          '  vLoading=0.0;',
1160          '}'
1161        ].join('\n');
1162        var fragmentSource = [
1163          '#version 300 es',
1164          'precision mediump float;',
1165          'uniform sampler2D uTexture;',
1166          'uniform sampler2D uAuthoritativeTexture;',
1167          'uniform float uTextureMix;',
1168          'in vec2 vUv;',
1169          'in float vAlpha;',
1170          'in float vShade;',
1171          'in float vSettled;',
1172          'in float vLoading;',
1173          'out vec4 outColor;',
1174          'void main(){',
1175          '  if(vLoading>0.5){',
1176          '    vec2 particleCoord=gl_PointCoord-vec2(0.5);',
1177          '    float particleDistance=dot(particleCoord,particleCoord);',
1178          '    if(particleDistance>0.25) discard;',
1179          '    float particleEdge=1.0-smoothstep(0.13,0.25,particleDistance);',
1180          '    vec3 loadingColor=vec3(mix(0.08,0.34,vShade));',
1181          '    outColor=vec4(loadingColor,vAlpha*particleEdge);',
1182          '    return;',
1183          '  }',
1184          '  vec3 fastSample=texture(uTexture,clamp(vUv,0.0,1.0)).rgb;',
1185          '  vec3 authoritativeSample=texture(uAuthoritativeTexture,clamp(vUv,0.0,1.0)).rgb;',
1186          '  float textureBlend=uTextureMix*uTextureMix*(3.0-2.0*uTextureMix);',
1187          '  vec3 sampled=mix(fastSample,authoritativeSample,textureBlend);',
1188          '  float particleShade=mix(0.22+vShade*0.28,0.98+vShade*0.02,vSettled);',
1189          '  outColor=vec4(sampled*particleShade,vAlpha);',
1190          '}'
1191        ].join('\n');
1192        var vertex = compileShader(gl, gl.VERTEX_SHADER, vertexSource);
1193        var fragment = compileShader(gl, gl.FRAGMENT_SHADER, fragmentSource);
1194        if (!vertex || !fragment) {
1195          webglCanvas.classList.add('is-unavailable');
1196          return;
1197        }
1198        var program = gl.createProgram();
1199        gl.attachShader(program, vertex);
1200        gl.attachShader(program, fragment);
1201        gl.linkProgram(program);
1202        if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
1203          webglCanvas.classList.add('is-unavailable');
1204          return;
1205        }
1206        gl.useProgram(program);
1207        var vertexArray = gl.createVertexArray();
1208        gl.bindVertexArray(vertexArray);
1209        var texture = gl.createTexture();
1210        gl.activeTexture(gl.TEXTURE0);
1211        gl.bindTexture(gl.TEXTURE_2D, texture);
1212        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
1213        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
1214        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
1215        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
1216        gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 1, 1, 0, gl.RGBA, gl.UNSIGNED_BYTE, new Uint8Array([255,255,255,255]));
1217        gl.uniform1i(gl.getUniformLocation(program, 'uTexture'), 0);
1218        var authoritativeTexture = gl.createTexture();
1219        gl.activeTexture(gl.TEXTURE1);
1220        gl.bindTexture(gl.TEXTURE_2D, authoritativeTexture);
1221        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
1222        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
1223        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
1224        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
1225        gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 1, 1, 0, gl.RGBA, gl.UNSIGNED_BYTE, new Uint8Array([255,255,255,255]));
1226        gl.uniform1i(gl.getUniformLocation(program, 'uAuthoritativeTexture'), 1);
1227        gl.activeTexture(gl.TEXTURE0);
1228        gl.enable(gl.BLEND);
1229        gl.blendFuncSeparate(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.ONE, gl.ONE_MINUS_SRC_ALPHA);
1230        webglState = {
1231          gl: gl,
1232          vertexArray: vertexArray,
1233          texture: texture,
1234          authoritativeTexture: authoritativeTexture,
1235          grid: gl.getUniformLocation(program, 'uGrid'),
1236          viewport: gl.getUniformLocation(program, 'uViewport'),
1237          progress: gl.getUniformLocation(program, 'uProgress'),
1238          time: gl.getUniformLocation(program, 'uTime'),
1239          loadingMode: gl.getUniformLocation(program, 'uLoadingMode'),
1240          loadingCount: gl.getUniformLocation(program, 'uLoadingCount'),
1241          textureMix: gl.getUniformLocation(program, 'uTextureMix'),
1242          uploadedTextureVersion: -1,
1243          uploadedAuthoritativeTextureVersion: -1
1244        };
1245        textureCanvas.width = 2;
1246        textureCanvas.height = 2;
1247        authoritativeTextureCanvas.width = 2;
1248        authoritativeTextureCanvas.height = 2;
1249        window.requestAnimationFrame(drawWebGL);
1250      }
1251
1252      function selectTileGrid(width, height) {
1253        var targetRatio = Math.max(width, 1) / Math.max(height, 1);
1254        var columns = Math.max(1, Math.round(Math.sqrt(TILE_COUNT * targetRatio)));
1255        var rows = Math.max(1, Math.ceil(TILE_COUNT / columns));
1256        return [columns, rows];
1257      }
1258
1259      function createTextureMirrorFrame(kind) {
1260        var mirrorFrame = document.createElement('iframe');
1261        mirrorFrame.setAttribute('aria-hidden', 'true');
1262        mirrorFrame.setAttribute('tabindex', '-1');
1263        mirrorFrame.setAttribute('sandbox', 'allow-same-origin allow-scripts');
1264        mirrorFrame.setAttribute('data-tool-texture-mirror', kind);
1265        mirrorFrame.srcdoc = '<!doctype html><html><head></head><body></body></html>';
1266        mirrorFrame.style.cssText = 'position:fixed;left:-200vw;top:0;width:2px;height:2px;border:0;pointer-events:none;z-index:-1';
1267        document.body.appendChild(mirrorFrame);
1268        return mirrorFrame;
1269      }
1270
1271      function ensureTextureMirrorTailwind(mirrorDocument, onReady) {
1272        if (!mirrorDocument || !mirrorDocument.head || !mirrorDocument.body) return null;
1273        var existingRuntime = mirrorDocument.head.querySelector('[data-tool-tailwind-runtime]');
1274        if (existingRuntime) {
1275          if (existingRuntime.getAttribute('data-tool-tailwind-ready') === 'true') return existingRuntime;
1276          if (onReady && existingRuntime.getAttribute('data-tool-tailwind-waiting') !== 'true') {
1277            existingRuntime.setAttribute('data-tool-tailwind-waiting', 'true');
1278            existingRuntime.addEventListener('load', function () {
1279              existingRuntime.removeAttribute('data-tool-tailwind-waiting');
1280              existingRuntime.setAttribute('data-tool-tailwind-ready', 'true');
1281              onReady();
1282            }, {once: true});
1283          }
1284          return existingRuntime;
1285        }
1286        var runtime = mirrorDocument.createElement('script');
1287        runtime.setAttribute('data-tool-tailwind-runtime', '');
1288        if (onReady) runtime.setAttribute('data-tool-tailwind-waiting', 'true');
1289        runtime.src = TAILWIND_RUNTIME_URL;
1290        runtime.defer = true;
1291        runtime.addEventListener('load', function () {
1292          runtime.removeAttribute('data-tool-tailwind-waiting');
1293          runtime.setAttribute('data-tool-tailwind-ready', 'true');
1294          if (onReady) onReady();
1295        });
1296        mirrorDocument.head.appendChild(runtime);
1297        return runtime;
1298      }
1299
1300      function syncTextureMirror(mirrorFrame, source, width, height, onTailwindReady) {
1301        var mirrorDocument = mirrorFrame && mirrorFrame.contentDocument;
1302        if (!mirrorDocument || !mirrorDocument.head || !mirrorDocument.body) return null;
1303        var viewportWidth = Math.max(2, Math.round(width));
1304        var viewportHeight = Math.max(2, Math.round(height));
1305        var parsed = new DOMParser().parseFromString(source || '<!doctype html><html><body></body></html>', 'text/html');
1306        Array.prototype.slice.call(mirrorDocument.head.querySelectorAll('[data-tool-stream-style],[data-tool-mirror-guard]')).forEach(function (node) {
1307          node.remove();
1308        });
1309        Array.prototype.slice.call(parsed.querySelectorAll('style')).forEach(function (sourceStyle) {
1310          var clonedStyle = sourceStyle.cloneNode(true);
1311          clonedStyle.setAttribute('data-tool-stream-style', '');
1312          mirrorDocument.head.appendChild(clonedStyle);
1313        });
1314        var mirrorGuard = mirrorDocument.createElement('style');
1315        mirrorGuard.setAttribute('data-tool-mirror-guard', '');
1316        mirrorGuard.textContent = [
1317          'html{box-sizing:border-box;width:100%!important;height:100%!important;overflow:hidden!important}',
1318          'body[data-tool-capture-body]{box-sizing:border-box!important;width:' + viewportWidth + 'px!important;height:' + viewportHeight + 'px!important;min-height:' + viewportHeight + 'px!important;max-height:' + viewportHeight + 'px!important;overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior:none!important;scrollbar-width:none!important}',
1319          'body[data-tool-capture-body]::-webkit-scrollbar{display:none!important}'
1320        ].join('');
1321        mirrorDocument.head.appendChild(mirrorGuard);
1322        mirrorDocument.body.setAttribute('data-tool-capture-body', '');
1323        Array.prototype.slice.call(parsed.body.querySelectorAll('script,iframe,object,embed')).forEach(function (node) {
1324          node.remove();
1325        });
1326        Array.prototype.slice.call(parsed.body.querySelectorAll('*')).forEach(function (node) {
1327          Array.prototype.slice.call(node.attributes || []).forEach(function (attribute) {
1328            if (/^on/i.test(attribute.name)) node.removeAttribute(attribute.name);
1329          });
1330        });
1331        mirrorDocument.body.innerHTML = parsed.body.innerHTML;
1332        var tailwindRuntime = ensureTextureMirrorTailwind(mirrorDocument, onTailwindReady);
1333        mirrorDocument.body.dataset.tailwindReady = String(
1334          !!tailwindRuntime && tailwindRuntime.getAttribute('data-tool-tailwind-ready') === 'true'
1335        );
1336        mirrorFrame.style.width = viewportWidth + 'px';
1337        mirrorFrame.style.height = viewportHeight + 'px';
1338        mirrorDocument.documentElement.style.width = viewportWidth + 'px';
1339        mirrorDocument.documentElement.style.height = viewportHeight + 'px';
1340        mirrorDocument.body.getBoundingClientRect();
1341        var bottomScrollTop = Math.max(0, mirrorDocument.body.scrollHeight - mirrorDocument.body.clientHeight);
1342        mirrorDocument.body.scrollTop = bottomScrollTop;
1343        mirrorDocument.body.dataset.captureScrollTop = String(mirrorDocument.body.scrollTop);
1344        mirrorDocument.body.dataset.captureScrollHeight = String(mirrorDocument.body.scrollHeight);
1345        mirrorDocument.body.dataset.captureClientHeight = String(mirrorDocument.body.clientHeight);
1346        return mirrorDocument.body;
1347      }
1348
1349      function hasRenderableStreamHTML(source) {
1350        var cleaned = cleanGeneratedHTML(source);
1351        if (!/<(?:body|main|section|article|div|canvas|svg|form|button|h1|h2|p|input|select|textarea)\b/i.test(cleaned)) return false;
1352        var parsed = new DOMParser().parseFromString(cleaned, 'text/html');
1353        var body = parsed && parsed.body;
1354        if (!body) return false;
1355        if (String(body.textContent || '').trim()) return true;
1356        return !!body.querySelector('canvas,svg,img,video,input,button,select,textarea');
1357      }
1358
1359      function drawWebGL(now) {
1360        if (!webglState || !webglCanvas || !preview) return;
1361        if (!generator.classList.contains('is-active') || (now || 0) - lastWebGLFrame < 33) {
1362          window.requestAnimationFrame(drawWebGL);
1363          return;
1364        }
1365        lastWebGLFrame = now || 0;
1366        var gl = webglState.gl;
1367        var bounds = (toolStage || preview).getBoundingClientRect();
1368        var scale = Math.min(window.devicePixelRatio || 1, 1.5);
1369        var width = Math.max(2, Math.round(bounds.width * scale));
1370        var height = Math.max(2, Math.round(bounds.height * scale));
1371        if (webglCanvas.width !== width || webglCanvas.height !== height) {
1372          webglCanvas.width = width;
1373          webglCanvas.height = height;
1374          gl.viewport(0, 0, width, height);
1375        }
1376        textureProgress += (targetTextureProgress - textureProgress) * 0.12;
1377        if (Math.abs(targetTextureProgress - textureProgress) < 0.0001) textureProgress = targetTextureProgress;
1378        authoritativeTextureMix += (targetAuthoritativeTextureMix - authoritativeTextureMix) * 0.45;
1379        if (Math.abs(targetAuthoritativeTextureMix - authoritativeTextureMix) < 0.0001) authoritativeTextureMix = targetAuthoritativeTextureMix;
1380        webglCanvas.dataset.assemblyProgress = textureProgress.toFixed(4);
1381        webglCanvas.dataset.assemblyTarget = String(targetTextureProgress);
1382        webglCanvas.dataset.authoritativeBlend = authoritativeTextureMix.toFixed(4);
1383        webglCanvas.dataset.textureSource = authoritativeTextureMix >= 0.999 ? 'gemini-3.7' : (authoritativeTextureMix > 0 ? 'crossfade' : 'waiting');
1384        var hasCapturedTexture = textureCanvas.width > 2 && textureCanvas.height > 2;
1385        if (hasCapturedTexture && webglState.uploadedTextureVersion !== textureVersion) {
1386          try {
1387            gl.activeTexture(gl.TEXTURE0);
1388            gl.bindTexture(gl.TEXTURE_2D, webglState.texture);
1389            gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false);
1390            gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, textureCanvas);
1391            webglState.uploadedTextureVersion = textureVersion;
1392            webglCanvas.dataset.textureWidth = String(textureCanvas.width);
1393            webglCanvas.dataset.textureHeight = String(textureCanvas.height);
1394            webglCanvas.dataset.textureUploaded = 'true';
1395            generator.classList.add('texture-ready');
1396          } catch (_error) {
1397            webglCanvas.dataset.textureUploaded = 'false';
1398            generator.classList.remove('texture-ready');
1399          }
1400        }
1401        if (authoritativeTextureReady && webglState.uploadedAuthoritativeTextureVersion !== authoritativeTextureVersion) {
1402          try {
1403            gl.activeTexture(gl.TEXTURE1);
1404            gl.bindTexture(gl.TEXTURE_2D, webglState.authoritativeTexture);
1405            gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false);
1406            gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, authoritativeTextureCanvas);
1407            webglState.uploadedAuthoritativeTextureVersion = authoritativeTextureVersion;
1408            webglCanvas.dataset.authoritativeTextureVersion = String(authoritativeTextureVersion);
1409            webglCanvas.dataset.authoritativeTextureUploaded = 'true';
1410            generator.classList.add('texture-ready');
1411          } catch (_error) {
1412            webglCanvas.dataset.authoritativeTextureUploaded = 'false';
1413          } finally {
1414            gl.activeTexture(gl.TEXTURE0);
1415          }
1416        }
1417        var grid = selectTileGrid(width, height);
1418        gl.clearColor(0, 0, 0, 0);
1419        gl.clear(gl.COLOR_BUFFER_BIT);
1420        gl.bindVertexArray(webglState.vertexArray);
1421        gl.uniform2f(webglState.grid, grid[0], grid[1]);
1422        gl.uniform2f(webglState.viewport, width, height);
1423        gl.uniform1f(webglState.progress, textureProgress);
1424        gl.uniform1f(webglState.time, (now || 0) / 1000);
1425        gl.uniform1f(webglState.textureMix, authoritativeTextureMix);
1426        gl.uniform1f(webglState.loadingMode, 0);
1427        gl.drawArrays(gl.POINTS, 0, TILE_COUNT);
1428        var loadingActive = generator.getAttribute('aria-busy') === 'true' && !generator.classList.contains('has-output');
1429        if (loadingActive) {
1430          var loadingParticleCount = Math.max(96, Math.min(320, Math.round(Math.min(width, height) * 0.18)));
1431          gl.uniform1f(webglState.loadingMode, 1);
1432          gl.uniform1f(webglState.loadingCount, loadingParticleCount);
1433          gl.drawArrays(gl.POINTS, 0, loadingParticleCount);
1434          gl.uniform1f(webglState.loadingMode, 0);
1435          webglCanvas.dataset.loadingOverlay = 'swirl';
1436        } else {
1437          webglCanvas.dataset.loadingOverlay = 'off';
1438        }
1439        window.requestAnimationFrame(drawWebGL);
1440      }
1441
1442      function captureAuthoritativeTexture() {
1443        authoritativeCaptureRequested = true;
1444        if (authoritativeCaptureTimer || authoritativeCaptureInFlight) return;
1445        authoritativeCaptureTimer = window.requestAnimationFrame(function () {
1446          authoritativeCaptureTimer = 0;
1447          if (!authoritativeCaptureRequested || authoritativeCaptureInFlight) return;
1448          authoritativeCaptureRequested = false;
1449          if (!preview || !AUTHORITATIVEDATA || !window.html2canvas) return;
1450          var bounds = (toolStage || preview).getBoundingClientRect();
1451          if (bounds.width < 2 || bounds.height < 2) return;
1452          var captureTarget = syncTextureMirror(
1453            authoritativeTextureMirrorFrame,
1454            AUTHORITATIVEDATA,
1455            bounds.width,
1456            bounds.height,
1457            captureAuthoritativeTexture
1458          );
1459          if (!captureTarget || captureTarget.dataset.tailwindReady !== 'true') return;
1460          var hasVisibleContent = String(captureTarget.textContent || '').trim().length > 0 || !!captureTarget.querySelector('canvas,svg,img,video,input,button,select,textarea');
1461          if (!hasVisibleContent) return;
1462          authoritativeCaptureInFlight = true;
1463          var deviceCaptureScale = Math.min(window.devicePixelRatio || 1, 1.25);
1464          var particleCaptureScale = Math.sqrt(
1465            TILE_COUNT / Math.max(bounds.width * bounds.height, 1)
1466          );
1467          var captureScale = authoritativeTextureReady
1468            ? deviceCaptureScale
1469            : Math.min(deviceCaptureScale, Math.max(0.5, particleCaptureScale));
1470          if (webglCanvas) webglCanvas.dataset.authoritativeCaptureScale = captureScale.toFixed(3);
1471          window.html2canvas(captureTarget, {
1472            backgroundColor: '#ffffff',
1473            logging: false,
1474            scale: captureScale,
1475            useCORS: true,
1476            width: Math.round(bounds.width),
1477            height: Math.round(bounds.height),
1478            windowWidth: Math.round(bounds.width),
1479            windowHeight: Math.round(bounds.height)
1480          }).then(function (capturedCanvas) {
1481            if (!capturedCanvas || capturedCanvas.width < 3 || capturedCanvas.height < 3) return;
1482            authoritativeTextureCanvas = capturedCanvas;
1483            authoritativeTextureVersion += 1;
1484            authoritativeTextureReady = true;
1485            targetAuthoritativeTextureMix = 1;
1486            webglCanvas.dataset.authoritativeStreamLength = String(AUTHORITATIVEDATA.length);
1487            webglCanvas.dataset.authoritativeTextureMode = 'html';
1488          }).catch(function () {}).finally(function () {
1489            authoritativeCaptureInFlight = false;
1490            if (authoritativeCaptureRequested) captureAuthoritativeTexture();
1491          });
1492        });
1493      }
1494
1495      function streamAuthoritativeInParallel() {
1496        if (!authoritativeAssemblyStarted) {
1497          authoritativeAssemblyStarted = true;
1498          authoritativeDataProgress = 0;
1499          authoritativeTextureMix = 0;
1500          targetAuthoritativeTextureMix = 0;
1501          textureProgress = 0;
1502          targetTextureProgress = 0;
1503          if (webglCanvas) webglCanvas.dataset.assemblyPhase = 'gemini';
1504        }
1505        authoritativeDataProgress = Math.max(
1506          authoritativeDataProgress,
1507          Math.min(1, AUTHORITATIVEDATA.length / AUTHORITATIVE_TEXTURE_CHARACTER_TARGET)
1508        );
1509        targetTextureProgress = authoritativeDataProgress;
1510        if (authoritativeTextureReady) targetAuthoritativeTextureMix = 1;
1511        if (webglCanvas) {
1512          webglCanvas.dataset.authoritativeStreamProgress = authoritativeDataProgress.toFixed(4);
1513          webglCanvas.dataset.authoritativeStreamTargetCharacters = String(
1514            AUTHORITATIVE_TEXTURE_CHARACTER_TARGET
1515          );
1516        }
1517        if (!hasRenderableStreamHTML(AUTHORITATIVEDATA)) return;
1518        captureAuthoritativeTexture();
1519      }
1520
1521      function prewarmAuthoritativeTextureRenderer() {
1522        var mirrorDocument = authoritativeTextureMirrorFrame && authoritativeTextureMirrorFrame.contentDocument;
1523        if (!mirrorDocument || !mirrorDocument.head || !mirrorDocument.body) {
1524          if (authoritativeTextureMirrorFrame) {
1525            authoritativeTextureMirrorFrame.addEventListener('load', prewarmAuthoritativeTextureRenderer, {once: true});
1526          }
1527          return;
1528        }
1529        ensureTextureMirrorTailwind(mirrorDocument);
1530      }
1531
1532      prewarmAuthoritativeTextureRenderer();
1533      initWebGL();
1534
1535      function syncNavVisibility() {
1536        navFrame = 0;
1537        var belowTool = !!navSentinel && navSentinel.getBoundingClientRect().top <= 0;
1538        document.body.classList.toggle('nav-below-tool', belowTool);
1539        document.body.classList.toggle('nav-at-tool', !belowTool);
1540      }
1541
1542      function requestNavSync() {
1543        if (navFrame) return;
1544        navFrame = window.requestAnimationFrame(syncNavVisibility);
1545      }
1546
1547      window.addEventListener('scroll', requestNavSync, { passive: true });
1548      window.addEventListener('resize', requestNavSync, { passive: true });
1549      syncNavVisibility();
1550
1551      function setStatus(message, tone) {
1552        if (!status) return;
1553        status.textContent = message;
1554        status.setAttribute('data-tone', tone || 'neutral');
1555      }
1556
1557      function setGeneratorBusy(isBusy) {
1558        if (generator) generator.setAttribute('aria-busy', String(!!isBusy));
1559        if (submit) {
1560          submit.disabled = false;
1561          submit.setAttribute('aria-busy', String(!!isBusy));
1562        }
1563      }
1564
1565      function resizeInput() {
1566        if (!input) return;
1567        input.style.height = 'auto';
1568        input.style.height = Math.min(input.scrollHeight, 148) + 'px';
1569      }
1570
1571      function expandComposer() {
1572        if (!generator || generator.classList.contains('is-composer-expanded')) return;
1573        generator.classList.add('is-composer-expanded');
1574      }
1575
1576      function cleanGeneratedHTML(source) {
1577        var cleaned = String(source || '').replace(/^\s*```(?:html)?\s*/i, '');
1578        cleaned = cleaned.replace(/\s*```\s*$/i, '');
1579        var documentStart = cleaned.search(/<!doctype\s+html|<html\b/i);
1580        if (documentStart > 0) cleaned = cleaned.slice(documentStart);
1581        return cleaned;
1582      }
1583
1584      function compiledTailwindCSS(mirrorFrame) {
1585        var mirrorDocument = mirrorFrame && mirrorFrame.contentDocument;
1586        if (!mirrorDocument || !mirrorDocument.head) return '';
1587        return Array.prototype.slice.call(mirrorDocument.head.querySelectorAll('style')).filter(function (styleNode) {
1588          return !styleNode.hasAttribute('data-tool-mirror-guard')
1589            && !styleNode.hasAttribute('data-tool-stream-style');
1590        }).map(function (styleNode) {
1591          return String(styleNode.textContent || '').trim();
1592        }
1592).filter(Boolean).join('\n');
1593      }
1594
1595      function embedCompiledTailwind(source, compiledCSS) {
1596        var parsed = new DOMParser().parseFromString(source, 'text/html');
1597        if (!parsed || !parsed.documentElement || !parsed.head || !compiledCSS) return '';
1598        Array.prototype.slice.call(parsed.head.querySelectorAll('script[src]')).forEach(function (scriptNode) {
1599          var scriptSource = String(scriptNode.getAttribute('src') || '');
1600          if (scriptSource === TAILWIND_RUNTIME_URL || /tailwindcss/i.test(scriptSource)) scriptNode.remove();
1601        });
1602        var compiledStyle = parsed.createElement('style');
1603        compiledStyle.setAttribute('data-tool-compiled-tailwind', '');
1604        compiledStyle.textContent = compiledCSS;
1605        parsed.head.insertBefore(compiledStyle, parsed.head.firstChild);
1606        return '<!doctype html>\n' + parsed.documentElement.outerHTML;
1607      }
1608
1609      function prepareStyledPreview(source, mirrorFrame) {
1610        var cleaned = cleanGeneratedHTML(source);
1611        if (!cleaned || !mirrorFrame || !preview) return Promise.resolve('');
1612        var bounds = (toolStage || preview).getBoundingClientRect();
1613        syncTextureMirror(
1614          mirrorFrame,
1615          cleaned,
1616          Math.max(320, bounds.width || 960),
1617          Math.max(240, bounds.height || 640)
1618        );
1619        return new Promise(function (resolve) {
1620          var attempt = 0;
1621          function finishCompiledPreview() {
1622            attempt += 1;
1623            var compiledCSS = compiledTailwindCSS(mirrorFrame);
1624            if (compiledCSS.length > 1000 && attempt >= 3) {
1625              resolve(embedCompiledTailwind(cleaned, compiledCSS));
1626              return;
1627            }
1628            if (attempt < 50) {
1629              window.setTimeout(finishCompiledPreview, 25);
1630              return;
1631            }
1632            resolve('');
1633          }
1634          window.requestAnimationFrame(function () {
1635            window.requestAnimationFrame(finishCompiledPreview);
1636          });
1637        });
1638      }
1639
1640      function writeAuthoritativePreview(source, mirrorFrame) {
1641        var cleaned = cleanGeneratedHTML(source);
1642        if (!frame || !cleaned) return Promise.resolve(false);
1643        if (cleaned === authoritativePreviewHTML) return authoritativePreviewLoad;
1644        authoritativePreviewHTML = cleaned;
1645        authoritativePreviewRevision += 1;
1646        var previewRevision = authoritativePreviewRevision;
1647        authoritativePreviewLoad = prepareStyledPreview(
1648          cleaned,
1649          mirrorFrame || authoritativeTextureMirrorFrame
1650        ).then(function (styledDocument) {
1651          if (previewRevision !== authoritativePreviewRevision) return false;
1652          if (!styledDocument) {
1653            authoritativePreviewHTML = '';
1654            return false;
1655          }
1656          return new Promise(function (resolve) {
1657            var settled = false;
1658            function finishPreviewLoad() {
1659              if (settled) return;
1660              settled = true;
1661              window.requestAnimationFrame(function () {
1662                window.requestAnimationFrame(function () { resolve(true); });
1663              });
1664            }
1665            frame.addEventListener('load', finishPreviewLoad, {once: true});
1666            frame.srcdoc = styledDocument;
1667            window.setTimeout(function () {
1668              finishPreviewLoad();
1669            }, 6000);
1670          });
1671        });
1672        return authoritativePreviewLoad;
1673      }
1674
1675      function stageAuthoritativePreview(force) {
1676        if (!frame || !AUTHORITATIVEDATA || !hasRenderableStreamHTML(AUTHORITATIVEDATA)) {
1677          return Promise.resolve(false);
1678        }
1679        if (force) {
1680          if (authoritativePreviewTimer) window.clearTimeout(authoritativePreviewTimer);
1681          authoritativePreviewTimer = 0;
1682          return writeAuthoritativePreview(AUTHORITATIVEDATA, authoritativeTextureMirrorFrame);
1683        }
1684        if (authoritativePreviewTimer) return authoritativePreviewLoad;
1685        authoritativePreviewTimer = window.setTimeout(function () {
1686          authoritativePreviewTimer = 0;
1687          writeAuthoritativePreview(AUTHORITATIVEDATA, authoritativeTextureMirrorFrame);
1688        }, 180);
1689        return authoritativePreviewLoad;
1690      }
1691
1692      function prepareFinalPreview(source) {
1693        FINALDATA = cleanGeneratedHTML(source);
1694        if (!FINALDATA) return Promise.resolve(false);
1695        AUTHORITATIVEDATA = FINALDATA;
1696        return stageAuthoritativePreview(true);
1697      }
1698
1699      function completePreview() {
1700        var cleaned = FINALDATA || cleanGeneratedHTML(AUTHORITATIVEDATA);
1701        if (frame && cleaned && authoritativePreviewHTML !== cleaned) {
1702          writeAuthoritativePreview(cleaned, authoritativeTextureMirrorFrame);
1703        }
1704        generator.classList.add('has-output');
1705      }
1706
1707      function showPublishedSite(url, title) {
1708        publishedSiteUrl = String(url || '').trim();
1709        publishedSiteTitle = String(title || 'Interactive tool').trim();
1710        if (!publishedSiteUrl || !sharePanel || !siteLink) return;
1711        siteLink.href = publishedSiteUrl;
1712        siteLink.textContent = publishedSiteUrl;
1713        siteLink.setAttribute('aria-label', 'Open ' + publishedSiteTitle);
1714        sharePanel.hidden = false;
1715      }
1716
1717      function recentToolAge(value) {
1718        var generatedAt = Date.parse(String(value || ''));
1719        if (!Number.isFinite(generatedAt)) return 'recently';
1720        var seconds = Math.max(0, Math.floor((Date.now() - generatedAt) / 1000));
1721        if (seconds < 45) return 'just now';
1722        if (seconds < 3600) return Math.max(1, Math.floor(seconds / 60)) + 'm ago';
1723        if (seconds < 86400) return Math.max(1, Math.floor(seconds / 3600)) + 'h ago';
1724        return Math.max(1, Math.floor(seconds / 86400)) + 'd ago';
1725      }
1726
1727      function safeRecentToolUrl(value) {
1728        try {
1729          var parsed = new URL(String(value || ''));
1730          var hostname = parsed.hostname.toLowerCase();
1731          if (parsed.protocol !== 'https:' || !(hostname === 'getsupers.com' || hostname.endsWith('.getsupers.com'))) return '';
1732          return parsed.href;
1733        } catch (_error) {
1734          return '';
1735        }
1736      }
1737
1738      var recentToolsRendered = 0;
1739      var toolMetricsVisible = false;
1740      var toolGenerationStarted = false;
1741      var recentPanelRevealFrame = 0;
1742
1743      function syncRecentPanelVisibility() {
1744        if (!recentPanel) return;
1745        var shouldReveal = toolGenerationStarted && (recentToolsRendered > 0 || toolMetricsVisible);
1746        if (!shouldReveal) {
1747          if (recentPanelRevealFrame) {
1748            window.cancelAnimationFrame(recentPanelRevealFrame);
1749            recentPanelRevealFrame = 0;
1750          }
1751          recentPanel.classList.remove('is-visible');
1752          recentPanel.hidden = true;
1753          return;
1754        }
1755        if (!recentPanel.hidden && recentPanel.classList.contains('is-visible')) return;
1756        recentPanel.hidden = false;
1757        recentPanel.classList.remove('is-visible');
1758        if (recentPanelRevealFrame) window.cancelAnimationFrame(recentPanelRevealFrame);
1759        recentPanelRevealFrame = window.requestAnimationFrame(function () {
1760          recentPanelRevealFrame = 0;
1761          recentPanel.classList.add('is-visible');
1762        });
1763      }
1764
1765      function renderRecentTools(items) {
1766        if (!recentPanel || !recentList) return;
1767        while (recentList.firstChild) recentList.removeChild(recentList.firstChild);
1768        var rendered = 0;
1769        var seenQuestions = Object.create(null);
1770        (Array.isArray(items) ? items : []).some(function (item) {
1771          var siteUrl = safeRecentToolUrl(item && item.site_url);
1772          var question = String(item && item.question || '').trim();
1773          if (!siteUrl || !question || siteUrl === publishedSiteUrl) return false;
1774          var questionKey = question.toLocaleLowerCase().replace(/\s+/g, ' ').trim();
1775          if (seenQuestions[questionKey]) return false;
1776          seenQuestions[questionKey] = true;
1777          var link = document.createElement('a');
1778          link.className = 'tool-generator-recent';
1779          link.href = siteUrl;
1780          link.target = '_blank';
1781          link.rel = 'noopener noreferrer';
1782          link.setAttribute('role', 'listitem');
1783
1784          var questionNode = document.createElement('span');
1785          questionNode.className = 'tool-generator-recent-question';
1786          questionNode.textContent = question;
1787          link.appendChild(questionNode);
1788
1789          var titleNode = document.createElement('span');
1790          titleNode.className = 'tool-generator-recent-title';
1791          titleNode.textContent = String(item && item.site_title || 'Interactive tool');
1792          link.appendChild(titleNode);
1793
1794          var metaNode = document.createElement('span');
1795          metaNode.className = 'tool-generator-recent-meta';
1796          var impressions = Number(item && item.impressions);
1797          if (item && item.impressions_available && Number.isFinite(impressions)) {
1798            var impressionNode = document.createElement('span');
1799            impressionNode.className = 'tool-generator-recent-impressions';
1800            impressionNode.textContent = formatToolMetric(impressions) + (impressions === 1 ? ' impression' : ' impressions');
1801            metaNode.appendChild(impressionNode);
1802            metaNode.appendChild(document.createTextNode(' · '));
1803          }
1804          metaNode.appendChild(document.createTextNode('Recently generated by another user · '));
1805          var timeNode = document.createElement('time');
1806          timeNode.dateTime = String(item && item.generated_at || '');
1807          timeNode.textContent = recentToolAge(timeNode.dateTime);
1808          metaNode.appendChild(timeNode);
1809          link.appendChild(metaNode);
1810
1811          recentList.appendChild(link);
1812          rendered += 1;
1813          return rendered >= 10;
1814        });
1815        recentToolsRendered = rendered;
1816        syncRecentPanelVisibility();
1817      }
1818
1819      function formatToolMetric(value) {
1820        var count = Math.max(0, Math.floor(Number(value) || 0));
1821        try { return new Intl.NumberFormat().format(count); } catch (_error) { return String(count); }
1822      }
1823
1824      function renderToolMetrics(payload) {
1825        var sitesAvailable = !!(payload && payload.site_registry_available) && Number.isFinite(Number(payload.total_sites_generated));
1826        if (totalSitesMetric) {
1827          totalSitesMetric.hidden = !sitesAvailable;
1828          totalSitesMetric.textContent = sitesAvailable ? formatToolMetric(payload.total_sites_generated) + ' sites generated' : '';
1829          if (sitesAvailable) totalSitesMetric.setAttribute('aria-label', formatToolMetric(payload.total_sites_generated) + ' total sites generated');
1830          else totalSitesMetric.removeAttribute('aria-label');
1831        }
1832        toolMetricsVisible = sitesAvailable;
1833        syncRecentPanelVisibility();
1834      }
1835
1836      var recentToolsRequestInFlight = false;
1837      async function refreshRecentTools() {
1838        if (recentToolsRequestInFlight) return;
1839        recentToolsRequestInFlight = true;
1840        try {
1841          var response = await fetch('https://app.getsupers.com/api/public/tool-generator/recent?limit=12', {
1842            method: 'GET',
1843            headers: {'Accept': 'application/json'},
1844            cache: 'no-store',
1845            credentials: 'omit'
1846          });
1847          if (!response.ok) return;
1848          var payload = await response.json();
1849          renderRecentTools(payload && payload.items);
1850        } catch (_error) {
1851          // The generator remains usable if the public activity feed is temporarily unavailable.
1852        } finally {
1853          recentToolsRequestInFlight = false;
1854        }
1855      }
1856
1857      var toolMetricsRequestInFlight = false;
1858      async function refreshToolMetrics() {
1859        if (toolMetricsRequestInFlight) return;
1860        toolMetricsRequestInFlight = true;
1861        try {
1862          var response = await fetch('https://app.getsupers.com/api/public/tool-generator/metrics', {
1863            method: 'GET',
1864            headers: {'Accept': 'application/json'},
1865            cache: 'no-store',
1866            credentials: 'omit'
1867          });
1868          if (!response.ok) return;
1869          renderToolMetrics(await response.json());
1870        } catch (_error) {
1871          // Live counters are optional and must never interrupt the generator or activity feed.
1872        } finally {
1873          toolMetricsRequestInFlight = false;
1874        }
1875      }
1876
1877      function parseSSEBlock(block) {
1878        var data = block.split('\n').filter(function (line) {
1879          return line.indexOf('data:') === 0;
1880        }).map(function (line) {
1881          return line.slice(5).trim();
1882        }).join('\n');
1883        if (!data) return null;
1884        try { return JSON.parse(data); } catch (_error) { return null; }
1885      }
1886
1887      async function consumeToolEventStream(responsePromise, onEvent) {
1888        var response = await responsePromise;
1889        if (!response.ok) {
1890          var failure = {};
1891          try { failure = await response.json(); } catch (_error) {}
1892          throw new Error(failure.error || 'The tool could not be generated.');
1893        }
1894        if (!response.body) throw new Error('Streaming is unavailable in this browser.');
1895        var reader = response.body.getReader();
1896        var decoder = new TextDecoder();
1897        var buffer = '';
1898        while (true) {
1899          var result = await reader.read();
1900          buffer += decoder.decode(result.value || new Uint8Array(), {stream: !result.done});
1901          var blocks = buffer.split(/\r?\n\r?\n/);
1902          buffer = blocks.pop() || '';
1903          for (var blockIndex = 0; blockIndex < blocks.length; blockIndex += 1) {
1904            var event = parseSSEBlock(blocks[blockIndex]);
1905            if (event) await onEvent(event);
1906          }
1907          if (result.done) break;
1908        }
1909      }
1910
1911      function renderQuickQuestions(questions) {
1912        if (!quickPromptsContainer || !quickPromptCount || !Array.isArray(questions)) return;
1913        var unique = [];
1914        var seen = Object.create(null);
1915        questions.forEach(function (question) {
1916          var value = String(question || '').replace(/\s+/g, ' ').trim();
1917          var key = value.toLowerCase();
1918          if (!value || seen[key] || unique.length >= quickPromptCount) return;
1919          seen[key] = true;
1920          unique.push(value);
1921        });
1922        if (unique.length !== quickPromptCount) return;
1923        var buttons = Array.prototype.slice.call(
1924          quickPromptsContainer.querySelectorAll('[data-tool-question]')
1925        );
1926        unique.forEach(function (question, index) {
1927          var button = buttons[index];
1928          if (!button) {
1929            button = document.createElement('button');
1930            button.className = 'tool-generator-prompt';
1931            button.type = 'button';
1932            quickPromptsContainer.appendChild(button);
1933          }
1934          if (button.getAttribute('data-tool-question') === question && button.textContent === question) return;
1935          button.setAttribute('data-tool-question', question);
1936          button.textContent = question;
1937        });
1938      }
1939
1940      async function generateTool(question) {
1941        var generationId = ++generationSequence;
1942        if (activeController) activeController.abort();
1943        expandComposer();
1944        var authoritativeController = new AbortController();
1945        var controller = {
1946          generationId: generationId,
1947          abort: function () {
1948            authoritativeController.abort();
1949          }
1950        };
1951        activeController = controller;
1952        function isCurrentGeneration() {
1953          return activeController === controller && generationSequence === generationId;
1954        }
1955        AUTHORITATIVEDATA = '';
1956        FINALDATA = '';
1957        if (authoritativePreviewTimer) window.clearTimeout(authoritativePreviewTimer);
1958        authoritativePreviewTimer = 0;
1959        authoritativePreviewHTML = '';
1960        authoritativePreviewRevision += 1;
1961        authoritativePreviewLoad = Promise.resolve();
1962        publishedSiteUrl = '';
1963        publishedSiteTitle = '';
1964        if (sharePanel) sharePanel.hidden = true;
1965        if (siteLink) {
1966          siteLink.removeAttribute('href');
1967          siteLink.textContent = '';
1968        }
1969        var authoritativeMirrorDocument = authoritativeTextureMirrorFrame && authoritativeTextureMirrorFrame.contentDocument;
1970        if (authoritativeMirrorDocument && authoritativeMirrorDocument.body) authoritativeMirrorDocument.body.innerHTML = '';
1971        generator.classList.add('is-active');
1972        generator.classList.remove('has-stream', 'has-output', 'texture-ready');
1973        if (frame) {
1974          frame.srcdoc = '<!doctype html><html><head></head><body></body></html>';
1975          delete frame.dataset.previewModel;
1976        }
1977        if (webglState) webglState.uploadedTextureVersion = -1;
1978        if (webglState) webglState.uploadedAuthoritativeTextureVersion = -1;
1979        if (webglCanvas) {
1980          delete webglCanvas.dataset.textureWidth;
1981          delete webglCanvas.dataset.textureHeight;
1982          delete webglCanvas.dataset.textureUploaded;
1983          delete webglCanvas.dataset.textureMode;
1984          delete webglCanvas.dataset.assemblyProgress;
1985          delete webglCanvas.dataset.assemblyTarget;
1986          delete webglCanvas.dataset.assemblyPhase;
1987          delete webglCanvas.dataset.authoritativeBlend;
1988          delete webglCanvas.dataset.authoritativeStreamLength;
1989          delete webglCanvas.dataset.authoritativeStreamProgress;
1990          delete webglCanvas.dataset.authoritativeStreamTargetCharacters;
1991          delete webglCanvas.dataset.authoritativeTextureMode;
1992          delete webglCanvas.dataset.authoritativeTextureUploaded;
1993          delete webglCanvas.dataset.authoritativeTextureVersion;
1994          delete webglCanvas.dataset.authoritativeCaptureScale;
1995          delete webglCanvas.dataset.textureSource;
1996        }
1997        textureProgress = 0;
1998        targetTextureProgress = 0;
1999        authoritativeTextureReady = false;
2000        authoritativeTextureMix = 0;
2001        targetAuthoritativeTextureMix = 0;
2002        authoritativeDataProgress = 0;
2003        authoritativeAssemblyStarted = false;
2004        authoritativeTextureVersion = 0;
2005        generator.classList.add('has-stream', 'texture-ready');
2006        if (webglCanvas) webglCanvas.dataset.textureMode = 'waiting-html';
2007        toolGenerationStarted = true;
2008        syncRecentPanelVisibility();
2009        setGeneratorBusy(true);
2010        setStatus('Waiting for the first streamed tokens...');
2011        if (window.posthog && typeof window.posthog.capture === 'function') {
2012          window.posthog.capture('homepage_tool_generation_started');
2013        }
2014
2015        try {
2016          var authoritativeRequest = fetch('https://app.getsupers.com/api/public/tool-generator', {
2017            method: 'POST',
2018            headers: {'Accept': 'text/event-stream', 'Content-Type': 'application/json'},
2019            body: JSON.stringify({question: question, lane: 'authoritative'}),
2020            signal: authoritativeController.signal
2021          });
2022
2023          var authoritativeTask = consumeToolEventStream(authoritativeRequest, async function (event) {
2024            if (!isCurrentGeneration()) return;
2025            if (event.type === 'html_delta' || event.type === 'html_background_delta') {
2026                AUTHORITATIVEDATA += String(event.html || '');
2027                streamAuthoritativeInParallel();
2028            } else if (event.type === 'final_html') {
2029              AUTHORITATIVEDATA = String(event.html || AUTHORITATIVEDATA || '');
2030              streamAuthoritativeInParallel();
2031              await prepareFinalPreview(AUTHORITATIVEDATA);
2032              frame.dataset.previewModel = 'gemini-3.7-flash';
2033            } else if (event.type === 'status') {
2034              setStatus(event.message || 'Building the live experience...');
2035            } else if (event.type === 'error') {
2036              throw new Error(event.message || 'The tool could not be generated.');
2037            } else if (event.type === 'preview_ready') {
2038              await authoritativePreviewLoad;
2039              if (!isCurrentGeneration()) return;
2040              completePreview();
2041              setStatus(event.message || 'Your tool is ready. Publishing its permanent share link...');
2042              if (window.posthog && typeof window.posthog.capture === 'function') {
2043                window.posthog.capture('homepage_tool_preview_ready');
2044              }
2045            } else if (event.type === 'next_questions') {
2046              renderQuickQuestions(event.questions);
2047              if (window.posthog && typeof window.posthog.capture === 'function') {
2048                window.posthog.capture('homepage_tool_next_questions_ready');
2049              }
2050            } else if (event.type === 'publish_error') {
2051              completePreview();
2052              setStatus(event.message || 'Your tool is ready, but its permanent share link could not be published.');
2053            } else if (event.type === 'done') {
2054              completePreview();
2055              showPublishedSite(event.site_url, event.site_title);
2056              refreshRecentTools();
2057              setStatus('Open the permanent link below to share your tool.');
2058              if (window.posthog && typeof window.posthog.capture === 'function') {
2059                window.posthog.capture('homepage_tool_generation_completed');
2060              }
2061            }
2062          });
2063
2064          await authoritativeTask;
2065          if (isCurrentGeneration()) completePreview();
2066        } catch (error) {
2067          if (error && error.name === 'AbortError') return;
2068          if (!isCurrentGeneration()) return;
2069          setStatus((error && error.message) || 'The tool could not be generated. Please try again.', 'error');
2070          if (window.posthog && typeof window.posthog.capture === 'function') {
2071            window.posthog.capture('homepage_tool_generation_failed');
2072          }
2073        } finally {
2074          if (activeController === controller) {
2075            setGeneratorBusy(false);
2076            activeController = null;
2077          }
2078        }
2079      }
2080
2081      if (shareButton) {
2082        shareButton.addEventListener('click', async function () {
2083          if (!publishedSiteUrl) return;
2084          try {
2085            if (navigator.share) {
2086              await navigator.share({
2087                title: publishedSiteTitle || 'Interactive tool',
2088                text: 'Try this interactive tool',
2089                url: publishedSiteUrl
2090              });
2091              return;
2092            }
2093            if (navigator.clipboard && navigator.clipboard.writeText) {
2094              await navigator.clipboard.writeText(publishedSiteUrl);
2095              setStatus('Share link copied.');
2096              return;
2097            }
2098            window.open(publishedSiteUrl, '_blank', 'noopener');
2099          } catch (error) {
2100            if (error && error.name === 'AbortError') return;
2101            setStatus('Open the permanent link below to share your tool.', 'error');
2102          }
2103        });
2104      }
2105
2106      if (input) {
2107        input.addEventListener('input', function () {
2108          resizeInput();
2109          if (String(input.value || '').trim()) expandComposer();
2110        });
2111        input.addEventListener('keydown', function (event) {
2112          if (event.key === 'Enter' && !event.shiftKey) {
2113            event.preventDefault();
2114            if (form.requestSubmit) form.requestSubmit();
2115            else submit.click();
2116          }
2117        });
2118      }
2119      if (form) {
2120        form.addEventListener('submit', function (event) {
2121          event.preventDefault();
2122          var question = String(input.value || '').trim();
2123          if (!question) return;
2124          generateTool(question);
2125        });
2126      }
2127      if (quickPromptsContainer) {
2128        quickPromptsContainer.addEventListener('click', function (event) {
2129          var target = event.target;
2130          var button = target && target.closest ? target.closest('[data-tool-question]') : null;
2131          if (!button || !quickPromptsContainer.contains(button) || !input) return;
2132          expandComposer();
2133          input.value = String(button.getAttribute('data-tool-question') || '').trim();
2134          resizeInput();
2135          if (form && form.requestSubmit) form.requestSubmit();
2136          else if (submit) submit.click();
2137        });
2138      }
2139      refreshRecentTools();
2140      refreshToolMetrics();
2141      window.setInterval(refreshRecentTools, 10000);
2142      window.setInterval(refreshToolMetrics, 10000);
2143
2144      if (iosSuggestion && document.documentElement.classList.contains('is-iphone-browser')) {
2145        var dismissed = false;
2146        try { dismissed = window.sessionStorage.getItem('super_ios_suggestion_dismissed') === '1'; } catch (_error) {}
2147        if (!dismissed) window.setTimeout(function () {
2148          iosSuggestion.classList.add('is-visible');
2149          var appLink = iosSuggestion.querySelector('.ios-app-suggestion-link');
2150          if (!appLink || document.visibilityState === 'hidden') return;
2151          try {
2152            if (window.sessionStorage.getItem('super_ios_app_auto_opened') === '1') return;
2153            window.sessionStorage.setItem('super_ios_app_auto_opened', '1');
2154          } catch (_error) {
2155            // Keep the manual link when we cannot persist loop protection.
2156            return;
2157          }
2158          window.location.assign(appLink.href);
2159        }, 1100);
2160      }
2161      if (iosClose) {
2162        iosClose.addEventListener('click', function () {
2163          iosSuggestion.classList.remove('is-visible');
2164          try { window.sessionStorage.setItem('super_ios_suggestion_dismissed', '1'); } catch (_error) {}
2165        });
2166      }
2167    })();
2168  </script>
2168
2169  
2169<script>
2170    (function () {
2171      var links = Array.from(document.querySelectorAll('[data-tier-checkout]'));
2172      if (!links.length) return;
2173      fetch('https://app.getsupers.com/platform/subscription-plans', { credentials: 'omit' })
2174        .then(function (response) {
2175          if (!response.ok) throw new Error('Subscription plans unavailable');
2176          return response.json();
2177        })
2178        .then(function (payload) {
2179          var tiers = Array.isArray(payload && payload.tiers) ? payload.tiers : [];
2180          links.forEach(function (link) {
2181            var tierId = String(link.getAttribute('data-tier-checkout') || '');
2182            var tier = tiers.find(function (candidate) { return String(candidate && candidate.id || '') === tierId; });
2183            if (!tier || !tier.checkout_url) return;
2184            link.href = String(tier.checkout_url);
2185            link.target = '_blank';
2186            link.rel = 'noopener';
2187            link.removeAttribute('aria-disabled');
2188          });
2189        })
2190        .catch(function () {
2191          links.forEach(function (link) { link.setAttribute('aria-disabled', 'true'); });
2192        });
2193    })();
2194  </script>
vendor: 1 bytes, line 2194
2194
2195<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"dc74461fe2b14d1a9885faa777d4bb96","r":1,"spa":2}' crossorigin="anonymous"></script>
2195
2196</body>
2197</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.