PageSourceSearch

https://mako.ai/

html mako.ai collected 2026-10-05 12:13:37 UTC 215,058 bytes, 245 lines download raw bytes

1<!DOCTYPE html><html data-dpl-id="dpl_F45imnEAnWaHHno9jVAQfN8feLdz" lang="en" class="inter_fe8b9d92-module__LINzvG__variable jetbrains_mono_60a6e0cc-module__FznxZq__variable"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" href="/_next/static/media/70bc3e132a0a741e-s.p.3t6q91iet4nsy.woff2?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/7ebf22b5a21034f8-s.p.3j3877k49yy0l.woff2?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/83afe278b6a6bb3c-s.p.2bn3s6zvc0dyp.woff2?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" as="font" crossorigin="" type="font/woff2"/><link rel="stylesheet" href="/_next/static/chunks/0huu8yla5obps.css?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" data-precedence="next"/><link rel="stylesheet" href="/_next/static/chunks/1_nmozox8-i1r.css?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" data-precedence="next"/><link rel="stylesheet" href="/_next/static/chunks/2-jyz8zf2oelc.css?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/03raznvba8wfp.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz"/>
1<script src="/_next/static/chunks/35suq-pn0_fp1.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" async=""></script>
1<script src="/_next/static/chunks/44cz1qh1utbca.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" async=""></script>
1<script src="/_next/static/chunks/2ebm5flih8iv8.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" async=""></script>
1<script src="/_next/static/chunks/turbopack-11s_it9kq9aj_.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" async=""></script>
1<script src="/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" async=""></script>
1<script src="/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" async=""></script>
1<script src="/_next/static/chunks/3vor4xzhfu9b7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" async=""></script>
1<script src="/_next/static/chunks/2h-emq5cjgww7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" async=""></script>
1<script src="/_next/static/chunks/39nrdi7hy6ymd.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" async=""></script>
1<link rel="preload" href="https://attr.mako.ai/fp.js" as="script"/><link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"/><link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"/><link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"/><link rel="manifest" href="/site.webmanifest"/><meta name="next-size-adjust" content=""/><title>Mako — The open-source AI data platform</title><meta name="description" content="ETL, dbt orchestration, a SQL client, dashboards, and an app builder — one open-source platform with an AI agent that knows your schema. Replaces five tools."/>
1<script>(function(){try{var m=localStorage.getItem("mako-lp-theme")||"system";var d=m==="dark"||(m==="system"&&matchMedia("(prefers-color-scheme: dark)").matches);document.documentElement.classList.toggle("dark",d);}catch(e){}})()</script>
1<script src="/_next/static/chunks/0cz1d0mv5g_q7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" noModule=""></script>
1</head><body class="antialiased bg-white dark:bg-black"><div hidden=""><!--$--><!--/$--></div>
vendor: 67 bytes, line 1
1<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=
1GTM-MF9JVJSB
vendor: 82 bytes, line 1
1" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
1<div id="lp-theme-root" class="relative min-h-screen bg-(--paper) text-(--ink) transition-colors"><style>
2#lp-theme-root {
3  --paper: #F7F4EF;
4  --paper-2: #F2EEE6;
5  --card: #FFFFFF;
6  --ink: #1A1A1A;
7  --body: #4A4741;
8  --muted: #8A857B;
9  --line: #E3DED4;
10  --line-2: #D8D2C6;
11  --shadow: #E3DED4;
12  --shadow-btn: #B8B3A9;
13  --grid-minor: rgba(74, 71, 65, 0.055);
14  --grid-major: rgba(74, 71, 65, 0.12);
15  --grid-minor-hi: rgba(74, 71, 65, 0.14);
16  --grid-major-hi: rgba(74, 71, 65, 0.26);
17  --frame-line: #B8B3A9;
18  --inv-bg: #1A1A1A;
19  --inv-ink: #F7F4EF;
20  --inv-muted: #B8B3A9;
21  --inv-line: #4A4741;
22  --ok: #0F766E;
23  --warn: #B45309;
24  --err: #C4432B;
25  --chart-1: #6C4FD8;
26  --chart-2: #8B7BE0;
27  --chart-3: #ABA3E8;
28  --chart-4: #CBC7F0;
29  --chart-track: #F2EEE6;
30
31  --app-bg: #FAFAFA;
32  --app-panel: #FFFFFF;
33  --app-line: #E4E4E4;
34  --app-ink: #212121;
35  --app-body: #424242;
36  --app-muted: #757575;
37  --app-faint: #9E9E9E;
38  --app-hover: #F0F0F0;
39  --app-selected: #E3F2FD;
40  --app-accent: #1976D2;
41  --app-on-accent: #FFFFFF;
42  --syn-kw: #6C4FD8;
43  --syn-fn: #B45309;
44  --syn-str: #0F766E;
45  --syn-cmt: #8A857B;
46}
47.dark #lp-theme-root {
48  --paper: #161513;
49  --paper-2: #1D1B18;
50  --card: #201E1A;
51  --ink: #EDEAE3;
52  --body: #B8B3A9;
53  --muted: #8A857B;
54  --line: #2E2B26;
55  --line-2: #3A362F;
56  --shadow: #0E0D0B;
57  --shadow-btn: #000000;
58  --grid-minor: rgba(237, 234, 227, 0.03);
59  --grid-major: rgba(237, 234, 227, 0.07);
60  --grid-minor-hi: rgba(237, 234, 227, 0.08);
61  --grid-major-hi: rgba(237, 234, 227, 0.16);
62  --frame-line: #55504A;
63  --inv-bg: #23201C;
64  --inv-ink: #EDEAE3;
65  --inv-muted: #8A857B;
66  --inv-line: #4A4741;
67  --ok: #34A798;
68  --warn: #D9822B;
69  --err: #E06A52;
70  --chart-1: #8B7BE0;
71  --chart-2: #A296E8;
72  --chart-3: #7C6FD0;
73  --chart-4: #55499C;
74  --chart-track: #26231F;
75
76  --app-bg: #121212;
77  --app-panel: #1E1E1E;
78  --app-line: #333333;
79  --app-ink: #E0E0E0;
80  --app-body: #C4C4C4;
81  --app-muted: #9E9E9E;
82  --app-faint: #6F6F6F;
83  --app-hover: #2A2A2A;
84  --app-selected: #14324D;
85  --app-accent: #90CAF9;
86  --app-on-accent: #0B2A45;
87  --syn-kw: #B4A5F0;
88  --syn-fn: #E0A458;
89  --syn-str: #4FB8A8;
90  --syn-cmt: #7A756B;
91}
92/* ---------- AI Brutalism: architect graph paper ---------- */
93
94/* 24px fine grid with a heavier line every 4 cells (96px). Pure CSS, themed
95 * via --grid-minor / --grid-major so it adapts to light and dark paper. */
96.lp-graph-bg {
97  background-image:
98    linear-gradient(to right, var(--grid-major) 1px, transparent 1px),
99    linear-gradient(to bottom, var(--grid-major) 1px, transparent 1px),
100    linear-gradient(to right, var(--grid-minor) 1px, transparent 1px),
101    linear-gradient(to bottom, var(--grid-minor) 1px, transparent 1px);
102  background-size: 96px 96px, 96px 96px, 24px 24px, 24px 24px;
103}
104
105/* The base grid dissolves gently down the page (pi.dev treatment) so long
106 * text sections sit on calmer paper while the hero reads as graph paper. */
107.lp-graph-veil {
108  -webkit-mask-image: linear-gradient(to bottom, black 0%, rgba(0,0,0,0.55) 900px, rgba(0,0,0,0.3) 1800px, rgba(0,0,0,0.3) calc(100% - 700px), rgba(0,0,0,0.65) 100%);
109  mask-image: linear-gradient(to bottom, black 0%, rgba(0,0,0,0.55) 900px, rgba(0,0,0,0.3) 1800px, rgba(0,0,0,0.3) calc(100% - 700px), rgba(0,0,0,0.65) 100%);
110}
111
112/* Cursor spotlight (Langfuse treatment): a small square that follows the
113 * pointer, carrying a brighter copy of the same grid behind a static radial
114 * mask. It moves via transform and compensates with background-position so
115 * its lines stay locked to the page grid. */
116.lp-graph-spot {
117  position: absolute;
118  top: 0;
119  left: 0;
120  width: 520px;
121  height: 520px;
122  pointer-events: none;
123  opacity: 0;
124  transition: opacity 0.35s;
125  background-image:
126    linear-gradient(to right, var(--grid-major-hi) 1px, transparent 1px),
127    linear-gradient(to bottom, var(--grid-major-hi) 1px, transparent 1px),
128    linear-gradient(to right, var(--grid-minor-hi) 1px, transparent 1px),
129    linear-gradient(to bottom, var(--grid-minor-hi) 1px, transparent 1px);
130  background-size: 96px 96px, 96px 96px, 24px 24px, 24px 24px;
131  -webkit-mask-image: radial-gradient(circle closest-side at center, black, transparent 78%);
132  mask-image: radial-gradient(circle closest-side at center, black, transparent 78%);
133}
134
135/* ---------- AI Brutalism: corner ticks ---------- */
136
137/* 8px right-angle ticks at all four corners of a box, drawn with a masked
138 * pseudo-element (Langfuse corner-box technique). Requires position:relative
139 * on the host. Composes with the existing offset-shadow press effect. */
140.lp-corners::before,
141.lp-corners-hover::before {
142  --lp-tick-tl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M8 0H0V8H1V1H8Z' fill='black'/%3E%3C/svg%3E");
143  --lp-tick-tr: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M0 0H8V8H7V1H0Z' fill='black'/%3E%3C/svg%3E");
144  --lp-tick-bl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M8 8H0V0H1V7H8Z' fill='black'/%3E%3C/svg%3E");
145  --lp-tick-br: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M0 8H8V0H7V7H0Z' fill='black'/%3E%3C/svg%3E");
146  content: "";
147  pointer-events: none;
148  position: absolute;
149  inset: -2px;
150  z-index: 10;
151  background-color: var(--ink);
152  -webkit-mask-image: var(--lp-tick-tl), var(--lp-tick-tr), var(--lp-tick-bl), var(--lp-tick-br);
153  mask-image: var(--lp-tick-tl), var(--lp-tick-tr), var(--lp-tick-bl), var(--lp-tick-br);
154  -webkit-mask-position: 0 0, 100% 0, 0 100%, 100% 100%;
155  mask-position: 0 0, 100% 0, 0 100%, 100% 100%;
156  -webkit-mask-size: 8px 8px;
157  mask-size: 8px 8px;
158  -webkit-mask-repeat: no-repeat;
159  mask-repeat: no-repeat;
160}
161.lp-corners-hover::before {
162  opacity: 0;
163  transition: opacity 0.2s;
164}
165.lp-corners-hover:hover::before {
166  opacity: 1;
167}
168</style><div aria-hidden="true" class="absolute inset-0 overflow-hidden lp-graph-bg lp-graph-veil"><div class="lp-graph-spot"></div></div><div class="relative"><nav class="sticky top-0 z-50 border-b border-(--line) bg-(--paper)/90 backdrop-blur"><div class="max-w-6xl mx-auto px-6 h-16 flex items-center justify-between gap-4"><a class="flex items-center gap-2" href="/"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 102 90" fill="currentColor" class="w-6 h-6"><path d="m58 0 44 77-8 13H7L0 77 43 0h15ZM6 77l3 5 36-64 9 16 17 30h6L45 8 6 77Zm79-8H34l-3 5h64L55 5h-6l36 64Zm-48-5h28L51 39 37 64Z"></path></svg><span class="font-mono font-semibold uppercase tracking-wider text-lg">Mako</span></a><div class="hidden md:flex items-center gap-8 text-sm font-mono uppercase tracking-wider text-(--body)"><div class="relative"><button type="button" aria-haspopup="menu" aria-expanded="false" class="flex items-center gap-1.5 uppercase transition-colors hover:text-(--ink)">
168Platform<span aria-hidden="true" class="text-[10px] transition-transform ">▾</span></button><div class="absolute left-1/2 -translate-x-1/2 top-full pt-3 hidden"><div class="w-80 border border-(--line-2) bg-(--card) shadow-[6px_6px_0_0_var(--shadow)] font-sans normal-case tracking-normal"><div class="px-4 py-2 border-b border-(--line-2) bg-(--paper-2) text-[11px] font-mono uppercase tracking-widest text-(--muted)">Platform — five modules</div><ul><li><a class="group flex items-center gap-3 px-4 py-3 border-b last:border-b-0 border-(--line) hover:bg-(--paper-2) transition-colors" href="/sql-client"><span class="flex items-center justify-center w-9 h-9 shrink-0 border border-(--line-2) bg-(--paper-2) text-(--body) group-hover:text-(--ink) group-hover:border-(--ink) transition-colors"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4.5 h-4.5" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="2"></rect><path d="m8 9 3 3-3 3"></path><path d="M13 15h3"></path></svg></span><span class="min-w-0"><span class="block text-sm font-medium text-(--ink)">SQL Client</span><span class="block text-xs text-(--muted) truncate">The AI-native SQL client</span></span><span class="ml-auto font-mono text-[11px] text-(--line-2) group-hover:text-(--muted) transition-colors" aria-hidden="true">01</span></a></li><li><a class="group flex items-center gap-3 px-4 py-3 border-b last:border-b-0 border-(--line) hover:bg-(--paper-2) transition-colors" href="/dashboards"><span class="flex items-center justify-center w-9 h-9 shrink-0 border border-(--line-2) bg-(--paper-2) text-(--body) group-hover:text-(--ink) group-hover:border-(--ink) transition-colors"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4.5 h-4.5" aria-hidden="true"><path d="M21 12A9 9 0 1 1 12 3v9Z"></path><path d="M21.2 8A9 9 0 0 0 16 2.8V8Z"></path></svg></span><span class="min-w-0"><span class="block text-sm font-medium text-(--ink)">Dashboards</span><span class="block text-xs text-(--muted) truncate">Dashboards the agent builds for you</span></span><span class="ml-auto font-mono text-[11px] text-(--line-2) group-hover:text-(--muted) transition-colors" aria-hidden="true">02</span></a></li><li><a class="group flex items-center gap-3 px-4 py-3 border-b last:border-b-0 border-(--line) hover:bg-(--paper-2) transition-colors" href="/etl"><span class="flex items-center justify-center w-9 h-9 shrink-0 border border-(--line-2) bg-(--paper-2) text-(--body) group-hover:text-(--ink) group-hover:border-(--ink) transition-colors"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4.5 h-4.5" aria-hidden="true"><path d="M8 3 4 7l4 4"></path><path d="M4 7h16"></path><path d="m16 21 4-4-4-4"></path><path d="M20 17H4"></path></svg></span><span class="min-w-0"><span class="block text-sm font-medium text-(--ink)">ETL Connectors &amp; Flows</span><span class="block text-xs text-(--muted) truncate">ETL without the pipeline vendor</span></span><span class="ml-auto font-mono text-[11px] text-(--line-2) group-hover:text-(--muted) transition-colors" aria-hidden="true">03</span></a></li><li><a class="group flex items-center gap-3 px-4 py-3 border-b last:border-b-0 border-(--line) hover:bg-(--paper-2) transition-colors" href="/dbt-transforms"><span class="flex items-center justify-center w-9 h-9 shrink-0 border border-(--line-2) bg-(--paper-2) text-(--body) group-hover:text-(--ink) group-hover:border-(--ink) transition-colors"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4.5 h-4.5" aria-hidden="true"><circle cx="6" cy="6" r="3"></circle><circle cx="18" cy="18" r="3"></circle><path d="M6 9v3a3 3 0 0 0 3 3h6"></path></svg></span><span class="min-w-0"><span class="block text-sm font-medium text-(--ink)">dbt Transforms</span><span class="block text-xs text-(--muted) truncate">Your dbt project, run by an agent</span></span><span class="ml-auto font-mono text-[11px] text-(--line-2) group-hover:text-(--muted) transition-colors" aria-hidden="true">04</span></a></li><li><a class="group flex items-center gap-3 px-4 py-3 border-b last:border-b-0 border-(--line) hover:bg-(--paper-2) transition-colors" href="/app-builder"><span class="flex items-center justify-center w-9 h-9 shrink-0 border border-(--line-2) bg-(--paper-2) text-(--body) group-hover:text-(--ink) group-hover:border-(--ink) transition-colors"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4.5 h-4.5" aria-hidden="true"><rect x="2" y="4" width="20" height="16" rx="2"></rect><path d="M10 4v4"></path><path d="M2 8h20"></path><path d="M6 4v4"></path></svg></span><span class="min-w-0"><span class="block text-sm font-medium text-(--ink)">Apps</span><span class="block text-xs text-(--muted) truncate">Full React apps on your data layer</span></span><span class="ml-auto font-mono text-[11px] text-(--line-2) group-hover:text-(--muted) transition-colors" aria-hidden="true">05</span></a></li></ul></div></div></div><a class="hover:text-(--ink) transition-colors" href="/solutions">Solutions</a><a class="hover:text-(--ink) transition-colors" href="/pricing">Pricing</a><a class="hover:text-(--ink) transition-colors" href="https://docs.mako.ai">Docs</a></div><div class="flex items-center gap-3"><a href="https://app.mako.ai" class="hidden sm:block text-sm font-mono uppercase tracking-wider text-(--body) hover:text-(--ink) transition-colors">Sign in</a><span class="group/btn inline-block "><a href="https://app.mako.ai" class="block px-4 py-2 text-sm font-medium border shadow-[3px_3px_0_0_var(--btn-shadow)] group-hover/btn:translate-x-[3px] group-hover/btn:translate-y-[3px] group-hover/btn:sha
168dow-none transition-all text-center bg-(--ink) text-(--paper) border-(--ink) [--btn-shadow:var(--shadow-btn)]">Get started</a></span></div></div></nav><div class="relative "><span aria-hidden="true" class="pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none top-2 left-3">+</span><span aria-hidden="true" class="pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none top-2 right-3">+</span><span aria-hidden="true" class="pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none bottom-2 left-3">+</span><span aria-hidden="true" class="pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none bottom-2 right-3">+</span><section class="px-6 pt-16 pb-10 text-center"><div class="max-w-3xl mx-auto"><h1 class="text-5xl md:text-7xl tracking-tight leading-[1.05]"><span class="instrument_serif_1a8f1c64-module__BIdUMW__className italic">Your entire data stack.</span><br/><span class="font-bold">One <span class="bg-(--ink) text-(--paper) px-2 box-decoration-clone">open-source</span> platform.</span></h1><p class="mt-6 text-lg md:text-xl text-(--body) max-w-2xl mx-auto leading-relaxed">ETL, dbt orchestration, a SQL client, dashboards, and an app builder — five layers that build on each other, run by an AI agent that knows your schema. Self-hostable, MIT-licensed, no credit card.</p><div class="mt-8 flex flex-col sm:flex-row items-center justify-center gap-4"><span class="group/btn inline-block w-full sm:w-auto"><a href="https://app.mako.ai" class="block px-8 py-3 font-medium border shadow-[4px_4px_0_0_var(--btn-shadow)] group-hover/btn:translate-x-[4px] group-hover/btn:translate-y-[4px] group-hover/btn:sha
168dow-none transition-all text-center bg-(--ink) text-(--paper) border-(--ink) [--btn-shadow:var(--shadow-btn)]">Start for free</a></span><span class="group/btn inline-block w-full sm:w-auto"><a href="https://github.com/mako-ai/mako" class="block px-8 py-3 font-medium border shadow-[4px_4px_0_0_var(--btn-shadow)] group-hover/btn:translate-x-[4px] group-hover/btn:translate-y-[4px] group-hover/btn:shadow-none transition-all text-center bg-(--paper) text-(--ink) border-(--ink) [--btn-shadow:var(--shadow-btn)]">View on GitHub</a></span></div></div></section><section class="px-4 sm:px-6 pb-6"><div class="max-w-6xl xl:max-w-[84rem] 2xl:max-w-[94rem] mx-auto"><div class="relative border border-(--frame-line) shadow-[8px_8px_0_0_var(--shadow)] bg-(--app-bg) text-(--app-body) select-none text-[11px] xl:text-[12px] 2xl:text-[13.5px] [&amp;_button:not(:disabled)]:cursor-pointer"><div class="flex items-center gap-2 px-3 py-1.5 border-b border-(--line-2) bg-(--paper-2) text-[10px] font-mono uppercase tracking-widest text-(--muted)"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--ok)" aria-hidden="true"></span><span class="truncate">Mako — Live Miniature</span><span class="ml-auto hidden sm:block shrink-0">Interactive</span></div><div class="pointer-events-none absolute inset-0 z-50 flex items-center justify-center p-4"><div role="dialog" aria-labelledby="mini-app-start-title" class="pointer-events-auto relative w-full max-w-[300px] border border-(--app-line) bg-(--app-panel) p-3 shadow-xl"><h3 id="mini-app-start-title" class="font-semibold text-(--app-ink)">Do you want to start exploring Mako?</h3><div class="mt-3 flex justify-end"><span class="relative"><button type="button" class="bg-(--app-accent) px-3 py-1 font-semibold text-(--app-on-accent) hover:brightness-110">LFG!</button><span aria-hidden="true" class="pointer-events-none absolute -bottom-5 right-1 text-(--app-ink)"><span class="hidden md:block animate-bounce motion-reduce:animate-none"><svg viewBox="0 0 24 24" fill="currentColor" class="h-6 w-6 drop-shadow"><path d="M4 2l15 10-7 1.5L9 20 4 2Z" stroke="white" stroke-width="2" stroke-linejoin="round" paint-order="stroke"></path></svg></span><span class="block md:hidden animate-bounce motion-reduce:animate-none"><span class="block h-7 w-7 rounded-full border-2 border-current bg-(--app-ink)/15"></span></span></span></span></div></div></div><div class="relative overflow-hidden h-[480px] sm:h-[520px] xl:h-[560px] 2xl:h-[620px]"><div class="hidden md:flex h-full"><div class="relative w-10 xl:w-11 shrink-0 flex flex-col items-center py-1.5 gap-0.5 border-r border-(--app-line) bg-(--app-bg)"><span class="group/tooltip relative inline-flex"><button type="button" aria-label="Databases" aria-pressed="true" class="w-7 h-7 flex items-center justify-center rounded-sm transition-colors bg-(--app-selected) text-(--app-accent)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4" aria-hidden="true"><ellipse cx="12" cy="5" rx="9" ry="3"></ellipse><path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3"></path><path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5"></path></svg></button><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-full top-1/2 ml-1 -translate-y-1/2">Databases</span></span><span class="group/tooltip relative inline-flex"><button type="button" aria-label="Consoles" aria-pressed="false" class="w-7 h-7 flex items-center justify-center rounded-sm transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="2"></rect><path d="m8 9 3 3-3 3"></path><path d="M13 15h3"></path></svg></button><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-full top-1/2 ml-1 -translate-y-1/2">Consoles</span></span><span class="group/tooltip relative inline-flex"><button type="button" aria-label="Flows" aria-pressed="false" class="w-7 h-7 flex items-center justify-center rounded-sm transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4" aria-hidden="true"><path d="M8 3 4 7l4 4"></path><path d="M4 7h16"></path><path d="m16 21 4-4-4-4"></path><path d="M20 17H4"></path></svg></button><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-full top-1/2 ml-1 -translate-y-1/2">Flows</span></span><span class="group/tooltip relative inline-flex"><button type="button" aria-label="Transforms" aria-pressed="false" class="w-7 h-7 flex items-center justify-center rounded-sm transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4" aria-hidden="true"><circle cx="6" cy="6" r="3"></circle><circle cx="18" cy="18" r="3"></circle><path d="M6 9v3a3 3 0 0 0 3 3h6"></path></svg></button><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-full top-1/2 ml-1 -translate-y-1/2">Transforms</span></span><span class="group/tooltip relative inline-flex"><button type="button" aria-label="Connectors" aria-pressed="false" class="w-7 h-7 flex items-center justify-center rounded-sm transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4" aria-hidden="true"><path d="M12 22v-5"></path><path d="M9 8V2"></path><path d="M15 8V2"></path><path d="M18 8v5a4 4 0 0 1-4 4h-4a4 4 0 0 1-4-4V8Z"></path></svg></button><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-full top-1/2 ml-1 -translate-y-1/2">Connectors</span></span><span class="group/tooltip relative inline-flex"><button type="button" aria-label="Dashboards" aria-pressed="false" class="w-7 h-7 flex items-center justify-center rounded-sm transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4" aria-hidden="true"><path d="M21 12A9 9 0 1 1 12 3v9Z"></path><path d="M21.2 8A9 9 0 0 0 16 2.8V8Z"></path></svg></button><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-full top-1/2 ml-1 -translate-y-1/2">Dashboards</span></span><span class="group/tooltip relative inline-flex"><button type="button" aria-label="Apps" aria-pressed="false" class="w-7 h-7 flex items-center justify-center rounded-sm transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4" aria-hidden="true"><rect x="2" y="4" width="20" height="16" rx="2"></rect><path d="M10 4v4"></path><path d="M2 8h20"></path><path d="M6 4v4"></path></svg></button><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-full top-1/2 ml-1 -translate-y-1/2">Apps</span></span><div class="mt-auto flex flex-col items-center gap-0.5"><span class="group/tooltip relative inline-flex"><button type="button" aria-label="User menu" aria-pressed="false" class="w-7 h-7 flex items-center justify-center rounded-sm transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><circle cx="12" cy="10" r="3"></circle><path d="M6.2 18.7A6 6 0 0 1 12 15a6 6 0 0 1 5.8 3.7"></path></svg></button><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-full top-1/2 ml-1 -translate-y-1/2">
168User menu</span></span><span class="group/tooltip relative inline-flex"><button type="button" aria-label="Settings" aria-pressed="false" class="w-7 h-7 flex items-center justify-center rounded-sm transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4" aria-hidden="true"><circle cx="12" cy="12" r="3"></circle><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 1 1-4 0v-.09a1.65 1.65 0 0 0-1-1.51 1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 1 1 0-4h.09a1.65 1.65 0 0 0 1.51-1 1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33h0a1.65 1.65 0 0 0 1-1.51V3a2 2 0 1 1 4 0v.09a1.65 1.65 0 0 0 1 1.51h0a1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82v0a1.65 1.65 0 0 0 1.51 1H21a2 2 0 1 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1Z"></path></svg></button><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-full top-1/2 ml-1 -translate-y-1/2">Settings</span></span></div></div><div class="flex w-48 lg:w-52 xl:w-60 shrink-0 flex-col border-r border-(--app-line) bg-(--app-panel)"><div class="flex items-center gap-1 px-2 py-1.5 border-b border-(--app-line)"><span class="text-[0.91em] font-semibold uppercase tracking-wider text-(--app-muted)">Databases</span><div class="ml-auto flex items-center gap-0.5 text-(--app-muted)"><button type="button" title="Add database" aria-label="Add to databases" class="p-1 hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M5 12h14M12 5v14"></path></svg></button><button type="button" title="Refresh databases" aria-label="Refresh databases" class="p-1 hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M21 12a9 9 0 1 1-2.64-6.36"></path><path d="M21 3v6h-6"></path></svg></button></div></div><div class="flex items-center gap-1.5 mx-2 my-1.5 px-1.5 py-1 border border-(--app-line) rounded-sm"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2.5 h-2.5 text-(--app-faint)" aria-hidden="true"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.3-4.3"></path></svg><input type="text" placeholder="Search databases..." aria-label="Search databases" class="w-full bg-transparent text-[0.91em] text-(--app-ink) placeholder:text-(--app-faint) outline-none" value=""/></div><div class="flex-1 overflow-y-auto pb-1"><div><button type="button" aria-expanded="true" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:8px"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform rotate-90" aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><span class="shrink-0 text-(--app-muted)"><img src="/lp/vendors/postgresql.svg" alt="PostgreSQL" title="PostgreSQL" loading="lazy" class="w-3 h-3 shrink-0 object-contain"/></span><span class="truncate">production-db</span><span class="ml-auto shrink-0 text-[0.82em] text-(--app-faint)">PostgreSQL</span></button><div><button type="button" aria-expanded="true" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:20px"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform rotate-90" aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><span class="shrink-0 text-(--app-muted)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z"></path></svg></span><span class="truncate">public</span><span class="ml-auto shrink-0 text-[0.82em] text-(--app-faint)">4 tables</span></button><div><button type="button" aria-expanded="false" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:32px"><span class="shrink-0 -m-1 p-1"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg></span><span class="shrink-0 text-(--app-muted)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><rect x="3" y="4" width="18" height="16" rx="1"></rect><path d="M3 10h18M9 4v16"></path></svg></span><span class="truncate">users</span></button></div><div><button type="button" aria-expanded="false" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:32px"><span class="shrink-0 -m-1 p-1"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg></span><span class="shrink-0 text-(--app-muted)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><rect x="3" y="4" width="18" height="16" rx="1"></rect><path d="M3 10h18M9 4v16"></path></svg></span><span class="truncate">accounts</span></button></div><div><button type="button" aria-expanded="false" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:32px"><span class="shrink-0 -m-1 p-1"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg></span><span class="shrink-0 text-(--app-muted)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><rect x="3" y="4" width="18" height="16" rx="1"></rect><path d="M3 10h18M9 4v16"></path></svg></span><span class="truncate">subscriptions</span></button></div><div><button type="button" aria-expanded="false" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:32px"><span class="shrink-0 -m-1 p-1"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg></span><span class="shrink-0 text-(--app-muted)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><rect x="3" y="4" width="18" height="16" rx="1"></rect><path d="M3 10h18M9 4v16"></path></svg></span><span class="truncate">invoices</span></button></div></div></div><div><button type="button" aria-expanded="false" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:8px"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><span class="shrink-0 text-(--app-muted)"><img src="/lp/vendors/clickhouse.svg" alt="ClickHouse" title="ClickHouse" loading="lazy" class="w-3 h-3 shrink-0 object-contain"/></span><span class="truncate">events</span><span class="ml-auto shrink-0 text-[0.82em] text-(--app-faint)">ClickHouse</span></button></div><div><button type="button" aria-expanded="true" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:8px"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform rotate-90" aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><span class="shrink-0 text-(--app-muted)"><img src="/lp/vendors/bigquery.svg" alt="BigQuery" title="BigQuery" loading="lazy" class="w-3 h-3 shrink-0 object-contain"/></span><span class="truncate">data warehouse</span><span class="ml-auto shrink-0 text-[0.82em] text-(--app-faint)">BigQuery</span></button><div><button type="button" aria-expanded="false" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:20px"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><span class="shrink-0 text-(--app-muted)">
168<img src="/lp/vendors/stripe.svg" alt="Stripe" title="Stripe" loading="lazy" class="w-3 h-3 shrink-0 object-contain"/></span><span class="truncate">stripe</span><span class="ml-auto shrink-0 text-[0.82em] text-(--app-faint)">3 tables</span></button></div><div><button type="button" aria-expanded="false" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:20px"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><span class="shrink-0 text-(--app-muted)"><img src="/lp/vendors/posthog.svg" alt="PostHog" title="PostHog" loading="lazy" class="w-3 h-3 shrink-0 object-contain"/></span><span class="truncate">posthog</span><span class="ml-auto shrink-0 text-[0.82em] text-(--app-faint)">2 tables</span></button></div><div><button type="button" aria-expanded="false" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:20px"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><span class="shrink-0 text-(--app-muted)"><svg viewBox="0 0 24 24" class="w-3 h-3 shrink-0" role="img" aria-label="Google Analytics"><title>Google Analytics</title><path d="M22.84 2.9982v17.9987c.0086 1.6473-1.3197 2.9897-2.967 2.9984a2.9808 2.9808 0 01-.3677-.0208c-1.528-.226-2.6477-1.5558-2.6105-3.1V3.1204c-.0369-1.5458 1.0856-2.8762 2.6157-3.1 1.6361-.1915 3.1178.9796 3.3093 2.6158.014.1201.0208.241.0202.3619zM4.1326 18.0548c-1.6417 0-2.9726 1.331-2.9726 2.9726C1.16 22.6691 2.4909 24 4.1326 24s2.9726-1.3309 2.9726-2.9726-1.331-2.9726-2.9726-2.9726zm7.8728-9.0098c-.0171 0-.0342 0-.0513.0003-1.6495.0904-2.9293 1.474-2.891 3.1256v7.9846c0 2.167.9535 3.4825 2.3505 3.763 1.6118.3266 3.1832-.7152 3.5098-2.327.04-.1974.06-.3983.0593-.5998v-8.9585c.003-1.6474-1.33-2.9852-2.9773-2.9882z" fill="#E37400"></path></svg></span><span class="truncate">google_analytics</span><span class="ml-auto shrink-0 text-[0.82em] text-(--app-faint)">1 tables</span></button></div><div><button type="button" aria-expanded="false" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:20px"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><span class="shrink-0 text-(--app-muted)"><svg viewBox="0 0 24 24" class="w-3 h-3 shrink-0" role="img" aria-label="Search Console"><title>Search Console</title><path d="M8.548 1.156L6.832 2.872v1.682h1.716zm0 3.398v.035H6.832v-.035H3.386L0 7.844v3.577h2.826V8.94c0-.525.429-.954.954-.954h16.476c.525 0 .954.43.954.954v2.48h2.754V7.844l-3.386-3.29H17.3v.035h-1.717v-.035zm7.035 0H17.3V2.872l-1.717-1.716zM8.679 1.188V2.84h6.773V1.188zm11.471 7.07a.834.834 0 00-.132.01l-.543.002c-5.216.014-10.432-.008-15.648.01-.435-.063-.794.436-.716.883v2.264h17.812c-.016-.888.045-1.782-.034-2.666-.104-.342-.427-.502-.739-.502zm-15.422.634a.689.698 0 01.689.698.689.698 0 01-.689.697.689.698 0 01-.688-.697.689.698 0 01.688-.698zm2.134 0a.689.698 0 01.689.698.689.698 0 01-.689.697.689.698 0 01-.688-.697.689.698 0 01.688-.698zM.036 11.645v9.156c0 1.05.858 1.908 1.907 1.908h.883V11.645zm21.174 0v11.064h.882c1.05 0 1.908-.858 1.908-1.908v-9.156zM4.057 13.133v6.85h6.137v-6.85zm13.243.021v3.777l-1.708.977-1.708-.977v-3.758a4.006 4.006 0 000 7.23v2.441h3.457v-2.442a4.006 4.006 0 00-.041-7.248zm-13.243 8.26v1.43h7.925v-1.43z" fill="#458CF5"></path></svg></span><span class="truncate">search_console</span><span class="ml-auto shrink-0 text-[0.82em] text-(--app-faint)">1 tables</span></button></div><div><button type="button" aria-expanded="false" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:20px"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><span class="shrink-0 text-(--app-muted)"><svg viewBox="0 0 24 24" class="w-3 h-3 shrink-0" role="img" aria-label="Google Ads"><title>Google Ads</title><path d="M3.9998 22.9291C1.7908 22.9291 0 21.1383 0 18.9293s1.7908-3.9998 3.9998-3.9998 3.9998 1.7908 3.9998 3.9998-1.7908 3.9998-3.9998 3.9998zm19.4643-6.0004L15.4632 3.072C14.3586 1.1587 11.9121.5028 9.9988 1.60
16874S7.4295 5.1585 8.5341 7.0718l8.0009 13.8567c1.1046 1.9133 3.5511 2.5679 5.4644 1.4646 1.9134-1.1046 2.568-3.5511 1.4647-5.4644zM7.5137 4.8438L1.5645 15.1484A4.5 4.5 0 0 1 4 14.4297c2.5597-.0075 4.6248 2.1585 4.4941 4.7148l3.2168-5.5723-3.6094-6.25c-.4499-.7793-.6322-1.6394-.5878-2.4784z" fill="#4285F4"></path></svg></span><span class="truncate">google_ads</span><span class="ml-auto shrink-0 text-[0.82em] text-(--app-faint)">1 tables</span></button></div><div><button type="button" aria-expanded="false" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:20px"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><span class="shrink-0 text-(--app-muted)"><svg viewBox="0 0 24 24" class="w-3 h-3 shrink-0" role="img" aria-label="Meta Ads"><title>Meta Ads</title><path d="M6.915 4.03c-1.968 0-3.683 1.28-4.871 3.113C.704 9.208 0 11.883 0 14.449c0 .706.07 1.369.21 1.973a6.624 6.624 0 0 0 .265.86 5.297 5.297 0 0 0 .371.761c.696 1.159 1.818 1.927 3.593 1.927 1.497 0 2.633-.671 3.965-2.444.76-1.012 1.144-1.626 2.663-4.32l.756-1.339.186-.325c.061.1.121.196.183.3l2.152 3.595c.724 1.21 1.665 2.556 2.47 3.314 1.046.987 1.992 1.22 3.06 1.22 1.075 0 1.876-.355 2.455-.843a3.743 3.743 0 0 0 .81-.973c.542-.939.861-2.127.861-3.745 0-2.72-.681-5.357-2.084-7.45-1.282-1.912-2.957-2.93-4.716-2.93-1.047 0-2.088.467-3.053 1.308-.652.57-1.257 1.29-1.82 2.05-.69-.875-1.335-1.547-1.958-2.056-1.182-.966-2.315-1.303-3.454-1.303zm10.16 2.053c1.147 0 2.188.758 2.992 1.999 1.132 1.748 1.647 4.195 1.647 6.4 0 1.548-.368 2.9-1.839 2.9-.58 0-1.027-.23-1.664-1.004-.496-.601-1.343-1.878-2.832-4.358l-.617-1.028a44.908 44.908 0 0 0-1.255-1.98c.07-.109.141-.224.211-.327 1.12-1.667 2.118-2.602 3.358-2.602zm-10.201.553c1.265 0 2.058.791 2.675 1.446.307.327.737.871 1.234 1.579l-1.02 1.566c-.757 1.163-1.882 3.017-2.837 4.338-1.191 1.649-1.81 1.817-2.486 1.817-.524 0-1.038-.237-1.383-.794-.263-.426-.464-1.13-.464-2.046 0-2.221.63-4.535 1.66-6.088.454-.687.964-1.226 1.533-1.533a2.264 2.264 0 0 1 1.088-.285z" fill="#0467DF"></path></svg></span><span class="truncate">meta_ads</span><span class="ml-auto shrink-0 text-[0.82em] text-(--app-faint)">1 tables</span></button></div><div><button type="button" aria-expanded="false" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:20px"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><span class="shrink-0 text-(--app-muted)"><img src="/lp/vendors/close.svg" alt="Close" title="Close" loading="lazy" class="w-3 h-3 shrink-0 object-contain"/></span><span class="truncate">close_crm</span><span class="ml-auto shrink-0 text-[0.82em] text-(--app-faint)">2 tables</span></button></div><div><button type="button" aria-expanded="false" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:20px"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><span class="shrink-0 text-(--app-muted)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z"></path></svg></span><span class="truncate">marts</span><span class="ml-auto shrink-0 text-[0.82em] text-(--app-faint)">4 tables</span></button></div></div><div><button type="button" aria-expanded="false" class="w-full flex items-center gap-1.5 px-2 py-[3px] text-left text-[0.95em] transition-colors min-w-0 text-(--app-body) hover:bg-(--app-hover)" style="padding-left:8px"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><span class="shrink-0 text-(--app-muted)"><svg viewBox="0 0 24 24" class="w-3 h-3 shrink-0" role="img" aria-label="DuckDB"><title>DuckDB</title>
168<path d="M12 0C5.363 0 0 5.363 0 12s5.363 12 12 12 12-5.363 12-12S18.637 0 12 0zM9.502 7.03a4.974 4.974 0 0 1 4.97 4.97 4.974 4.974 0 0 1-4.97 4.97A4.974 4.974 0 0 1 4.532 12a4.974 4.974 0 0 1 4.97-4.97zm6.563 3.183h2.351c.98 0 1.787.782 1.787 1.762s-.807 1.789-1.787 1.789h-2.351v-3.551z" fill="#B8A800"></path></svg></span><span class="truncate">scratch</span><span class="ml-auto shrink-0 text-[0.82em] text-(--app-faint)">DuckDB</span></button></div></div></div><div class="flex-1 min-w-0 flex flex-col bg-(--app-panel)"><div class="flex items-end border-b border-(--app-line) bg-(--app-bg) overflow-x-auto"><span class="group flex items-center border-r border-(--app-line) whitespace-nowrap transition-colors bg-(--app-panel) border-b-2 border-b-(--app-accent)"><button type="button" class="flex items-center gap-1.5 pl-2.5 py-1.5 text-[0.91em] max-w-[150px] text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3 shrink-0" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="2"></rect><path d="m8 9 3 3-3 3"></path><path d="M13 15h3"></path></svg><span class="truncate">mrr_by_plan.sql</span></button><button type="button" aria-label="Close mrr_by_plan.sql" class="px-1.5 py-1.5"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2.5 h-2.5 text-(--app-muted) hover:text-(--app-ink)" aria-hidden="true"><path d="M18 6 6 18M6 6l12 12"></path></svg></button></span><span class="group flex items-center border-r border-(--app-line) whitespace-nowrap transition-colors "><button type="button" class="flex items-center gap-1.5 pl-2.5 py-1.5 text-[0.91em] max-w-[150px] text-(--app-muted) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3 shrink-0" aria-hidden="true"><path d="M21 12A9 9 0 1 1 12 3v9Z"></path><path d="M21.2 8A9 9 0 0 0 16 2.8V8Z"></path></svg><span class="truncate">revenue-overview</span></button><button type="button" aria-label="Close revenue-overview" class="px-1.5 py-1.5"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2.5 h-2.5 text-transparent group-hover:text-(--app-muted)" aria-hidden="true"><path d="M18 6 6 18M6 6l12 12"></path></svg></button></span><span class="group flex items-center border-r border-(--app-line) whitespace-nowrap transition-colors "><button type="button" class="flex items-center gap-1.5 pl-2.5 py-1.5 text-[0.91em] max-w-[150px] text-(--app-muted) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3 shrink-0" aria-hidden="true"><rect x="3" y="4" width="18" height="16" rx="1"></rect><path d="M3 10h18M9 4v16"></path></svg><span class="truncate">public.accounts</span></button><button type="button" aria-label="Close public.accounts" class="px-1.5 py-1.5"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2.5 h-2.5 text-transparent group-hover:text-(--app-muted)" aria-hidden="true"><path d="M18 6 6 18M6 6l12 12"></path></svg></button></span><button type="button" title="New console" aria-label="New console" class="px-2 py-1.5 text-(--app-muted) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M5 12h14M12 5v14"></path></svg></button></div><div class="flex items-center gap-1 px-2.5 py-1 text-[0.82em] text-(--app-muted) border-b border-(--app-line) overflow-x-auto whitespace-nowrap"><span class="flex items-center gap-1"><button type="button" class="hover:text-(--app-ink) hover:underline">helio-prod</button><span class="text-(--app-faint)">›</span></span><span class="flex items-center gap-1"><button type="button" class="hover:text-(--app-ink) hover:underline">Consoles</button><span class="text-(--app-faint)">›</span></span><span class="flex items-center gap-1"><button type="button" class="hover:text-(--app-ink) hover:underline">My Consoles</button><span class="text-(--app-faint)">›</span></span><span class="flex items-center gap-1"><button type="button" class="text-(--app-ink) font-medium">mrr_by_plan.sql</button></span></div><div class="flex-1 min-h-0 overflow-y-auto"><div class="flex flex-col min-h-full"><div class="flex items-center gap-1.5 px-2.5 py-1.5 border-b border-(--app-line) overflow-x-auto"><span class="group/tooltip relative inline-flex"><button type="button" aria-label="Run query" class="flex items-center gap-1 px-2 py-1 text-[0.91em] font-medium bg-(--app-accent) text-(--app-on-accent) rounded-sm select-none whitespace-nowrap hover:brightness-110 focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-(--app-accent)"><svg viewBox="0 0 24 24" fill="currentColor" class="w-2.5 h-2.5" aria-hidden="true"><path d="M8 5v14l11-7z"></path></svg>Run</button><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Run query (⌘/Ctrl+Enter)</span></span><button type="button" title="Schedule this query" class="hidden sm:flex items-center gap-1 px-2 py-1 text-[0.91em] border border-(--app-line) text-(--app-muted) rounded-sm select-none hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2.5 h-2.5" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg>Schedule</button><div class="ml-auto"><div class="relative"><button type="button" class="block" aria-haspopup="menu" aria-expanded="false">
168<span title="Choose database connection" class="flex items-center gap-1 px-2 py-1 text-[0.91em] border text-(--app-body) rounded-sm select-none max-w-[130px] border-(--app-line)"><span class="truncate">production-db</span><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 transition-transform " aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div></div></div><div class="flex px-3 py-2.5 font-mono text-[1em] leading-[1.7] text-(--app-ink) bg-(--app-panel) "><div class="w-4 shrink-0 mr-3 text-right text-(--app-faint) select-none" aria-hidden="true"><div>1</div><div>2</div><div>3</div><div>4</div><div>5</div><div>6</div><div>7</div></div><div class="sql-mini-editor min-h-[132px] flex-1 font-mono" style="position:relative;text-align:left;box-sizing:border-box;padding:0;overflow:hidden"><pre aria-hidden="true" style="margin:0;border:0;background:none;box-sizing:inherit;display:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-variant-ligatures:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;tab-size:inherit;text-indent:inherit;text-rendering:inherit;text-transform:inherit;white-space:pre-wrap;word-break:keep-all;overflow-wrap:break-word;position:relative;pointer-events:none;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0"><span class="token comment">-- MRR by plan, last 6 months</span>
169<span class="token keyword">SELECT</span> <span class="token keyword">plan</span><span class="token punctuation">,</span>
170       DATE_TRUNC<span class="token punctuation">(</span><span class="token string">'month'</span><span class="token punctuation">,</span> period<span class="token punctuation">)</span> <span class="token keyword">AS</span> <span class="token keyword">month</span><span class="token punctuation">,</span>
171       <span class="token function">SUM</span><span class="token punctuation">(</span>amount<span class="token punctuation">)</span> <span class="token operator">/</span> <span class="token number">100</span> <span class="token keyword">AS</span> mrr
172<span class="token keyword">FROM</span> stripe<span class="token punctuation">.</span>subscriptions
173<span class="token keyword">GROUP</span> <span class="token keyword">BY</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">2</span>
174<span class="token keyword">ORDER</span> <span class="token keyword">BY</span> <span class="token number">2</span><span class="token punctuation">,</span> <span class="token number">3</span> <span class="token keyword">DESC</span><span class="token punctuation">;</span><br /></pre><textarea style="margin:0;border:0;background:none;box-sizing:inherit;display:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-variant-ligatures:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;tab-size:inherit;text-indent:inherit;text-rendering:inherit;text-transform:inherit;white-space:pre-wrap;word-break:keep-all;overflow-wrap:break-word;position:absolute;top:0;left:0;height:100%;width:100%;resize:none;color:inherit;overflow:hidden;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-text-fill-color:transparent;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0" class="npm__react-simple-code-editor__textarea outline-none select-text" autoCapitalize="off" autoComplete="off" autoCorrect="off" spellCheck="false" data-gramm="false">-- MRR by plan, last 6 months
175SELECT plan,
176       DATE_TRUNC(&#x27;month&#x27;, period) AS month,
177       SUM(amount) / 100 AS mrr
178FROM stripe.subscriptions
179GROUP BY 1, 2
180ORDER BY 2, 3 DESC;</textarea><style>
181/**
182 * Reset the text fill color so that placeholder is visible
183 */
184.npm__react-simple-code-editor__textarea:empty {
185  -webkit-text-fill-color: inherit !important;
186}
187
188/**
189 * Hack to apply on some CSS on IE10 and IE11
190 */
191@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
192  /**
193    * IE doesn't support '-webkit-text-fill-color'
194    * So we use 'color: transparent' to make the text transparent on IE
195    * Unlike other browsers, it doesn't affect caret color in IE
196    */
197  .npm__react-simple-code-editor__textarea {
198    color: transparent !important;
199  }
200
201  .npm__react-simple-code-editor__textarea::selection {
202    background-color: #accef7 !important;
203    color: transparent !important;
204  }
205}
206</style></div></div><div class="border-t border-(--app-line) mt-auto"><div><div class="flex items-center gap-1 px-2 pt-1 border-b border-(--app-line)"><button type="button" class="px-2 py-1 text-[0.91em] border-b-2 -mb-px transition-colors border-(--app-accent) text-(--app-accent)">Results</button><button type="button" class="px-2 py-1 text-[0.91em] border-b-2 -mb-px transition-colors border-transparent text-(--app-muted) hover:text-(--app-ink)">Runs (2)</button><div class="ml-auto flex items-center pb-0.5"><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Table view" aria-label="Table view" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors bg-(--app-selected) text-(--app-accent)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><rect x="3" y="4" width="18" height="16" rx="1"></rect><path d="M3 10h18M9 4v16"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Table view</span></span><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="JSON view" aria-label="JSON view" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M8 3H7a2 2 0 0 0-2 2v4a2 2 0 0 1-2 2 2 2 0 0 1 2 2v4a2 2 0 0 0 2 2h1"></path><path d="M16 3h1a2 2 0 0 1 2 2v4a2 2 0 0 0 2 2 2 2 0 0 0-2 2v4a2 2 0 0 1-2 2h-1"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">JSON view</span></span><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Chart view" aria-label="Chart view" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M3 3v18h18"></path><path d="M7 15v-4M12 17V8M17 13v-2"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Chart view</span></span><span class="w-px h-3 bg-(--app-line) mx-1"></span><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Copy to clipboard" aria-label="Copy to clipboard" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><rect x="9" y="9" width="12" height="12" rx="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Copy to clipboard</span></span><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Download CSV" aria-label="Download CSV" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><path d="m7 10 5 5 5-5M12 15V3"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Download CSV</span></span></div></div><div class="overflow-x-auto"><table class="w-full font-mono text-[0.91em] text-(--app-body)"><thead><tr class="text-left text-(--app-muted) border-b border-(--app-line)"><th class="px-3 py-1 font-normal w-6">#</th><th class="px-3 py-1 font-normal">plan</th><th class="px-3 py-1 font-normal">month</th><th class="px-3 py-1 font-normal text-right">mrr</th></tr></thead><tbody><tr class="border-b border-(--app-line) last:border-b-0 hover:bg-(--app-hover)"><td class="px-3 py-1 text-(--app-faint)">1</td><td class="px-3 py-1">Scale</td><td class="px-3 py-1">2026-06</td><td class="px-3 py-1 text-right">91,860</td></tr><tr class="border-b border-(--app-line) last:border-b-0 hover:bg-(--app-hover)"><td class="px-3 py-1 text-(--app-faint)">2</td><td class="px-3 py-1">Team</td><td class="px-3 py-1">2026-06</td><td class="px-3 py-1 text-right">74,220</td></tr><tr class="border-b border-(--app-line) last:border-b-0 hover:bg-(--app-hover)"><td class="px-3 py-1 text-(--app-faint)">3</td><td class="px-3 py-1">Starter</td><td class="px-3 py-1">2026-06</td><td class="px-3 py-1 text-right">47,930</td></tr><tr class="border-b border-(--app-line) last:border-b-0 hover:bg-(--app-hover)"><td class="px-3 py-1 text-(--app-faint)">4</td><td class="px-3 py-1">Hobby</td><td class="px-3 py-1">2026-06</td><td class="px-3 py-1 text-right">21,510</td></tr><tr class="border-b border-(--app-line) last:border-b-0 hover:bg-(--app-hover)"><td class="px-3 py-1 text-(--app-faint)">5</td><td class="px-3 py-1">Scale</td><td class="px-3 py-1">2026-05</td><td class="px-3 py-1 text-right">84,130</td></tr><tr class="border-b border-(--app-line) last:border-b-0 hover:bg-(--app-hover)"><td class="px-3 py-1 text-(--app-faint)">6</td><td class="px-3 py-1">Team</td><td class="px-3 py-1">2026-05</td><td class="px-3 py-1 text-right">71,890</td></tr></tbody></table></div><div class="px-3 py-1.5 border-t border-(--app-line) text-[0.82em] text-(--app-muted) truncate">6 result(s) • executed in 84 ms at 08/07/2026, 11:42:19</div></div></div></div></div></div><div class="flex w-52 lg:w-56 xl:w-64 2xl:w-72 shrink-0 flex-col border-l border-(--app-line) bg-(--app-p
206anel)"><div class="flex items-center gap-1 px-2.5 py-1.5 border-b border-(--app-line)"><span class="text-[0.91em] font-semibold uppercase tracking-wider text-(--app-muted)">Chat</span><div class="ml-auto flex items-center gap-1.5 text-(--app-muted)"><button type="button" title="Copy conversation" aria-label="Copy conversation" class="hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><rect x="9" y="9" width="12" height="12" rx="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg></button><button type="button" title="New chat" aria-label="New chat" class="hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M5 12h14M12 5v14"></path></svg></button><div class="relative"><button type="button" class="block" aria-haspopup="menu" aria-expanded="false"><span title="Chat history" class="block transition-colors text-(--app-muted) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M3 12a9 9 0 1 0 2.64-6.36L3 8"></path><path d="M3 3v5h5"></path><path d="M12 7v5l3 2"></path></svg></span></button></div><button type="button" aria-label="Close chat" class="hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M18 6 6 18M6 6l12 12"></path></svg></button></div></div><div class="flex-1 overflow-y-auto p-2 space-y-2 text-[0.95em] leading-relaxed"><div class="bg-(--app-hover) border border-(--app-line) rounded-sm px-2.5 py-1.5 text-(--app-ink)">Which plans are churning fastest this quarter?</div><details class="group"><summary class="flex items-center gap-1 cursor-pointer list-none text-[0.91em] text-(--app-muted) hover:text-(--app-ink) [&amp;::-webkit-details-marker]:hidden"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 transition-transform group-open:rotate-90" aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg>Thought for 4 seconds</summary><div class="mt-1 ml-3.5 pl-2 border-l border-(--app-line) text-[0.91em] text-(--app-muted) leading-relaxed">Scanning schema: stripe.subscriptions has plan, amount, period, canceled_at. Monthly grain confirmed — no fan-out risk on this join.</div></details><div>I&#x27;ll compare cancellations against active subscriptions per plan. Your <span class="font-mono text-[0.91em] bg-(--app-hover) text-(--app-ink) px-1 py-px rounded-sm">stripe.subscriptions</span> table has a <span class="font-mono text-[0.91em] bg-(--app-hover) text-(--app-ink) px-1 py-px rounded-sm">canceled_at</span>column, so I&#x27;ll use that.</div><div class="flex items-center gap-2 border border-(--app-line) rounded-sm px-2 py-1 text-[0.91em]"><span class="text-(--app-body) truncate">Writing query in console</span><span class="ml-auto flex items-center gap-1 shrink-0 text-(--app-muted)">Done<svg viewBox="0 0 24 24" fill="none" stroke="var(--ok)" stroke-width="2.5" class="w-2.5 h-2.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg></span></div><div class="flex items-center gap-2 border border-(--app-line) rounded-sm px-2 py-1 text-[0.91em]"><span class="text-(--app-body) truncate">Running on production-db</span><span class="ml-auto flex items-center gap-1 shrink-0 text-(--app-muted)">Done<svg viewBox="0 0 24 24" fill="none" stroke="var(--ok)" stroke-width="2.5" class="w-2.5 h-2.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg></span></div><div class="border border-(--app-line) rounded-sm px-2.5 py-2"><div class="text-[0.82em] font-mono uppercase tracking-wider text-(--app-muted) mb-1.5">Churn rate by plan — Q3</div><div class="space-y-1.5 "><div class="flex items-center gap-2 min-w-0"><span class="w-14 shrink-0 text-[0.91em] text-(--app-muted) text-right truncate">Hobby</span><div class="flex-1 h-3 bg-(--chart-track)"><div class="h-full" style="width:68%;background-color:var(--chart-1)"></div></div></div><div class="flex items-center gap-2 min-w-0"><span class="w-14 shrink-0 text-[0.91em] text-(--app-muted) text-right truncate">Starter</span><div class="flex-1 h-3 bg-(--chart-track)"><div class="h-full" style="width:41%;background-color:var(--chart-2)"></div></div></div><div class="flex items-center gap-2 min-w-0"><span class="w-14 shrink-0 text-[0.91em] text-(--app-muted) text-right truncate">Team</span><div class="flex-1 h-3 bg-(--chart-track)"><div class="h-full" style="width:19%;background-color:var(--chart-3)"></div></div></div><div class="flex items-center gap-2 min-w-0"><span class="w-14 shrink-0 text-[0.91em] text-(--app-muted) text-right truncate">Scale</span><div class="flex-1 h-3 bg-(--chart-track)"><div class="h-full" style="width:8%;background-color:var(--chart-4)"></div></div></div></div></div><div>Hobby churns at<!-- --> <strong class="text-(--app-ink)">6.8%</strong> — mostly accounts that never connected a second data source. Want me to save this as a tile on <span class="font-mono text-[0.91em] bg-(--app-hover) text-(--app-ink) px-1 py-px rounded-sm">revenue-overview</span>?</div></div><div class="p-2 border-t border-(--app-line)">
206<div class="border border-(--app-line) rounded-sm bg-(--app-panel)"><input type="text" placeholder="Ask Chat..." aria-label="Ask Chat..." class="w-full bg-transparent px-2.5 pt-2 pb-1 text-[1em] text-(--app-ink) placeholder:text-(--app-faint) outline-none" value=""/><div class="flex items-center gap-1.5 px-2 pb-1.5"><div class="relative"><button type="button" class="block" aria-haspopup="menu" aria-expanded="false"><span class="flex items-center gap-1 text-[0.82em] border rounded-sm px-1.5 py-0.5 select-none transition-colors border-(--app-line) text-(--app-muted) hover:text-(--app-ink)">Fable 5<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2 h-2 transition-transform " aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><span class="group/tooltip relative inline-flex"><button type="button" aria-label="Attach image" class="ml-auto p-1 text-(--app-faint) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" class="w-3 h-3" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="2"></rect><circle cx="9" cy="9" r="2"></circle><path d="m21 15-3.1-3.1a2 2 0 0 0-2.8 0L6 21"></path></svg></button><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Attach image</span></span><button type="button" disabled="" title="Send message" aria-label="Send message" class="w-5 h-5 flex items-center justify-center rounded-full p-1 bg-(--app-hover) text-(--app-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" class="w-2.5 h-2.5" aria-hidden="true"><path d="M12 19V5m-7 7 7-7 7 7"></path></svg></button></div></div></div></div></div><div class="flex md:hidden h-full flex-col bg-(--app-panel)"><div class="flex-1 min-h-0 flex flex-col relative"><div class="flex items-center gap-2 px-2 py-1.5 border-b border-(--app-line) bg-(--app-bg)"><button type="button" aria-label="Open explorer" class="text-(--app-muted) hover:text-(--app-ink) p-1"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3.5 h-3.5" aria-hidden="true"><path d="M4 6h16M4 12h16M4 18h16"></path></svg></button><div class="flex-1 flex justify-center min-w-0"><div class="relative"><button type="button" class="block" aria-haspopup="menu" aria-expanded="false"><span class="flex items-center gap-1.5 px-2.5 py-1 text-[0.91em] border rounded-full max-w-[180px] transition-colors border-(--app-line) text-(--app-ink)"><span class="truncate">mrr_by_plan.sql</span><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div></div><button type="button" aria-label="New console" class="text-(--app-muted) p-1"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3.5 h-3.5" aria-hidden="true"><path d="M5 12h14M12 5v14"></path></svg></button></div><div class="flex-1 min-h-0 overflow-y-auto"><div class="flex px-3 py-2.5 font-mono text-[1em] leading-[1.7] text-(--app-ink) bg-(--app-panel) "><div class="w-4 shrink-0 mr-3 text-right text-(--app-faint) select-none" aria-hidden="true"><div>1</div><div>2</div><div>3</div><div>4</div><div>5</div><div>6</div><div>7</div></div><div class="sql-mini-editor min-h-[132px] flex-1 font-mono" style="position:relative;text-align:left;box-sizing:border-box;padding:0;overflow:hidden"><pre aria-hidden="true" style="margin:0;border:0;background:none;box-sizing:inherit;display:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-variant-ligatures:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;tab-size:inherit;text-indent:inherit;text-rendering:inherit;text-transform:inherit;white-space:pre-wrap;word-break:keep-all;overflow-wrap:break-word;position:relative;pointer-events:none;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0"><span class="token comment">-- MRR by plan, last 6 months</span>
207<span class="token keyword">SELECT</span> <span class="token keyword">plan</span><span class="token punctuation">,</span>
208       DATE_TRUNC<span class="token punctuation">(</span><span class="token string">'month'</span><span class="token punctuation">,</span> period<span class="token punctuation">)</span> <span class="token keyword">AS</span> <span class="token keyword">month</span><span class="token punctuation">,</span>
209       <span class="token function">SUM</span><span class="token punctuation">(</span>amount<span class="token punctuation">)</span> <span class="token operator">/</span> <span class="token number">100</span> <span class="token keyword">AS</span> mrr
210<span class="token keyword">FROM</span> stripe<span class="token punctuation">.</span>subscriptions
211<span class="token keyword">GROUP</span> <span class="token keyword">BY</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">2</span>
212<span class="token keyword">ORDER</span> <span class="token keyword">BY</span> <span class="token number">2</span><span class="token punctuation">,</span> <span class="token number">3</span> <span class="token keyword">DESC</span><span class="token punctuation">;</span><br /></pre><textarea style="margin:0;border:0;background:none;box-sizing:inherit;display:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-variant-ligatures:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;tab-size:inherit;text-indent:inherit;text-rendering:inherit;text-transform:inherit;white-space:pre-wrap;word-break:keep-all;overflow-wrap:break-word;position:absolute;top:0;left:0;height:100%;width:100%;resize:none;color:inherit;overflow:hidden;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-text-fill-color:transparent;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0" class="npm__react-simple-code-editor__textarea outline-none select-text" autoCapitalize="off" autoComplete="off" autoCorrect="off" spellCheck="false" data-gramm="false">-- MRR by plan, last 6 months
213SELECT plan,
214       DATE_TRUNC(&#x27;month&#x27;, period) AS month,
215       SUM(amount) / 100 AS mrr
216FROM stripe.subscriptions
217GROUP BY 1, 2
218ORDER BY 2, 3 DESC;</textarea><style>
219/**
220 * Reset the text fill color so that placeholder is visible
221 */
222.npm__react-simple-code-editor__textarea:empty {
223  -webkit-text-fill-color: inherit !important;
224}
225
226/**
227 * Hack to apply on some CSS on IE10 and IE11
228 */
229@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
230  /**
231    * IE doesn't support '-webkit-text-fill-color'
232    * So we use 'color: transparent' to make the text transparent on IE
233    * Unlike other browsers, it doesn't affect caret color in IE
234    */
235  .npm__react-simple-code-editor__textarea {
236    color: transparent !important;
237  }
238
239  .npm__react-simple-code-editor__textarea::selection {
240    background-color: #accef7 !important;
241    color: transparent !important;
242  }
243}
244</style></div></div></div><button type="button" aria-label="Run query" class="absolute bottom-3 right-3 w-9 h-9 flex items-center justify-center rounded-full bg-(--app-accent) text-(--app-on-accent) shadow-lg"><svg viewBox="0 0 24 24" fill="currentColor" class="w-3.5 h-3.5" aria-hidden="true"><path d="M8 5v14l11-7z"></path></svg></button></div><div class="flex border-t border-(--app-line) bg-(--app-bg)"><button type="button" aria-pressed="false" class="flex-1 flex flex-col items-center gap-0.5 py-1.5 text-[0.82em] transition-colors text-(--app-muted)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4" aria-hidden="true"><path d="M7.9 20A9 9 0 1 0 4 16.1L2 22Z"></path><path d="M8 12h.01M12 12h.01M16 12h.01"></path></svg>Ask</button><button type="button" aria-pressed="true" class="flex-1 flex flex-col items-center gap-0.5 py-1.5 text-[0.82em] transition-colors text-(--app-accent)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="2"></rect><path d="m8 9 3 3-3 3"></path><path d="M13 15h3"></path></svg>Editor</button><button type="button" aria-pressed="false" class="flex-1 flex flex-col items-center gap-0.5 py-1.5 text-[0.82em] transition-colors text-(--app-muted)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4" aria-hidden="true"><rect x="3" y="4" width="18" height="16" rx="1"></rect><path d="M3 10h18M9 4v16"></path></svg>Results</button></div></div></div></div><p class="mt-3 text-center text-xs text-(--muted)">This is a live miniature, not a screenshot — click through the sidebar, tabs, chats, and result views. The real thing just also runs your queries.</p><div class="mt-8 flex justify-center"><div class="flex flex-wrap items-center gap-x-4 gap-y-2 justify-center max-w-3xl opacity-80"><span class="flex items-center gap-1.5" title="PostgreSQL"><img src="/lp/vendors/postgresql.svg" alt="PostgreSQL" title="PostgreSQL" loading="lazy" class="w-5 h-5 shrink-0 object-contain"/></span><span class="flex items-center gap-1.5" title="ClickHouse"><img src="/lp/vendors/clickhouse.svg" alt="ClickHouse" title="ClickHouse" loading="lazy" class="w-5 h-5 shrink-0 object-contain"/></span><span class="flex items-center gap-1.5" title="BigQuery"><img src="/lp/vendors/bigquery.svg" alt="BigQuery" title="BigQuery" loading="lazy" class="w-5 h-5 shrink-0 object-contain"/></span><span class="flex items-center gap-1.5" title="MySQL"><img src="/lp/vendors/mysql.svg" alt="MySQL" title="MySQL" loading="lazy" class="w-5 h-5 shrink-0 object-contain"/></span><span class="flex items-center gap-1.5" title="MongoDB"><img src="/lp/vendors/mongodb.svg" alt="MongoDB" title="MongoDB" loading="lazy" class="w-5 h-5 shrink-0 object-contain"/></span><span class="flex items-center gap-1.5" title="DuckDB"><svg viewBox="0 0 24 24" class="w-5 h-5 shrink-0" role="img" aria-label="DuckDB"><title>DuckDB</title>
244<path d="M12 0C5.363 0 0 5.363 0 12s5.363 12 12 12 12-5.363 12-12S18.637 0 12 0zM9.502 7.03a4.974 4.974 0 0 1 4.97 4.97 4.974 4.974 0 0 1-4.97 4.97A4.974 4.974 0 0 1 4.532 12a4.974 4.974 0 0 1 4.97-4.97zm6.563 3.183h2.351c.98 0 1.787.782 1.787 1.762s-.807 1.789-1.787 1.789h-2.351v-3.551z" fill="#B8A800"></path></svg></span><span class="flex items-center gap-1.5" title="Stripe"><img src="/lp/vendors/stripe.svg" alt="Stripe" title="Stripe" loading="lazy" class="w-5 h-5 shrink-0 object-contain"/></span><span class="flex items-center gap-1.5" title="PostHog"><img src="/lp/vendors/posthog.svg" alt="PostHog" title="PostHog" loading="lazy" class="w-5 h-5 shrink-0 object-contain"/></span><span class="flex items-center gap-1.5" title="Google Analytics"><svg viewBox="0 0 24 24" class="w-5 h-5 shrink-0" role="img" aria-label="Google Analytics"><title>Google Analytics</title><path d="M22.84 2.9982v17.9987c.0086 1.6473-1.3197 2.9897-2.967 2.9984a2.9808 2.9808 0 01-.3677-.0208c-1.528-.226-2.6477-1.5558-2.6105-3.1V3.1204c-.0369-1.5458 1.0856-2.8762 2.6157-3.1 1.6361-.1915 3.1178.9796 3.3093 2.6158.014.1201.0208.241.0202.3619zM4.1326 18.0548c-1.6417 0-2.9726 1.331-2.9726 2.9726C1.16 22.6691 2.4909 24 4.1326 24s2.9726-1.3309 2.9726-2.9726-1.331-2.9726-2.9726-2.9726zm7.8728-9.0098c-.0171 0-.0342 0-.0513.0003-1.6495.0904-2.9293 1.474-2.891 3.1256v7.9846c0 2.167.9535 3.4825 2.3505 3.763 1.6118.3266 3.1832-.7152 3.5098-2.327.04-.1974.06-.3983.0593-.5998v-8.9585c.003-1.6474-1.33-2.9852-2.9773-2.9882z" fill="#E37400"></path></svg></span><span class="flex items-center gap-1.5" title="Search Console"><svg viewBox="0 0 24 24" class="w-5 h-5 shrink-0" role="img" aria-label="Search Console"><title>Search Console</title><path d="M8.548 1.156L6.832 2.872v1.682h1.716zm0 3.398v.035H6.832v-.035H3.386L0 7.844v3.577h2.826V8.94c0-.525.429-.954.954-.954h16.476c.525 0 .954.43.954.954v2.48h2.754V7.844l-3.386-3.29H17.3v.035h-1.717v-.035zm7.035 0H17.3V2.872l-1.717-1.716zM8.679 1.188V2.84h6.773V1.188zm11.471 7.07a.834.834 0 00-.132.01l-.543.002c-5.216.014-10.432-.008-15.648.01-.435-.063-.794.436-.716.883v2.264h17.812c-.016-.888.045-1.782-.034-2.666-.104-.342-.427-.502-.739-.502zm-15.422.634a.689.698 0 01.689.698.689.698 0 01-.689.697.689.698 0 01-.688-.697.689.698 0 01.688-.698zm2.134 0a.689.698 0 01.689.698.689.698 0 01-.689.697.689.698 0 01-.688-.697.689.698 0 01.688-.698zM.036 11.645v9.156c0 1.05.858 1.908 1.907 1.908h.883V11.645zm21.174 0v11.064h.882c1.05 0 1.908-.858 1.908-1.908v-9.156zM4.057 13.133v6.85h6.137v-6.85zm13.243.021v3.777l-1.708.977-1.708-.977v-3.758a4.006 4.006 0 000 7.23v2.441h3.457v-2.442a4.006 4.006 0 00-.041-7.248zm-13.243 8.26v1.43h7.925v-1.43z" fill="#458CF5"></path></svg></span><span class="flex items-center gap-1.5" title="Google Ads"><svg viewBox="0 0 24 24" class="w-5 h-5 shrink-0" role="img" aria-label="Google Ads"><title>Google Ads</title><path d="M3.9998 22.9291C1.7908 22.9291 0 21.1383 0 18.9293s1.7908-3.9998 3.9998-3.9998 3.9998 1.7908 3.9998 3.9998-1.7908 3.9998-3.9998 3.9998zm19.4643-6.0004L15.4632 3.072C14.3586 1.1587 11.9121.5028 9.9988 1.6074S7.4295 5.1585 8.5341 7.0718l8.0009 13.8567c1.1046 1.9133 3.5511 2.5679 5.4644 1.4646 1.9134-1.1046 2.568-3.5511 1.4647-5.4644zM7.5137 4.8438L1.5645 15.1484A4.5 4.5 0 0 1 4 14.4297c2.5597-.0075 4.6248 2.1585 4.4941 4.7148l3.2168-5.5723-3.6094-6.25c-.4499-.7793-.6322-1.6394-.5878-2.4784z" fill="#4285F4"></path></svg></span><span class="flex items-center gap-1.5" title="Meta Ads"><svg viewBox="0 0 24 24" class="w-5 h-5 shrink-0" role="img" aria-label="Meta Ads"><title>Meta Ads</title><path d="M6.915 4.03c-1.968 0-3.683 1.28-4.871 3.113C.704 9.208 0 11.883 0 14.449c0 .706.07 1.369.21 1.973a6.624 6.624 0 0 0 .265.86 5.297 5.297 0 0 0 .371.761c.696 1.159 1.818 1.927 3.593 1.927 1.497 0 2.633-.671 3.965-2.444.76-1.012 1.144-1.626 2.663-4.32l.756-1.339.186-.325c.061.1.121.196.183.3l2.152 3.595c.724 1.21 1.665 2.556 2.47 3.314 1.046.987 1.992 1.22 3.06 1.22 1.075 0 1.876-.355 2.455-.843a3.743 3.743 0 0 0 .81-.973c.542-.939.861-2.127.861-3.745 0-2.72-.681-5.357-2.084-7.45-1.282-1.912-2.957-2.93-4.716-2.93-1.047 0-2.088.467-3.053 1.308-.652.57-1.257 1.29-1.82 2.05-.69-.875-1.335-1.547-1.958-2.056-1.182-.966-2.315-1.303-3.454-1.303zm10.16 2.053c1.147 0 2.188.758 2.992 1.999 1.132 1.748 1.647 4.195 1.647 6.4 0 1.548-.368 2.9-1.839 2.9-.58 0-1.027-.23-1.664-1.004-.496-.601-1.343-1.878-2.832-4.358l-.617-1.028a44.908 44.908 0 0 0-1.255-1.98c.07-.109.141-.224.211-.327 1.12-1.66
2447 2.118-2.602 3.358-2.602zm-10.201.553c1.265 0 2.058.791 2.675 1.446.307.327.737.871 1.234 1.579l-1.02 1.566c-.757 1.163-1.882 3.017-2.837 4.338-1.191 1.649-1.81 1.817-2.486 1.817-.524 0-1.038-.237-1.383-.794-.263-.426-.464-1.13-.464-2.046 0-2.221.63-4.535 1.66-6.088.454-.687.964-1.226 1.533-1.533a2.264 2.264 0 0 1 1.088-.285z" fill="#0467DF"></path></svg></span><span class="flex items-center gap-1.5" title="Close"><img src="/lp/vendors/close.svg" alt="Close" title="Close" loading="lazy" class="w-5 h-5 shrink-0 object-contain"/></span></div></div></div></section></div><section id="platform" class="relative border-t border-(--line) px-6 py-24 bg-(--paper-2)/60 mt-16"><div class="relative max-w-5xl mx-auto"><div class="text-center mb-4"><div class="inline-block text-[11px] font-mono uppercase tracking-widest text-(--muted)"><span aria-hidden="true">[ </span>The Stack<span aria-hidden="true"> ]</span></div></div><h2 class="text-center text-3xl md:text-5xl font-bold tracking-tight mb-4">Five tools you can<!-- --> <span class="instrument_serif_1a8f1c64-module__BIdUMW__className italic font-normal">delete</span></h2><p class="text-center text-(--body) max-w-2xl mx-auto mb-16">Each module builds on the one before it. Start with the layer that hurts most — the rest is already there when you need it.</p><div class="space-y-0"><div><div class="relative lp-corners grid lg:grid-cols-[auto_1fr_1.1fr] gap-6 lg:gap-10 items-center bg-(--card) border border-(--line-2) shadow-[6px_6px_0_0_var(--shadow)] p-6 md:p-8"><div class="instrument_serif_1a8f1c64-module__BIdUMW__className italic text-5xl md:text-6xl text-(--line-2) leading-none">01</div><div class="min-w-0"><div class="text-[11px] font-mono uppercase tracking-widest text-(--muted) mb-1.5">ETL Connectors &amp; Flows</div><h3 class="text-xl md:text-2xl font-bold mb-2">ETL without the pipeline vendor</h3><div class="mb-3"><div class="inline-flex flex-wrap items-center gap-2 text-[12px]"><span class="font-mono uppercase tracking-wider text-(--muted)">Replaces</span><span class="border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)">Airbyte</span><span class="border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)">Fivetran</span></div></div><p class="text-(--body) text-[15px] leading-relaxed mb-4">Your ETL layer, like Airbyte or Fivetran — connect Stripe, PostHog, Close, or any REST API once, then let Flows sync them into your warehouse on a schedule, with run history per flow. No pipeline vendor, no per-connector pricing surprises.</p><a class="inline-flex items-center gap-2 font-medium border-b-2 border-(--ink) pb-0.5 hover:gap-3 transition-all" href="/etl">Explore <!-- -->ETL Connectors &amp; Flows<!-- --> <span aria-hidden="true">→</span></a></div><div class="hidden lg:block min-w-0"><div><div class="bg-(--app-panel) text-(--app-body) text-[11px] border border-(--frame-line) shadow-[6px_6px_0_0_var(--shadow)] overflow-hidden"><div class="flex items-center gap-2 px-3 py-1.5 border-b border-(--line-2) bg-(--paper-2) text-[10px] font-mono uppercase tracking-widest text-(--muted) select-none"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--ok)"></span><span class="truncate">Mako — Flows</span></div><div class="flex items-center gap-2 px-3 py-2 border-b border-(--app-line) bg-(--app-bg) min-w-0"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 102 90" fill="currentColor" class="w-3.5 h-3.5 shrink-0 text-(--app-ink)"><path d="m58 0 44 77-8 13H7L0 77 43 0h15ZM6 77l3 5 36-64 9 16 17 30h6L45 8 6 77Zm79-8H34l-3 5h64L55 5h-6l36 64Zm-48-5h28L51 39 37 64Z"></path></svg><span class="text-[1em] text-(--app-body) font-medium truncate">helio-prod › Flows</span><div class="ml-auto flex items-center gap-2 shrink-0"><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Refresh" aria-label="Refresh" disabled="" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-faint) cursor-default"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M21 12a9 9 0 1 1-2.64-6.36"></path><path d="M21 3v6h-6"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Refresh</span></span><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="New flow" aria-label="New flow" disabled="" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-faint) cursor-default"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M5 12h14M12 5v14"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">New flow</span></span></div></div><div><div class="py-1"><div><button type="button" class="w-full flex items-center gap-2 px-2.5 py-1.5 text-left text-[0.95em] hover:bg-(--app-hover) transition-colors min-w-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform rotate-90" aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg>
244<img src="/lp/vendors/stripe.svg" alt="Stripe" title="Stripe" loading="lazy" class="w-3 h-3 shrink-0 object-contain"/><span class="font-medium text-(--app-ink) truncate">Stripe</span><span class="text-(--app-faint)">→</span><span class="hidden xs:inline font-mono text-[0.91em] text-(--app-body) truncate">data warehouse.stripe</span><span class="hidden lg:flex items-center gap-1 text-[0.82em] text-(--app-muted) border border-(--app-line) rounded-sm px-1 py-px shrink-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2 h-2" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg>hourly</span><span class="ml-auto flex items-center gap-1.5 text-[0.82em] shrink-0" style="color:var(--ok)"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--ok)"></span><span class="hidden sm:inline">Synced 4m ago</span></span></button><div class="mx-2.5 mb-1.5 border border-(--app-line) rounded-sm"><div class="flex items-center gap-2 px-2 py-1 text-[0.86em] text-(--app-body) border-b border-(--app-line) last:border-b-0"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--ok)"></span><span>11:00</span><span class="text-(--app-muted)">12,431 rows</span><span class="ml-auto text-(--app-faint)">38s</span></div><div class="flex items-center gap-2 px-2 py-1 text-[0.86em] text-(--app-body) border-b border-(--app-line) last:border-b-0"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--ok)"></span><span>10:00</span><span class="text-(--app-muted)">11,982 rows</span><span class="ml-auto text-(--app-faint)">41s</span></div><div class="flex items-center gap-2 px-2 py-1 text-[0.86em] text-(--app-body) border-b border-(--app-line) last:border-b-0"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--ok)"></span><span>09:00</span><span class="text-(--app-muted)">12,014 rows</span><span class="ml-auto text-(--app-faint)">36s</span></div></div></div><div><button type="button" class="w-full flex items-center gap-2 px-2.5 py-1.5 text-left text-[0.95em] hover:bg-(--app-hover) transition-colors min-w-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><img src="/lp/vendors/posthog.svg" alt="PostHog" title="PostHog" loading="lazy" class="w-3 h-3 shrink-0 object-contain"/><span class="font-medium text-(--app-ink) truncate">PostHog</span><span class="text-(--app-faint)">→</span><span class="hidden xs:inline font-mono text-[0.91em] text-(--app-body) truncate">data warehouse.posthog</span><span class="hidden lg:flex items-center gap-1 text-[0.82em] text-(--app-muted) border border-(--app-line) rounded-sm px-1 py-px shrink-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2 h-2" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg>15 min</span><span class="ml-auto flex items-center gap-1.5 text-[0.82em] shrink-0" style="color:var(--ok)"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--ok)"></span><span class="hidden sm:inline">Synced 12m ago</span></span></button></div><div><button type="button" class="w-full flex items-center gap-2 px-2.5 py-1.5 text-left text-[0.95em] hover:bg-(--app-hover) transition-colors min-w-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><svg viewBox="0 0 24 24" class="w-3 h-3 shrink-0" role="img" aria-label="Google Analytics"><title>Google Analytics</title><path d="M22.84 2.9982v17.9987c.0086 1.6473-1.3197 2.9897-2.967 2.9984a2.9808 2.9808 0 01-.3677-.0208c-1.528-.226-2.6477-1.5558-2.6105-3.1V3.1204c-.0369-1.5458 1.0856-2.8762 2.6157-3.1 1.6361-.1915 3.1178.9796 3.3093 2.6158.014.1201.0208.241.0202.3619zM4.1326 18.0548c-1.6417 0-2.9726 1.331-2.9726 2.9726C1.16 22.6691 2.4909 24 4.1326 24s2.9726-1.3309 2.9726-2.9726-1.331-2.9726-2.9726-2.9726zm7.8728-9.0098c-.0171 0-.0342 0-.0513.0003-1.6495.0904-2.9293 1.474-2.891 3.1256v7.9846c0 2.167.9535 3.4825 2.3505 3.763 1.6118.3266 3.1832-.7152 3.5098-2.327.04-.1974.06-.3983.0593-.5998v-8.9585c.003-1.6474-1.33-2.9852-2.9773-2.9882z" fill="#E37400"></path></svg><span class="font-medium text-(--app-ink) truncate">Google Analytics</span><span class="text-(--app-faint)">→</span><span class="hidden xs:inline font-mono text-[0.91em] text-(--app-body) truncate">data warehouse.google_analytics</span><span class="hidden lg:flex items-center gap-1 text-[0.82em] text-(--app-muted) border border-(--app-line) rounded-sm px-1 py-px shrink-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2 h-2" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg>daily</span><span class="ml-auto flex items-center gap-1.5 text-[0.82em] shrink-0" style="color:var(--ok)"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--ok)"></span><span class="hidden sm:inline">Synced 6h ago</span></span></button></div><div><button type="button" class="w-full flex items-center gap-2 px-2.5 py-1.5 text-left text-[0.95em] hover:bg-(--app-hover) transition-colors min-w-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><svg viewBox="0 0 24 24" class="w-3 h-3 shrink-0" role="img" aria-label="Search Console"><title>Search Console</title><path d="M8.548 1.156L6.832 2.872v1.682h1.716zm0 3.398v.035H6.832v-.035H3.386L0 7.844v3.577h2.826V8.94c0-.525.429-.954.954-.954h16.476c.525 0 .954.43.954.954v2.48h2.754V7.844l-3.386-3.29H17.3v.035h-1.717v-.035zm7.035 0H17.3V2.872l-1.717-1.716zM8.679 1.188V2.84h6.773V1.188zm11.471 7.07a.834.834 0 00-.132.01l-.543.002c-5.216.014-10.432-.008-15.648.01-.435-.063-.794.436-.716.883v2.264h17.812c-.016-.888.045-1.782-.034-2.666-.104-.342-.427-.502-.739-.502zm-15.422.634a.689.698 0 01.689.698.689.698 0 01-.689.697.689.698 0 01-.688-.697.689.698 0 01.688-.698zm2.134 0a.689.698 0 01.689.698.689.698 0 01-.689.697.689.698 0 01-.688-.697.689.698 0 01.688-.698zM.036 11.645v9.156c0 1.05.858 1.908 1.907 1.908h.883V11.645zm21.174 0v11.064h.882c1.05 0 1.908-.858 1.908-1.908v-9.156zM4.057 13.133v6.85h6.137v-6.85zm13.243.021v3.777l-1.708.977-1.708-.977v-3.758a4.006 4.006 0 000 7.23v2.441h3.457v-2.442a4.006 4.006 0 00-.041-7.248zm-13.243 8.26v1.43h7.925v-1.43z" fill="#458CF5"></path></svg><span class="font-medium text-(--app-ink) truncate">Search Console</span><span class="text-(--app-faint)">→</span><span class="hidden xs:inline font-mono text-[0.91em] text-(--app-body) truncate">data warehouse.search_console</span><span class="hidden lg:flex items-center gap-1 text-[0.82em] text-(--app-muted) border border-(--app-line) rounded-sm px-1 py-px shrink-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2 h-2" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg>daily</span><span class="ml-auto flex items-center gap-1.5 text-[0.82em] shrink-0" style="color:var(--ok)"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--ok)"></span><span class="hidden sm:inline">Synced 6h ago</span></span></button></div><div><button type="button" class="w-full flex items-center gap-2 px-2.5 py-1.5 text-left text-[0.95em] hover:bg-(--app-hover) transition-colors min-w-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><svg viewBox="0 0 24 24" class="w-3 h-3 shrink-0" role="img" aria-label="Google Ads"><title>Google Ads</title><path d="M3.9998 22.9291C1.7908 22.9291 0 21.1383 0 18.9293s1.7908-3.9998 3.9998-3.9998 3.9998 1.7908 3.9998 3.9998-1.7908 3.9998-3.9998 3.9998zm19.4643-6.0004L15.4632 3.072C14.3586 1.1587 11.9121.5028 9.9988 1.60
24474S7.4295 5.1585 8.5341 7.0718l8.0009 13.8567c1.1046 1.9133 3.5511 2.5679 5.4644 1.4646 1.9134-1.1046 2.568-3.5511 1.4647-5.4644zM7.5137 4.8438L1.5645 15.1484A4.5 4.5 0 0 1 4 14.4297c2.5597-.0075 4.6248 2.1585 4.4941 4.7148l3.2168-5.5723-3.6094-6.25c-.4499-.7793-.6322-1.6394-.5878-2.4784z" fill="#4285F4"></path></svg><span class="font-medium text-(--app-ink) truncate">Google Ads</span><span class="text-(--app-faint)">→</span><span class="hidden xs:inline font-mono text-[0.91em] text-(--app-body) truncate">data warehouse.google_ads</span><span class="hidden lg:flex items-center gap-1 text-[0.82em] text-(--app-muted) border border-(--app-line) rounded-sm px-1 py-px shrink-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2 h-2" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg>hourly</span><span class="ml-auto flex items-center gap-1.5 text-[0.82em] shrink-0" style="color:var(--ok)"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--ok)"></span><span class="hidden sm:inline">Synced 40m ago</span></span></button></div><div><button type="button" class="w-full flex items-center gap-2 px-2.5 py-1.5 text-left text-[0.95em] hover:bg-(--app-hover) transition-colors min-w-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><svg viewBox="0 0 24 24" class="w-3 h-3 shrink-0" role="img" aria-label="Meta Ads"><title>Meta Ads</title><path d="M6.915 4.03c-1.968 0-3.683 1.28-4.871 3.113C.704 9.208 0 11.883 0 14.449c0 .706.07 1.369.21 1.973a6.624 6.624 0 0 0 .265.86 5.297 5.297 0 0 0 .371.761c.696 1.159 1.818 1.927 3.593 1.927 1.497 0 2.633-.671 3.965-2.444.76-1.012 1.144-1.626 2.663-4.32l.756-1.339.186-.325c.061.1.121.196.183.3l2.152 3.595c.724 1.21 1.665 2.556 2.47 3.314 1.046.987 1.992 1.22 3.06 1.22 1.075 0 1.876-.355 2.455-.843a3.743 3.743 0 0 0 .81-.973c.542-.939.861-2.127.861-3.745 0-2.72-.681-5.357-2.084-7.45-1.282-1.912-2.957-2.93-4.716-2.93-1.047 0-2.088.467-3.053 1.308-.652.57-1.257 1.29-1.82 2.05-.69-.875-1.335-1.547-1.958-2.056-1.182-.966-2.315-1.303-3.454-1.303zm10.16 2.053c1.147 0 2.188.758 2.992 1.999 1.132 1.748 1.647 4.195 1.647 6.4 0 1.548-.368 2.9-1.839 2.9-.58 0-1.027-.23-1.664-1.004-.496-.601-1.343-1.878-2.832-4.358l-.617-1.028a44.908 44.908 0 0 0-1.255-1.98c.07-.109.141-.224.211-.327 1.12-1.667 2.118-2.602 3.358-2.602zm-10.201.553c1.265 0 2.058.791 2.675 1.446.307.327.737.871 1.234 1.579l-1.02 1.566c-.757 1.163-1.882 3.017-2.837 4.338-1.191 1.649-1.81 1.817-2.486 1.817-.524 0-1.038-.237-1.383-.794-.263-.426-.464-1.13-.464-2.046 0-2.221.63-4.535 1.66-6.088.454-.687.964-1.226 1.533-1.533a2.264 2.264 0 0 1 1.088-.285z" fill="#0467DF"></path></svg><span class="font-medium text-(--app-ink) truncate">Meta Ads</span><span class="text-(--app-faint)">→</span><span class="hidden xs:inline font-mono text-[0.91em] text-(--app-body) truncate">data warehouse.meta_ads</span><span class="hidden lg:flex items-center gap-1 text-[0.82em] text-(--app-muted) border border-(--app-line) rounded-sm px-1 py-px shrink-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2 h-2" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg>hourly</span><span class="ml-auto flex items-center gap-1.5 text-[0.82em] shrink-0" style="color:var(--ok)"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--ok)"></span><span class="hidden sm:inline">Synced 42m ago</span></span></button></div><div><button type="button" class="w-full flex items-center gap-2 px-2.5 py-1.5 text-left text-[0.95em] hover:bg-(--app-hover) transition-colors min-w-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><img src="/lp/vendors/close.svg" alt="Close" title="Close" loading="lazy" class="w-3 h-3 shrink-0 object-contain"/><span class="font-medium text-(--app-ink) truncate">Close</span><span class="text-(--app-faint)">→</span><span class="hidden xs:inline font-mono text-[0.91em] text-(--app-body) truncate">data warehouse.close_crm</span><span class="hidden lg:flex items-center gap-1 text-[0.82em] text-(--app-muted) border border-(--app-line) rounded-sm px-1 py-px shrink-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2 h-2" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg>hourly</span><span class="ml-auto flex items-center gap-1.5 text-[0.82em] shrink-0" style="color:var(--ok)"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--ok)"></span><span class="hidden sm:inline">Synced 58m ago</span></span></button></div><div><button type="button" class="w-full flex items-center gap-2 px-2.5 py-1.5 text-left text-[0.95em] hover:bg-(--app-hover) transition-colors min-w-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2.5 h-2.5 shrink-0 text-(--app-muted) transition-transform " aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg><img src="/lp/vendors/rest.svg" alt="REST API" title="REST API" loading="lazy" class="w-3 h-3 shrink-0 object-contain"/><span class="font-medium text-(--app-ink) truncate">REST API</span><span class="text-(--app-faint)">→</span><span class="hidden xs:inline font-mono text-[0.91em] text-(--app-body) truncate">scratch.main</span><span class="hidden lg:flex items-center gap-1 text-[0.82em] text-(--app-muted) border border-(--app-line) rounded-sm px-1 py-px shrink-0"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2 h-2" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg>nightly</span><span class="ml-auto flex items-center gap-1.5 text-[0.82em] shrink-0" style="color:var(--warn)"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--warn)"></span><span class="hidden sm:inline">Next run 02:00</span></span></button></div></div><div class="px-2.5 py-1.5 border-t border-(--app-line) text-[0.82em] text-(--app-faint)">8<!-- --> flows · all healthy · click a flow for run history</div></div></div></div></div></div><div class="flex justify-center py-2"><span class="text-(--inv-muted) text-xl" aria-hidden="true">↓</span></div></div><div><div class="relative lp-corners grid lg:grid-cols-[auto_1fr_1.1fr] gap-6 lg:gap-10 items-center bg-(--card) border border-(--line-2) shadow-[6px_6px_0_0_var(--shadow)] p-6 md:p-8"><div class="instrument_serif_1a8f1c64-module__BIdUMW__className italic text-5xl md:text-6xl text-(--line-2) leading-none">
24402</div><div class="min-w-0"><div class="text-[11px] font-mono uppercase tracking-widest text-(--muted) mb-1.5">dbt Transforms</div><h3 class="text-xl md:text-2xl font-bold mb-2">Your dbt project, run by an agent</h3><div class="mb-3"><div class="inline-flex flex-wrap items-center gap-2 text-[12px]"><span class="font-mono uppercase tracking-wider text-(--muted)">Replaces</span><span class="border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)">dbt Cloud</span></div></div><p class="text-(--body) text-[15px] leading-relaxed mb-4"></p><a class="inline-flex items-center gap-2 font-medium border-b-2 border-(--ink) pb-0.5 hover:gap-3 transition-all" href="/dbt-transforms">Explore <!-- -->dbt Transforms<!-- --> <span aria-hidden="true">→</span></a></div><div class="hidden lg:block min-w-0"></div></div><div class="flex justify-center py-2"><span class="text-(--inv-muted) text-xl" aria-hidden="true">↓</span></div></div><div><div class="relative lp-corners grid lg:grid-cols-[auto_1fr_1.1fr] gap-6 lg:gap-10 items-center bg-(--card) border border-(--line-2) shadow-[6px_6px_0_0_var(--shadow)] p-6 md:p-8"><div class="instrument_serif_1a8f1c64-module__BIdUMW__className italic text-5xl md:text-6xl text-(--line-2) leading-none">03</div><div class="min-w-0"><div class="text-[11px] font-mono uppercase tracking-widest text-(--muted) mb-1.5">SQL Client</div><h3 class="text-xl md:text-2xl font-bold mb-2">The AI-native SQL client</h3><div class="mb-3"><div class="inline-flex flex-wrap items-center gap-2 text-[12px]"><span class="font-mono uppercase tracking-wider text-(--muted)">Replaces</span><span class="border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)">DataGrip</span><span class="border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)">DBeaver</span><span class="border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)">TablePlus</span></div></div><p class="text-(--body) text-[15px] leading-relaxed mb-4">Your SQL client, like DataGrip but in the browser — Run is ⌘/Ctrl+Enter, results flip between table, JSON, and chart, and the agent writes SQL against your real schema. Consoles and connections are shared: My Consoles for you, Workspace for the team.</p><a class="inline-flex items-center gap-2 font-medium border-b-2 border-(--ink) pb-0.5 hover:gap-3 transition-all" href="/sql-client">Explore <!-- -->SQL Client<!-- --> <span aria-hidden="true">→</span></a></div><div class="hidden lg:block min-w-0"><div><div class="bg-(--app-panel) text-(--app-body) text-[11px] border border-(--frame-line) shadow-[6px_6px_0_0_var(--shadow)] overflow-hidden"><div class="flex items-center gap-2 px-3 py-1.5 border-b border-(--line-2) bg-(--paper-2) text-[10px] font-mono uppercase tracking-widest text-(--muted) select-none"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--ok)"></span><span class="truncate">Mako — Console</span></div><div class="flex items-center gap-2 px-3 py-2 border-b border-(--app-line) bg-(--app-bg) min-w-0"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 102 90" fill="currentColor" class="w-3.5 h-3.5 shrink-0 text-(--app-ink)"><path d="m58 0 44 77-8 13H7L0 77 43 0h15ZM6 77l3 5 36-64 9 16 17 30h6L45 8 6 77Zm79-8H34l-3 5h64L55 5h-6l36 64Zm-48-5h28L51 39 37 64Z"></path></svg><span class="text-[1em] text-(--app-body) font-medium truncate">helio-prod › Consoles › mrr_by_plan.sql</span><div class="ml-auto flex items-center gap-2 shrink-0"><span class="text-[0.82em] text-(--app-faint)">Saved</span></div></div><div class="flex items-center gap-1.5 px-2.5 py-1.5 border-b border-(--app-line) overflow-x-auto"><span class="group/tooltip relative inline-flex"><button type="button" aria-label="Run query" class="flex items-center gap-1 px-2 py-1 text-[0.91em] font-medium bg-(--app-accent) text-(--app-on-accent) rounded-sm select-none whitespace-nowrap hover:brightness-110 focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-(--app-accent)"><svg viewBox="0 0 24 24" fill="currentColor" class="w-2.5 h-2.5" aria-hidden="true"><path d="M8 5v14l11-7z"></path></svg>Run</button><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Run query (⌘/Ctrl+Enter)</span></span><button type="button" title="Schedule this query" class="hidden sm:flex items-center gap-1 px-2 py-1 text-[0.91em] border border-(--app-line) text-(--app-muted) rounded-sm select-none hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-2.5 h-2.5" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg>Schedule</button><div class="ml-auto"><div class="relative"><button type="button" class="block" aria-haspopup="menu" aria-expanded="false">
244<span title="Choose database connection" class="flex items-center gap-1 px-2 py-1 text-[0.91em] border text-(--app-body) rounded-sm select-none max-w-[130px] border-(--app-line)"><span class="truncate">production-db</span><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2.5 h-2.5 shrink-0 transition-transform " aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div></div></div><div class="px-3 py-2.5 font-mono text-[1em] leading-[1.7] text-(--app-ink) bg-(--app-panel) overflow-x-auto "><div class="flex gap-3 whitespace-pre"><span class="w-4 shrink-0 text-right text-(--app-faint) select-none">1</span><span><span class="text-(--syn-cmt)">-- MRR by plan, last 6 months</span></span></div><div class="flex gap-3 whitespace-pre"><span class="w-4 shrink-0 text-right text-(--app-faint) select-none">2</span><span><span><span class="text-(--syn-kw)">SELECT</span> plan,</span></span></div><div class="flex gap-3 whitespace-pre"><span class="w-4 shrink-0 text-right text-(--app-faint) select-none">3</span><span><span>       <span class="text-(--syn-fn)">DATE_TRUNC</span>(<span class="text-(--syn-str)">&#x27;month&#x27;</span>, period)<!-- --> <span class="text-(--syn-kw)">AS</span> month,</span></span></div><div class="flex gap-3 whitespace-pre"><span class="w-4 shrink-0 text-right text-(--app-faint) select-none">4</span><span><span>       <span class="text-(--syn-fn)">SUM</span>(amount) / 100 <span class="text-(--syn-kw)">AS</span>
244 mrr</span></span></div><div class="flex gap-3 whitespace-pre"><span class="w-4 shrink-0 text-right text-(--app-faint) select-none">5</span><span><span><span class="text-(--syn-kw)">FROM</span> stripe.subscriptions</span></span></div><div class="flex gap-3 whitespace-pre"><span class="w-4 shrink-0 text-right text-(--app-faint) select-none">6</span><span><span><span class="text-(--syn-kw)">GROUP BY</span> 1, 2</span></span></div><div class="flex gap-3 whitespace-pre"><span class="w-4 shrink-0 text-right text-(--app-faint) select-none">7</span><span><span><span class="text-(--syn-kw)">ORDER BY</span> 2, 3 <span class="text-(--syn-kw)">DESC</span>;</span></span></div></div><div class="border-t border-(--app-line)"><div><div class="flex items-center gap-1 px-2 pt-1 border-b border-(--app-line)"><button type="button" class="px-2 py-1 text-[0.91em] border-b-2 -mb-px transition-colors border-(--app-accent) text-(--app-accent)">Results</button><button type="button" class="px-2 py-1 text-[0.91em] border-b-2 -mb-px transition-colors border-transparent text-(--app-muted) hover:text-(--app-ink)">Runs (2)</button><div class="ml-auto flex items-center pb-0.5"><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Table view" aria-label="Table view" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors bg-(--app-selected) text-(--app-accent)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><rect x="3" y="4" width="18" height="16" rx="1"></rect><path d="M3 10h18M9 4v16"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Table view</span></span><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="JSON view" aria-label="JSON view" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M8 3H7a2 2 0 0 0-2 2v4a2 2 0 0 1-2 2 2 2 0 0 1 2 2v4a2 2 0 0 0 2 2h1"></path><path d="M16 3h1a2 2 0 0 1 2 2v4a2 2 0 0 0 2 2 2 2 0 0 0-2 2v4a2 2 0 0 1-2 2h-1"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">JSON view</span></span><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Chart view" aria-label="Chart view" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M3 3v18h18"></path><path d="M7 15v-4M12 17V8M17 13v-2"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Chart view</span></span><span class="w-px h-3 bg-(--app-line) mx-1"></span><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Copy to clipboard" aria-label="Copy to clipboard" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><rect x="9" y="9" width="12" height="12" rx="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Copy to clipboard</span></span><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Download CSV" aria-label="Download CSV" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><path d="m7 10 5 5 5-5M12 15V3"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Download CSV</span></span></div></div><div class="overflow-x-auto"><table class="w-full font-mono text-[0.91em] text-(--app-body)"><thead><tr class="text-left text-(--app-muted) border-b border-(--app-line)"><th class="px-3 py-1 font-normal w-6">#</th><th class="px-3 py-1 font-normal">plan</th><th class="px-3 py-1 font-normal">month</th><th class="px-3 py-1 font-normal text-right">mrr</th></tr></thead><tbody><tr class="border-b border-(--app-line) last:border-b-0 hover:bg-(--app-hover)"><td class="px-3 py-1 text-(--app-faint)">1</td><td class="px-3 py-1">Scale</td><td class="px-3 py-1">2026-06</td><td class="px-3 py-1 text-right">91,860</td></tr><tr class="border-b border-(--app-line) last:border-b-0 hover:bg-(--app-hover)"><td class="px-3 py-1 text-(--app-faint)">2</td><td class="px-3 py-1">Team</td><td class="px-3 py-1">2026-06</td><td class="px-3 py-1 text-right">74,220</td></tr><tr class="border-b border-(--app-line) last:border-b-0 hover:bg-(--app-hover)"><td class="px-3 py-1 text-(--app-faint)">3</td><td class="px-3 py-1">Starter</td><td class="px-3 py-1">2026-06</td><td class="px-3 py-1 text-right">47,930</td></tr><tr class="border-b border-(--app-line) last:border-b-0 hover:bg-(--app-hover)"><td class="px-3 py-1 text-(--app-faint)">4</td><td class="px-3 py-1">Hobby</td><td class="px-3 py-1">2026-06</td><td class="px-3 py-1 text-right">21,510</td></tr><tr class="border-b border-(--app-line) last:border-b-0 hover:bg-(--app-hover)"><td class="px-3 py-1 text-(--app-faint)">5</td><td class="px-3 py-1">Scale</td><td class="px-3 py-1">2026-05</td><td class="px-3 py-1 text-right">84,130</td></tr><tr class="border-b border-(--app-line) last:border-b-0 hover:bg-(--app-hover)"><td class="px-3 py-1 text-(--app-faint)">6</td><td class="px-3 py-1">Team</td><td class="px-3 py-1">2026-05</td><td class="px-3 py-1 text-right">71,890</td></tr></tbody></table></div><div class="px-3 py-1.5 border-t border-(--app-line) text-[0.82em] text-(--app-muted) truncate">6 result(s) • executed in 84 ms at 08/07/2026, 11:42:19</div></div></div></div></div></div></div><div class="flex justify-center py-2"><span class="text-(--inv-muted) text-xl" aria-hidden="true">↓</span></div></div><div><div class="relative lp-corners grid lg:grid-cols-[auto_1fr_1.1fr] gap-6 lg:gap-10 items-center bg-(--card) border border-(--line-2) shadow-[6px_6px_0_0_var(--shadow)] p-6 md:p-8"><div class="instrument_serif_1a8f1c64-module__BIdUMW__className italic text-5xl md:text-6xl text-(--line-2) leading-none">04</div><div class="min-w-0"><div class="text-[11px] font-mono uppercase tracking-widest text-(--muted) mb-1.5">Dashboards</div><h3 class="text-xl md:text-2xl font-bold mb-2">Dashboards the agent builds for you</h3><div class="mb-3"><div class="inline-flex flex-wrap items-center gap-2 text-[12px]"><span class="font-mono uppercase tracking-wider text-(--muted)">Replaces</span><span class="border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)">Tableau</span><span class="border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)">Looker Studio</span></div></div><p class="text-(--body) text-[15px] leading-relaxed mb-4">Your BI layer, like Tableau or Looker Studio — except you describe the dashboard and the agent assembles the tiles from your saved queries and dbt models. Flip between View and Edit, or drop into the code behind any widget.</p><a class="inline-flex items-center gap-2 font-medium border-b-2 border-(--ink) pb-0.5 hover:gap-3 transition-all" href="/dashboards">Explore <!-- -->Dashboards<!-- --> <span aria-hidden="true">→</span></a></div><div class="hidden lg:block min-w-0"><div>
244<div class="bg-(--app-panel) text-(--app-body) text-[11px] border border-(--frame-line) shadow-[6px_6px_0_0_var(--shadow)] overflow-hidden"><div class="flex items-center gap-2 px-3 py-1.5 border-b border-(--line-2) bg-(--paper-2) text-[10px] font-mono uppercase tracking-widest text-(--muted) select-none"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--ok)"></span><span class="truncate">Mako — Dashboards</span></div><div class="flex items-center gap-2 px-3 py-2 border-b border-(--app-line) bg-(--app-bg) min-w-0"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 102 90" fill="currentColor" class="w-3.5 h-3.5 shrink-0 text-(--app-ink)"><path d="m58 0 44 77-8 13H7L0 77 43 0h15ZM6 77l3 5 36-64 9 16 17 30h6L45 8 6 77Zm79-8H34l-3 5h64L55 5h-6l36 64Zm-48-5h28L51 39 37 64Z"></path></svg><span class="text-[1em] text-(--app-body) font-medium truncate">helio-prod › Dashboards › revenue-overview</span><div class="ml-auto flex items-center gap-2 shrink-0"><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Share" aria-label="Share" disabled="" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-faint) cursor-default"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><path d="m16 6-4-4-4 4M12 2v13"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Share</span></span></div></div><div><div class="flex items-center gap-1 px-2 py-1.5 border-b border-(--app-line) overflow-x-auto"><div class="flex items-center border border-(--app-line) rounded-sm"><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="View mode" aria-label="View mode" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors bg-(--app-selected) text-(--app-accent)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7Z"></path><circle cx="12" cy="12" r="3"></circle></svg>View</button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">View mode</span></span><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Edit mode" aria-label="Edit mode" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"></path><path d="m15 5 4 4"></path></svg>Edit</button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Edit mode</span></span></div><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Reload data" aria-label="Reload data" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M21 12a9 9 0 1 1-2.64-6.36"></path><path d="M21 3v6h-6"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Reload data</span></span><div class="ml-auto flex items-center border border-(--app-line) rounded-sm"><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Canvas" aria-label="Canvas" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors bg-(--app-selected) text-(--app-accent)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M21 12A9 9 0 1 1 12 3v9Z"></path><path d="M21.2 8A9 9 0 0 0 16 2.8V8Z"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Canvas</span></span><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Code" aria-label="Code" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-muted) hover:bg-(--app-hover) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="m16 18 6-6-6-6M8 6l-6 6 6 6"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Code</span></span></div></div><div class="p-2.5"><div class="grid grid-cols-3 gap-2 mb-2.5"><div class="border rounded-sm px-2 py-1.5 min-w-0 border-(--app-line)"><div class="text-[1.27em] font-bold text-(--app-ink) truncate">$214k</div><div class="text-[0.82em] text-(--app-muted) truncate">MRR</div><div class="text-[0.82em]" style="color:var(--ok)">+9.2%</div></div><div class="border rounded-sm px-2 py-1.5 min-w-0 border-(--app-line)"><div class="text-[1.27em] font-bold text-(--app-ink) truncate">1,204</div><div class="text-[0.82em] text-(--app-muted) truncate">Accounts</div><div class="text-[0.82em]" style="color:var(--ok)">+4.1%</div></div><div class="border rounded-sm px-2 py-1.5 min-w-0 border-(--app-line)"><div class="text-[1.27em] font-bold text-(--app-ink) truncate">3.1%</div><div class="text-[0.82em] text-(--app-muted) truncate">Churn</div><div class="text-[0.82em]" style="color:var(--ok)">-0.4%</div></div></div><div class="border rounded-sm px-2.5 py-2 border-(--app-line)"><div class="text-[0.82em] font-mono uppercase tracking-wider text-(--app-muted) mb-1.5">Revenue by plan · source: mrr_by_plan.sql</div><div class="space-y-1.5 "><div class="flex items-center gap-2 min-w-0"><span class="w-14 shrink-0 text-[0.91em] text-(--app-muted) text-right truncate">Scale</span><div class="flex-1 h-3 bg-(--chart-track)"><div class="h-full" style="width:92%;background-color:var(--chart-1)"></div></div></div><div class="flex items-center gap-2 min-w-0"><span class="w-14 shrink-0 text-[0.91em] text-(--app-muted) text-right truncate">Team</span><div class="flex-1 h-3 bg-(--chart-track)"><div class="h-full" style="width:74%;background-color:var(--chart-2)"></div></div></div><div class="flex items-center gap-2 min-w-0"><span class="w-14 shrink-0 text-[0.91em] text-(--app-muted) text-right truncate">Starter</span><div class="flex-1 h-3 bg-(--chart-track)"><div class="h-full" style="width:48%;background-color:var(--chart-3)"></div></div></div><div class="flex items-center gap-2 min-w-0"><span class="w-14 shrink-0 text-[0.91em] text-(--app-muted) text-right truncate">Hobby</span><div class="flex-1 h-3 bg-(--chart-track)"><div class="h-full" style="width:22%;background-color:var(--chart-4)"></div></div></div></div></div><div class="mt-1.5 text-[0.82em] text-(--app-faint)">Data refreshed just now · in-browser DuckDB · shared with workspace</div></div></div></div></div></div></div><div class="flex justify-center py-2"><span class="text-(--inv-muted) text-xl" aria-hidden="true">↓</span></div></div><div><div class="relative lp-corners grid lg:grid-cols-[auto_1fr_1.1fr] gap-6 lg:gap-10 items-center bg-(--card) border border-(--line-2) shadow-[6px_6px_0_0_var(--shadow)] p-6 md:p-8"><div class="instrument_serif_1a8f1c64-module__BIdUMW__className italic text-5xl md:text-6xl text-(--line-2) leading-none">05</div><div class="min-w-0"><div class="text-[11px] font-mono uppercase tracking-widest text-(--muted) mb-1.5">Apps</div><h3 class="text-xl md:text-2xl font-bold mb-2">Full React apps on your data layer</h3><div class="mb-3"><div class="inline-flex flex-wrap items-center gap-2 text-[12px]"><span class="font-mono uppercase tracking-wider text-(--muted)">Replaces</span><span class="border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)">Lovable</span><span class="border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)">Replit</span><span class="border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)">Retool</span></div></div><p class="text-(--body) text-[15px] leading-relaxed mb-4">Your app builder, like Lovable or Retool — but the data layer is already bound: models, saved queries, auth. Prompt your way to a full React app, iterate in chat next to a live preview, then hit Publish.</p><a class="inline-flex items-center gap-2 font-medium border-b-2 border-(--ink) pb-0.5 hover:gap-3 transition-all" href="/app-builder">Explore <!-- -->Apps<!-- --> <span aria-hidden="true">→</span></a></div><div class="hidden lg:block min-w-0"><div>
244<div class="bg-(--app-panel) text-(--app-body) text-[11px] border border-(--frame-line) shadow-[6px_6px_0_0_var(--shadow)] overflow-hidden"><div class="flex items-center gap-2 px-3 py-1.5 border-b border-(--line-2) bg-(--paper-2) text-[10px] font-mono uppercase tracking-widest text-(--muted) select-none"><span class="inline-block w-1.5 h-1.5 rounded-full shrink-0" style="background-color:var(--ok)"></span><span class="truncate">Mako — Apps</span></div><div class="flex items-center gap-2 px-3 py-2 border-b border-(--app-line) bg-(--app-bg) min-w-0"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 102 90" fill="currentColor" class="w-3.5 h-3.5 shrink-0 text-(--app-ink)"><path d="m58 0 44 77-8 13H7L0 77 43 0h15ZM6 77l3 5 36-64 9 16 17 30h6L45 8 6 77Zm79-8H34l-3 5h64L55 5h-6l36 64Zm-48-5h28L51 39 37 64Z"></path></svg><span class="text-[1em] text-(--app-body) font-medium truncate">helio-prod › Apps › account-health</span><div class="ml-auto flex items-center gap-2 shrink-0"><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Refresh preview" aria-label="Refresh preview" disabled="" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-faint) cursor-default"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M21 12a9 9 0 1 1-2.64-6.36"></path><path d="M21 3v6h-6"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Refresh preview</span></span><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="History" aria-label="History" disabled="" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-faint) cursor-default"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M3 12a9 9 0 1 0 2.64-6.36L3 8"></path><path d="M3 3v5h5"></path><path d="M12 7v5l3 2"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">History</span></span><span class="group/tooltip relative inline-flex"><span class="inline-flex"><button type="button" title="Share" aria-label="Share" disabled="" class="flex items-center gap-1 px-1.5 py-1 text-[0.91em] transition-colors text-(--app-faint) cursor-default"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="w-3 h-3" aria-hidden="true"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><path d="m16 6-4-4-4 4M12 2v13"></path></svg></button></span><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Share</span></span><span class="px-1.5 py-0.5 text-[0.82em] font-medium bg-(--app-accent) text-(--app-on-accent) rounded-sm select-none">Publish</span></div></div><div class="grid grid-cols-1 sm:grid-cols-[1fr_1.35fr]"><div class="border-b sm:border-b-0 sm:border-r border-(--app-line) p-2.5 space-y-2 text-[0.95em] leading-relaxed"><div class="bg-(--app-hover) border border-(--app-line) rounded-sm px-2.5 py-1.5 text-(--app-ink)">Build an account health app: MRR trend, churn risk table, and a drill-down per account.</div><div class="flex items-center gap-2 border border-(--app-line) rounded-sm px-2 py-1 text-[0.91em]"><span class="text-(--app-body) truncate">Editing src/components/RiskTable.tsx</span><span class="ml-auto flex items-center gap-1 shrink-0 text-(--app-muted)">Done<svg viewBox="0 0 24 24" fill="none" stroke="var(--ok)" stroke-width="2.5" class="w-2.5 h-2.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg></span></div><div class="flex items-center gap-2 border border-(--app-line) rounded-sm px-2 py-1 text-[0.91em]"><span class="text-(--app-body) truncate">Binding __datasources/churn_risk.sql</span><span class="ml-auto flex items-center gap-1 shrink-0 text-(--app-muted)">Done<svg viewBox="0 0 24 24" fill="none" stroke="var(--ok)" stroke-width="2.5" class="w-2.5 h-2.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg></span></div><div class="text-(--app-body)">Scaffolded the app on <span class="font-mono text-[0.91em] bg-(--app-hover) text-(--app-ink) px-1 py-px rounded-sm">fct_mrr</span> and<!-- --> <span class="font-mono text-[0.91em] bg-(--app-hover) text-(--app-ink) px-1 py-px rounded-sm">dim_accounts</span>. Risk scores come from your saved <span class="font-mono text-[0.91em] bg-(--app-hover) text-(--app-ink) px-1 py-px rounded-sm">churn_risk</span> query. Preview is live on the right — publish when ready.</div>
244<div class="border border-(--app-line) rounded-sm bg-(--app-panel)"><input type="text" placeholder="Refine the app..." aria-label="Refine the app..." class="w-full bg-transparent px-2.5 pt-2 pb-1 text-[1em] text-(--app-ink) placeholder:text-(--app-faint) outline-none" value=""/><div class="flex items-center gap-1.5 px-2 pb-1.5"><div class="relative"><button type="button" class="block" aria-haspopup="menu" aria-expanded="false"><span class="flex items-center gap-1 text-[0.82em] border rounded-sm px-1.5 py-0.5 select-none transition-colors border-(--app-line) text-(--app-muted) hover:text-(--app-ink)">Fable 5<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="w-2 h-2 transition-transform " aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><span class="group/tooltip relative inline-flex"><button type="button" aria-label="Attach image" class="ml-auto p-1 text-(--app-faint) hover:text-(--app-ink)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" class="w-3 h-3" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="2"></rect><circle cx="9" cy="9" r="2"></circle><path d="m21 15-3.1-3.1a2 2 0 0 0-2.8 0L6 21"></path></svg></button><span role="tooltip" class="pointer-events-none absolute z-50 hidden whitespace-nowrap border border-(--app-line) bg-(--app-ink) px-1.5 py-1 text-[9px] font-normal normal-case tracking-normal text-(--app-bg) shadow-md group-hover/tooltip:block group-has-[:focus-visible]/tooltip:block left-1/2 top-full mt-1 -translate-x-1/2">Attach image</span></span><button type="button" disabled="" title="Send message" aria-label="Send message" class="w-5 h-5 flex items-center justify-center rounded-full p-1 bg-(--app-hover) text-(--app-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" class="w-2.5 h-2.5" aria-hidden="true"><path d="M12 19V5m-7 7 7-7 7 7"></path></svg></button></div></div></div><div class="p-2.5"><div class="flex items-center justify-between mb-2 gap-2"><span class="text-[1em] font-semibold text-(--app-ink) truncate">Account health</span><select aria-label="Cohort filter" class="text-[0.82em] border border-(--app-line) bg-(--app-panel) text-(--app-body) rounded-sm px-1 py-0.5 outline-none"><option selected="">All cohorts</option><option>2026 Q1 signups</option><option>2025 cohorts</option></select></div><div class="grid grid-cols-2 gap-2 mb-2"><div class="border border-(--app-line) rounded-sm px-2 py-1.5 min-w-0"><div class="text-[1.27em] font-bold text-(--app-ink) truncate">$214k</div><div class="text-[0.82em] text-(--app-muted) truncate">MRR</div><div class="text-[0.82em]" style="color:var(--ok)">+9.2%</div></div><div class="border border-(--app-line) rounded-sm px-2 py-1.5 min-w-0"><div class="text-[1.27em] font-bold text-(--app-ink) truncate">17</div><div class="text-[0.82em] text-(--app-muted) truncate">At-risk accounts</div><div class="text-[0.82em]" style="color:var(--ok)">-3</div></div></div><div class="border border-(--app-line) rounded-sm"><div class="px-2 py-1 text-[0.82em] font-mono uppercase tracking-wider text-(--app-muted) border-b border-(--app-line)">Churn risk</div><div class="flex items-center justify-between px-2 py-1 text-[0.91em] text-(--app-body) border-b border-(--app-line) last:border-b-0"><span>Acme Corp</span><span style="color:var(--err)">high</span></div><div class="flex items-center justify-between px-2 py-1 text-[0.91em] text-(--app-body) border-b border-(--app-line) last:border-b-0"><span>Globex</span><span style="color:var(--warn)">medium</span></div><div class="flex items-center justify-between px-2 py-1 text-[0.91em] text-(--app-body) border-b border-(--app-line) last:border-b-0"><span>Initech</span><span style="color:var(--ok)">low</span></div></div><div class="mt-1.5 text-[0.82em] text-(--app-faint)">React preview · wired to live workspace data</div></div></div></div></div></div></div></div></div><p class="text-center text-(--body) mt-12 max-w-2xl mx-auto">One agent runs through all five layers. It syncs the data, models it, queries it, charts it, and ships it — and its per-workspace memory means it gets better at your stack the more you use it.</p></div></section><section class="px-6 py-20"><div class="max-w-5xl mx-auto"><div class="text-center mb-4"><div class="inline-block text-[11px] font-mono uppercase tracking-widest text-(--muted)"><span aria-hidden="true">[ </span>Testimonials<span aria-hidden="true"> ]</span></div></div><h2 class="text-center text-2xl md:text-3xl font-bold mb-12">Loved by people who deleted their stack</h2><div class="grid md:grid-cols-3 gap-6"><figure class="relative lp-corners bg-(--card) border border-(--line-2) shadow-[4px_4px_0_0_var(--shadow)] p-6"><blockquote class="text-[15px] leading-relaxed mb-4">“<!-- -->We replaced a pipeline vendor, an orchestrator, a BI tool, and two desktop licenses with one docker-compose file. The council was impressed.<!-- -->”</blockquote><figcaption class="text-sm"><span class="font-semibold">Mon M.</span><span class="block text-(--muted) font-mono text-[11px] uppercase tracking-wider mt-0.5">Chancellor of Analytics</span></figcaption></figure><figure class="relative lp-corners bg-(--card) border border-(--line-2) shadow-[4px_4px_0_0_var(--shadow)] p-6"><blockquote class="text-[15px] leading-relaxed mb-4">“<!-- -->The agent fixed our nightly dbt run before I&#x27;d finished my caf. I felt a great disturbance in the on-call rotation.<!-- -->”</blockquote><figcaption class="text-sm"><span class="font-semibold">Owen L.</span><span class="block text-(--muted) font-mono text-[11px] uppercase tracking-wider mt-0.5">Moisture Farm Operations</span></figcaption></figure><figure class="relative lp-corners bg-(--card) border border-(--line-2) shadow-[4px_4px_0_0_var(--shadow)] p-6"><blockquote class="text-[15px] leading-relaxed mb-4">“<!-- -->I asked for an account health app in plain English. It shipped one wired to our real models. These are the dashboards I was looking for.<!-- -->”</blockquote><figcaption class="text-sm"><span class="font-semibold">Ben K.</span><span class="block text-(--muted) font-mono text-[11px] uppercase tracking-wider mt-0.5">Retired Data Generalist</span></figcaption></figure></div><p class="text-center text-xs text-(--muted) mt-8">Testimonials transmitted from a galaxy far, far away.</p></div></section><section class="border-y border-(--line) bg-(--inv-bg) text-(--inv-ink) px-6 py-20"><div class="max-w-4xl mx-auto text-center"><div class="mb-4 text-[11px] font-mono uppercase tracking-widest text-(--inv-muted)"><span aria-hidden="true">[ </span>Open Source<span aria-hidden="true"> ]</span></div><h2 class="text-3xl md:text-4xl font-bold mb-4">Open source.<!-- --> <span class="instrument_serif_1a8f1c64-module__BIdUMW__className italic font-normal">Self-hostable.</span> <!-- -->Yours.</h2><p class="text-(--inv-muted) max-w-2xl mx-auto mb-8">The whole platform is MIT-licensed. Run it on your own infrastru
244cture, keep your data where it lives, and never talk to a sales rep unless you want to. No credit card, no trial clock, no feature gates.</p><div class="flex flex-col sm:flex-row items-center justify-center gap-4"><span class="group/btn inline-block w-full sm:w-auto"><a href="https://github.com/mako-ai/mako" class="block px-8 py-3 font-medium border shadow-[4px_4px_0_0_var(--btn-shadow)] group-hover/btn:translate-x-[4px] group-hover/btn:translate-y-[4px] group-hover/btn:shadow-none transition-all text-center bg-(--inv-ink) text-(--inv-bg) border-(--inv-ink) [--btn-shadow:var(--inv-line)]">Star on GitHub</a></span><span class="group/btn inline-block w-full sm:w-auto"><a href="https://docs.mako.ai" class="block px-8 py-3 font-medium border shadow-[4px_4px_0_0_var(--btn-shadow)] group-hover/btn:translate-x-[4px] group-hover/btn:translate-y-[4px] group-hover/btn:shadow-none transition-all text-center bg-(--inv-bg) text-(--inv-ink) border-(--inv-ink) [--btn-shadow:var(--inv-line)]">Self-hosting docs</a></span></div></div></section><section class="px-6 py-24"><div class="max-w-3xl mx-auto"><div class="mb-4"><div class="inline-block text-[11px] font-mono uppercase tracking-widest text-(--muted)"><span aria-hidden="true">[ </span>FAQ<span aria-hidden="true"> ]</span></div></div><h2 class="text-3xl md:text-4xl font-bold mb-12">Frequently asked questions</h2><div class="relative border border-(--line-2) bg-(--card) -mt-px first:mt-0 lp-corners shadow-[6px_6px_0_0_var(--shadow)] "><div class="flex items-center gap-2 px-4 py-2 border-b border-(--line-2) bg-(--paper-2) text-[11px] font-mono uppercase tracking-widest text-(--muted)">Mako — FAQ</div><div class="px-6 pb-2"><details class="group border-b last:border-b-0 border-(--line) py-5"><summary class="flex items-center justify-between cursor-pointer list-none font-medium text-lg [&amp;::-webkit-details-marker]:hidden">What is Mako?<span class="text-(--muted) transition-transform group-open:rotate-45" aria-hidden="true">+</span></summary><p class="mt-3 text-(--body) leading-relaxed">Mako is an open-source AI data platform. It covers the whole loop in one tool: Connectors and Flows pull your SaaS data into your warehouse, Transforms runs your dbt project with an agent on call, Consoles query every database you use, Dashboards chart the results, and Apps turn them into real React tools.</p></details><details class="group border-b last:border-b-0 border-(--line) py-5"><summary class="flex items-center justify-between cursor-pointer list-none font-medium text-lg [&amp;::-webkit-details-marker]:hidden">Do I have to adopt all five modules?<span class="text-(--muted) transition-transform group-open:rotate-45" aria-hidden="true">+</span></summary><p class="mt-3 text-(--body) leading-relaxed">No. Most teams arrive for one layer — usually Consoles or the connectors — and grow into the rest. The modules share connections, schema knowledge, and the agent&#x27;s memory, so each one you add starts smarter than a standalone tool would.</p></details><details class="group border-b last:border-b-0 border-(--line) py-5"><summary class="flex items-center justify-between cursor-pointer list-none font-medium text-lg [&amp;::-webkit-details-marker]:hidden">
244How does this replace Airbyte or Fivetran?<span class="text-(--muted) transition-transform group-open:rotate-45" aria-hidden="true">+</span></summary><p class="mt-3 text-(--body) leading-relaxed">Mako ships connectors for Stripe, PostHog, Close, and generic REST APIs, with scheduled Flows into your warehouse and run history per sync. If your sources are covered, you don&#x27;t need a separate extraction vendor or its pricing model — and the data lands somewhere you can immediately query.</p></details><details class="group border-b last:border-b-0 border-(--line) py-5"><summary class="flex items-center justify-between cursor-pointer list-none font-medium text-lg [&amp;::-webkit-details-marker]:hidden">What does the dbt orchestrator actually do?<span class="text-(--muted) transition-transform group-open:rotate-45" aria-hidden="true">+</span></summary><p class="mt-3 text-(--body) leading-relaxed">It runs and schedules your existing dbt project, like dbt Cloud — and then goes further: the agent writes new models on request, diagnoses failed runs against your live warehouse schema, and proposes fixes as reviewable diffs.</p></details><details class="group border-b last:border-b-0 border-(--line) py-5"><summary class="flex items-center justify-between cursor-pointer list-none font-medium text-lg [&amp;::-webkit-details-marker]:hidden">
244How is this different from Lovable or Replit?<span class="text-(--muted) transition-transform group-open:rotate-45" aria-hidden="true">+</span></summary><p class="mt-3 text-(--body) leading-relaxed">Prompt-to-app builders start from a blank database. Mako&#x27;s app builder starts from your data layer: the synced sources, dbt models, and saved queries underneath it. You describe the app; it&#x27;s already wired to numbers that are real and fresh.</p></details><details class="group border-b last:border-b-0 border-(--line) py-5"><summary class="flex items-center justify-between cursor-pointer list-none font-medium text-lg [&amp;::-webkit-details-marker]:hidden">Can I use Mako from Claude Code or Cursor?<span class="text-(--muted) transition-transform group-open:rotate-45" aria-hidden="true">+</span></summary><p class="mt-3 text-(--body) leading-relaxed">Yes — Mako is also an <a class="underline" href="/mcp">MCP server</a>. Create a workspace API key and point Claude Code, Cursor, or Codex at <code>/api/mcp</code>: your own agent can then explore your schema, run read-only queries, and build Mako apps using your existing AI subscription.</p></details><details class="group border-b last:border-b-0 border-(--line) py-5"><summary class="flex items-center justify-between cursor-pointer list-none font-medium text-lg [&amp;::-webkit-details-marker]:hidden">Is it really free?<span class="text-(--muted) transition-transform group-open:rotate-45" aria-hidden="true">+</span></summary><p class="mt-3 text-(--body) leading-relaxed">Mako is MIT-licensed and self-hostable with all features included — no credit card, no trial. If you&#x27;d rather not run it yourself, there&#x27;s a hosted version at app.mako.ai.</p></details><details class="group border-b last:border-b-0 border-(--line) py-5"><summary class="flex items-center justify-between cursor-pointer list-none font-medium text-lg [&amp;::-webkit-details-marker]:hidden">Where does my data go?<span class="text-(--muted) transition-transform group-open:rotate-45" aria-hidden="true">+</span></summary><p class="mt-3 text-(--body) leading-relaxed">When you self-host, your data stays on your infrastructure. Mako connects to your databases directly; you own the deployment end to end.</p></details></div></div></div></section><section class="relative border-t border-(--line) text-center"><span aria-hidden="true" class="pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none top-3 left-4">+</span><span aria-hidden="true" class="pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none top-3 right-4">+</span><span aria-hidden="true" class="pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none bottom-3 left-4">+</span><span aria-hidden="true" class="pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none bottom-3 right-4">+</span><div class="relative px-6 py-20"><h2 class="text-3xl md:text-4xl font-bold mb-4">Start deleting tools.</h2><p class="text-(--body) mb-8 max-w-xl mx-auto">Connect a database and ask it something. The rest of the platform is there when you need it.</p><div class="flex flex-col sm:flex-row items-center justify-center gap-4"><span class="group/btn inline-block w-full sm:w-auto"><a href="https://app.mako.ai" class="block px-8 py-3 font-medium border shadow-[4px_4px_0_0_var(--btn-shadow)] group-hover/btn:translate-x-[4px] group-hover/btn:translate-y-[4px] group-hover/btn:sha
244dow-none transition-all text-center bg-(--ink) text-(--paper) border-(--ink) [--btn-shadow:var(--shadow-btn)]">Start for free</a></span><span class="group/btn inline-block w-full sm:w-auto"><a href="https://docs.mako.ai" class="block px-8 py-3 font-medium border shadow-[4px_4px_0_0_var(--btn-shadow)] group-hover/btn:translate-x-[4px] group-hover/btn:translate-y-[4px] group-hover/btn:shadow-none transition-all text-center bg-(--paper) text-(--ink) border-(--ink) [--btn-shadow:var(--shadow-btn)]">Read the docs</a></span></div></div></section><footer class="border-t border-(--line) px-6 py-16"><div class="max-w-6xl mx-auto"><div class="grid md:grid-cols-5 gap-10 mb-12"><div><div class="flex items-center gap-2 mb-4"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 102 90" fill="currentColor" class="w-5 h-5"><path d="m58 0 44 77-8 13H7L0 77 43 0h15ZM6 77l3 5 36-64 9 16 17 30h6L45 8 6 77Zm79-8H34l-3 5h64L55 5h-6l36 64Zm-48-5h28L51 39 37 64Z"></path></svg><span class="font-mono font-semibold uppercase tracking-wider">Mako</span></div><p class="text-sm text-(--muted)">The open-source AI data platform.</p></div><div><h4 class="text-sm font-semibold mb-4 font-mono uppercase tracking-wider">Platform</h4><ul class="space-y-2 text-sm text-(--muted)"><li><a class="hover:text-(--ink) transition-colors" href="/etl">ETL Connectors &amp; Flows</a></li><li><a class="hover:text-(--ink) transition-colors" href="/dbt-transforms">dbt Transforms</a></li><li><a class="hover:text-(--ink) transition-colors" href="/sql-client">SQL Client</a></li><li><a class="hover:text-(--ink) transition-colors" href="/dashboards">Dashboards</a></li><li><a class="hover:text-(--ink) transition-colors" href="/app-builder">Apps</a></li></ul></div><div><h4 class="text-sm font-semibold mb-4 font-mono uppercase tracking-wider">Product</h4><ul class="space-y-2 text-sm text-(--muted)"><li><a href="/pricing" class="hover:text-(--ink) transition-colors">Pricing</a></li><li><a href="/mcp" class="hover:text-(--ink) transition-colors">MCP for AI Agents</a></li><li><a href="https://docs.mako.ai" class="hover:text-(--ink) transition-colors">Docs</a></li><li><a href="https://github.com/mako-ai/mako" class="hover:text-(--ink) transition-colors">GitHub</a></li><li><a href="https://app.mako.ai" class="hover:text-(--ink) transition-colors">App</a></li><li><a href="/download" class="hover:text-(--ink) transition-colors">Download</a></li></ul></div><div><h4 class="text-sm font-semibold mb-4 font-mono uppercase tracking-wider">Resources</h4><ul class="space-y-2 text-sm text-(--muted)"><li><a href="/blog" class="hover:text-(--ink) transition-colors">Blog</a></li><li><a href="/guides" class="hover:text-(--ink) transition-colors">Guides</a></li><li><a href="/compare" class="hover:text-(--ink) transition-colors">Compare</a></li><li><a href="/support" class="hover:text-(--ink) transition-colors">Support</a></li></ul></div><div><h4 class="text-sm font-semibold mb-4 font-mono uppercase tracking-wider">Company</h4><ul class="space-y-2 text-sm text-(--muted)"><li><a href="/about" class="hover:text-(--ink) transition-colors">About</a></li><li><a href="/security" class="hover:text-(--ink) transition-colors">Security</a></li><li><a href="/privacy" class="hover:text-(--ink) transition-colors">Privacy</a></li><li><a href="/terms" class="hover:text-(--ink) transition-colors">Terms</a></li></ul></div></div><div class="flex flex-col md:flex-row items-center justify-between gap-4 pt-8 border-t border-(--line) text-sm text-(--muted)"><span>© <!-- -->2026<!-- --> <!-- -->RealAdvisor SA<!-- -->. Open source under <!-- -->MIT<!-- -->.</span><div class="flex flex-col md:flex-row items-center gap-4"><span>Made with 🦈 ⌨️ ☕ 🐘 🦆 somewhere near a terminal.</span><label class="flex items-center gap-2 text-[11px] font-mono uppercase tracking-wider text-(--muted)">Theme<span class="relative"><select class="appearance-none cursor-pointer border border-(--line-2) bg-(--paper-2) text-(--ink) font-mono uppercase tracking-wider text-[11px] pl-2.5 pr-7 py-1.5 hover:border-(--ink) transition-colors focus:outline-none focus:border-(--ink)"><option value="system" selected="">System</option><option value="light">Light</option><option value="dark">Dark</option></select><span aria-hidden="true" class="pointer-events-none absolute right-2 top-1/2 -translate-y-1/2 text-[9px] text-(--muted)">▾</span></span></label></div></div></div></footer></div></div><!--$--><!--/$-->
244<script src="/_next/static/chunks/03raznvba8wfp.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz" id="_R_" async=""></script>
244<script>(self.__next_f=self.__next_f||[]).push([0])</script>
244<script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:I[88442,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"\"]\n4:I[45226,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"AttributionCapture\"]\n5:I[87180,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"default\"]\n6:I[42045,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"default\"]\n7:I[83846,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/3vor4xzhfu9b7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/2h-emq5cjgww7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/39nrdi7hy6ymd.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"ThemeRoot\"]\n8:I[54249,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/3vor4xzhfu9b7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/2h-emq5cjgww7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/39nrdi7hy6ymd.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"\"]\n19:I[89192,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"default\",1]\n:HL[\"/_next/static/chunks/0huu8yla5obps.css?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"style\"]\n:HL[\"/_next/static/chunks/1_nmozox8-i1r.css?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"style\"]\n:HL[\"/_next/static/media/70bc3e132a0a741e-s.p.3t6q91iet4nsy.woff2?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/media/7ebf22b5a21034f8-s.p.3j3877k49yy0l.woff2?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/media/83afe278b6a6bb3c-s.p.2bn3s6zvc0dyp.woff2?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/chunks/2-jyz8zf2oelc.css?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"style\"]\n3:[\"$\",\"iframe\",null,{\"src\":\"https://www.googletagmanager.com/ns.html?id=GTM-MF9JVJSB\",\"height\":\"0\",\"width\":\"0\",\"style\":{\"display\":\"none\",\"visibility\":\"hidden\"}}]\n"])</script>
244<script>self.__next_f.push([1,"0:{\"P\":null,\"c\":[\"\",\"\"],\"q\":\"\",\"i\":false,\"f\":[[[\"\",{\"children\":[\"__PAGE__\",{}]},\"$undefined\",\"$undefined\",16],[[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/0huu8yla5obps.css?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/1_nmozox8-i1r.css?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-1\",{\"src\":\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"async\":true,\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"className\":\"inter_fe8b9d92-module__LINzvG__variable jetbrains_mono_60a6e0cc-module__FznxZq__variable\",\"suppressHydrationWarning\":true,\"children\":[[\"$\",\"head\",null,{\"children\":[[\"$\",\"script\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"(function(){try{var m=localStorage.getItem(\\\"mako-lp-theme\\\")||\\\"system\\\";var d=m===\\\"dark\\\"||(m===\\\"system\\\"\u0026\u0026matchMedia(\\\"(prefers-color-scheme: dark)\\\").matches);document.documentElement.classList.toggle(\\\"dark\\\",d);}catch(e){}})()\"}}],[\"$\",\"link\",null,{\"rel\":\"apple-touch-icon\",\"sizes\":\"180x180\",\"href\":\"/apple-touch-icon.png\"}],[\"$\",\"link\",null,{\"rel\":\"icon\",\"type\":\"image/png\",\"sizes\":\"32x32\",\"href\":\"/favicon-32x32.png\"}],[\"$\",\"link\",null,{\"rel\":\"icon\",\"type\":\"image/png\",\"sizes\":\"16x16\",\"href\":\"/favicon-16x16.png\"}],[\"$\",\"link\",null,{\"rel\":\"manifest\",\"href\":\"/site.webmanifest\"}]]}],[\"$\",\"$L2\",null,{\"id\":\"gtm-script\",\"strategy\":\"afterInteractive\",\"dangerouslySetInnerHTML\":{\"__html\":\"\\n              (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':\\n              new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],\\n              j=d.createElement(s),dl=l!='dataLayer'?'\u0026l='+l:'';j.async=true;j.src=\\n              'https://www.googletagmanager.com/gtm.js?id='
244+i+dl;f.parentNode.insertBefore(j,f);\\n              })(window,document,'script','dataLayer','GTM-MF9JVJSB');\\n            \"}}],[\"$\",\"body\",null,{\"className\":\"antialiased bg-white dark:bg-black\",\"children\":[[\"$\",\"$L2\",null,{\"id\":\"mako-attribution-fingerprint\",\"src\":\"https://attr.mako.ai/fp.js\",\"strategy\":\"afterInteractive\"}],[\"$\",\"noscript\",null,{\"children\":\"$3\"}],[\"$\",\"$L4\",null,{}],[\"$\",\"$L5\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L6\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":404}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}]]}]]}],{\"children\":[[\"$\",\"$1\",\"c\",{\"children\":[[\"$\",\"$L7\",null,{\"children\":[[\"$\",\"nav\",null,{\"className\":\"sticky top-0 z-50 border-b border-(--line) bg-(--paper)/90 backdrop-blur\",\"children\":[\"$\",\"div\",null,{\"className\":\"max-w-6xl mx-auto px-6 h-16 flex items-center justify-between gap-4\",\"children\":[[\"$\",\"$L8\",null,{\"href\":\"/\",\"className\":\"flex items-center gap-2\",\"children\":[[\"$\",\"svg\",null,{\"xmlns\":\"http://www.w3.org/2000/svg\",\"viewBox\":\"0 0 102 90\",\"fill\":\"currentColor\",\"className\":\"w-6 h-6\",\"children\":[\"$\",\"path\",null,{\"d\":\"m58 0 44 77-8 13H7L0 77 43 0h15ZM6 77l3 5 36-64 9 16 17 30h6L45 8 6 77Zm79-8H34l-3 5h64L55 5h-6l36 64Zm-48-5h28L51 39 37 64Z\"}]}],\"$L9\"]}],\"$La\",\"$Lb\"]}]}],[\"$Lc\",\"$Ld\",\"$Le\",\"$Lf\",\"$L10\",\"$L11\"],\"$L12\"]}],[\"$L13\",\"$L14\",\"$L15\",\"$L16\"],\"$L17\"]}],{},null,false,null]},null,false,null],\"$L18\",false]],\"m\":\"$undefined\",\"G\":[\"$19\",[\"$L1a\",\"$L1b\"]],\"S\":true,\"h\":null,\"s\":\"$undefined\",\"l\":\"$undefined\",\"p\":\"$undefined\",\"d\":\"$undefined\"}\n"])</script>
244<script>self.__next_f.push([1,"1c:I[79969,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/3vor4xzhfu9b7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/2h-emq5cjgww7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/39nrdi7hy6ymd.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"PlatformDropdown\"]\n1d:I[54033,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/3vor4xzhfu9b7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/2h-emq5cjgww7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/39nrdi7hy6ymd.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"MiniApp\"]\n1e:I[4351,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/3vor4xzhfu9b7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/2h-emq5cjgww7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/39nrdi7hy6ymd.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"VendorStrip\"]\n1f:I[26874,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/3vor4xzhfu9b7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/2h-emq5cjgww7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/39nrdi7hy6ymd.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"FlowsMock\"]\n2f:I[19400,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"OutletBoundary\"]\n30:\"$Sreact.suspense\"\n32:I[19400,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"ViewportBoundary\"]\n34:I[19400,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"MetadataBoundary\"]\n9:[\"$\",\"span\",null,{\"className\":\"font-mono font-semibold uppercase tracking-wider text-lg\",\"children\":\"Mako\"}]\na:[\"$\",\"div\",null,{\"className\":\"hidden md:flex items-center gap-8 text-sm font-mono uppercase tracking-wider text-(--body)\",\"children\":[[\"$\",\"$L1c\",null,{}],[\"$\",\"$L8\",null,{\"href\":\"/solutions\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"Solutions\"}],[\"$\",\"$L8\",null,{\"href\":\"/pricing\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"Pricing\"}],[\"$\",\"$L8\",null,{\"href\":\"https://docs.mako.ai\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"Docs\"}]]}]\nb:[\"$\",\"div\",null,{\"className\":\"flex items-center gap-3\",\"children\":[[\"$\",\"a\",null,{\"href\":\"https://app.mako.ai\",\"className\":\"hidden sm:block text-sm font-mono uppercase tracking-wider text-(--body) hover:text-(--ink) transition-colors\",\"children\":\"Sign in\"}],[\"$\",\"span\",null,{\"className\":\"group/btn inline-block \",\"children\":[\"$\",\"a\",null,{\"href\":\"https://app.mako.ai\",\"onClick\":\"$undefined\",\"className\":\"block px-4 py-2 text-sm font-medium border shadow-[3px_3px_0_0_var(--btn-shadow)] group-hover/btn:translate-x-[3px] group-hover/btn:translate-y-[3px] group-hover/btn:sha
244dow-none transition-all text-center bg-(--ink) text-(--paper) border-(--ink) [--btn-shadow:var(--shadow-btn)]\",\"children\":\"Get started\"}]}]]}]\n"])</script>
244<script>self.__next_f.push([1,"c:[\"$\",\"div\",null,{\"className\":\"relative \",\"children\":[[[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"className\":\"pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none top-2 left-3\",\"children\":\"+\"}],[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"className\":\"pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none top-2 right-3\",\"children\":\"+\"}],[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"className\":\"pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none bottom-2 left-3\",\"children\":\"+\"}],[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"className\":\"pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none bottom-2 right-3\",\"children\":\"+\"}]],[[\"$\",\"section\",null,{\"className\":\"px-6 pt-16 pb-10 text-center\",\"children\":[\"$\",\"div\",null,{\"className\":\"max-w-3xl mx-auto\",\"children\":[[\"$\",\"h1\",null,{\"className\":\"text-5xl md:text-7xl tracking-tight leading-[1.05]\",\"children\":[[\"$\",\"span\",null,{\"className\":\"instrument_serif_1a8f1c64-module__BIdUMW__className italic\",\"children\":\"Your entire data stack.\"}],[\"$\",\"br\",null,{}],[\"$\",\"span\",null,{\"className\":\"font-bold\",\"children\":[\"One \",[\"$\",\"span\",null,{\"className\":\"bg-(--ink) text-(--paper) px-2 box-decoration-clone\",\"children\":\"open-source\"}],\" platform.\"]}]]}],[\"$\",\"p\",null,{\"className\":\"mt-6 text-lg md:text-xl text-(--body) max-w-2xl mx-auto leading-relaxed\",\"children\":\"ETL, dbt orchestration, a SQL client, dashboards, and an app builder — five layers that build on each other, run by an AI agent that knows your schema. Self-hostable, MIT-licensed, no credit card.\"}],[\"$\",\"div\",null,{\"className\":\"mt-8 flex flex-col sm:flex-row items-center justify-center gap-4\",\"children\":[[\"$\",\"span\",null,{\"className\":\"group/btn inline-block w-full sm:w-auto\",\"children\":[\"$\",\"a\",null,{\"href\":\"https://app.mako.ai\",\"onClick\":\"$undefined\",\"className\":\"block px-8 py-3 font-medium border shadow-[4px_4px_0_0_var(--btn-shadow)] group-hover/btn:translate-x-[4px] group-hover/btn:translate-y-[4px] group-hover/btn:sha
244dow-none transition-all text-center bg-(--ink) text-(--paper) border-(--ink) [--btn-shadow:var(--shadow-btn)]\",\"children\":\"Start for free\"}]}],[\"$\",\"span\",null,{\"className\":\"group/btn inline-block w-full sm:w-auto\",\"children\":[\"$\",\"a\",null,{\"href\":\"https://github.com/mako-ai/mako\",\"onClick\":\"$undefined\",\"className\":\"block px-8 py-3 font-medium border shadow-[4px_4px_0_0_var(--btn-shadow)] group-hover/btn:translate-x-[4px] group-hover/btn:translate-y-[4px] group-hover/btn:shadow-none transition-all text-center bg-(--paper) text-(--ink) border-(--ink) [--btn-shadow:var(--shadow-btn)]\",\"children\":\"View on GitHub\"}]}]]}]]}]}],[\"$\",\"section\",null,{\"className\":\"px-4 sm:px-6 pb-6\",\"children\":[\"$\",\"div\",null,{\"className\":\"max-w-6xl xl:max-w-[84rem] 2xl:max-w-[94rem] mx-auto\",\"children\":[[\"$\",\"$L1d\",null,{}],[\"$\",\"p\",null,{\"className\":\"mt-3 text-center text-xs text-(--muted)\",\"children\":\"This is a live miniature, not a screenshot — click through the sidebar, tabs, chats, and result views. The real thing just also runs your queries.\"}],[\"$\",\"div\",null,{\"className\":\"mt-8 flex justify-center\",\"children\":[\"$\",\"$L1e\",null,{\"className\":\"justify-center max-w-3xl opacity-80\",\"iconClassName\":\"w-5 h-5\",\"vendors\":[\"postgresql\",\"clickhouse\",\"bigquery\",\"mysql\",\"mongodb\",\"duckdb\",\"stripe\",\"posthog\",\"google-analytics\",\"search-console\",\"google-ads\",\"meta-ads\",\"close\"]}]}]]}]}]]]}]\n"])</script>
244<script>self.__next_f.push([1,"d:[\"$\",\"section\",null,{\"id\":\"platform\",\"className\":\"relative border-t border-(--line) px-6 py-24 bg-(--paper-2)/60 mt-16\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative max-w-5xl mx-auto\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-center mb-4\",\"children\":[\"$\",\"div\",null,{\"className\":\"inline-block text-[11px] font-mono uppercase tracking-widest text-(--muted)\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"children\":\"[ \"}],\"The Stack\",[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"children\":\" ]\"}]]}]}],[\"$\",\"h2\",null,{\"className\":\"text-center text-3xl md:text-5xl font-bold tracking-tight mb-4\",\"children\":[\"Five tools you can\",\" \",[\"$\",\"span\",null,{\"className\":\"instrument_serif_1a8f1c64-module__BIdUMW__className italic font-normal\",\"children\":\"delete\"}]]}],[\"$\",\"p\",null,{\"className\":\"text-center text-(--body) max-w-2xl mx-auto mb-16\",\"children\":\"Each module builds on the one before it. Start with the layer that hurts most — the rest is already there when you need it.\"}],[\"$\",\"div\",null,{\"className\":\"space-y-0\",\"children\":[[\"$\",\"div\",\"etl\",{\"children\":[[\"$\",\"div\",null,{\"className\":\"relative lp-corners grid lg:grid-cols-[auto_1fr_1.1fr] gap-6 lg:gap-10 items-center bg-(--card) border border-(--line-2) shadow-[6px_6px_0_0_var(--shadow)] p-6 md:p-8\",\"children\":[[\"$\",\"div\",null,{\"className\":\"instrument_serif_1a8f1c64-module__BIdUMW__className italic text-5xl md:text-6xl text-(--line-2) leading-none\",\"children\":\"01\"}],[\"$\",\"div\",null,{\"className\":\"min-w-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-[11px] font-mono uppercase tracking-widest text-(--muted) mb-1.5\",\"children\":\"ETL Connectors \u0026 Flows\"}],[\"$\",\"h3\",null,{\"className\":\"text-xl md:text-2xl font-bold mb-2\",\"children\":\"ETL without the pipeline vendor\"}],[\"$\",\"div\",null,{\"className\":\"mb-3\",\"children\":[\"$\",\"div\",null,{\"className\":\"inline-flex flex-wrap items-center gap-2 text-[12px]\",\"children\":[[\"$\",\"span\",null,{\"className\":\"font-mono uppercase tracking-wider text-(--muted)\",\"children\":\"Replaces\"}],[[\"$\",\"span\",\"Airbyte\",{\"className\":\"border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)\",\"children\":\"Airbyte\"}],[\"$\",\"span\",\"Fivetran\",{\"className\":\"border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)\",\"children\":\"Fivetran\"}]]]}]}],[\"$\",\"p\",null,{\"className\":\"text-(--body) text-[15px] leading-relaxed mb-4\",\"children\":\"Your ETL layer, like Airbyte or Fivetran — connect Stripe, PostHog, Close, or any REST API once, then let Flows sync them into your warehouse on a schedule, with run history per flow. No pipeline vendor, no per-connector pricing surprises.\"}],[\"$\",\"$L8\",null,{\"href\":\"/etl\",\"className\":\"inline-flex items-center gap-2 font-medium border-b-2 border-(--ink) pb-0.5 hover:gap-3 transition-all\",\"children\":[\"Explore \",\"ETL Connectors \u0026 Flows\",\" \",[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"children\":\"→\"}]]}]]}],[\"$\",\"div\",null,{\"className\":\"hidden lg:block min-w-0\",\"children\":[\"$\",\"$L1f\",null,{\"label\":\"\"}]}]]}],[\"$\",\"div\",null,{\"className\":\"flex justify-center py-2\",\"children\":[\"$\",\"span\",null,{\"className\":\"text-(--inv-muted) text-xl\",\"aria-hidden\":\"true\",\"children\":\"↓\"}]}]]}],[\"$\",\"div\",\"dbt-transforms\",{\"children\":[[\"$\",\"div\",null,{\"className\":\"relative lp-corners grid lg:grid-cols-[auto_1fr_1.1fr] gap-6 lg:gap-10 items-center bg-(--card) border border-(--line-2) shadow-[6px_6px_0_0_var(--shadow)] p-6 md:p-8\",\"children\":[[\"$\",\"div\",null,{\"className\":\"instrument_serif_1a8f1c64-module__BIdUMW__className italic text-5xl md:text-6xl text-(--line-2) leading-none\",\"children\":\"02\"}],[\"$\",\"div\",null,{\"className\":\"min-w-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-[11px] font-mono uppercase tracking-widest text-(--muted) mb-1.5\",\"children\":\"dbt Transforms\"}],[\"$\",\"h3\",null,{\"className\":\"text-xl md:text-2xl font-bold mb-2\",\"children\":\"Your dbt project, run by an agent\"}],[\"$\",\"div\",null,{\"className\":\"mb-3\",\"children\":[\"$\",\"div\",null,{\"className\":\"inline-flex flex-wrap items-center gap-2 text-[12px]\",\"children\":[\"$L20\",[\"$L21\"]]}]}],\"$L22\",\"$L23\"]}],\"$L24\"]}],\"$L25\"]}],\"$L26\",\"$L27\",\"$L28\"]}],\"$L29\"]}]}]\n"])</script>
244<script>self.__next_f.push([1,"e:[\"$\",\"section\",null,{\"className\":\"px-6 py-20\",\"children\":[\"$\",\"div\",null,{\"className\":\"max-w-5xl mx-auto\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-center mb-4\",\"children\":[\"$\",\"div\",null,{\"className\":\"inline-block text-[11px] font-mono uppercase tracking-widest text-(--muted)\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"children\":\"[ \"}],\"Testimonials\",[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"children\":\" ]\"}]]}]}],[\"$\",\"h2\",null,{\"className\":\"text-center text-2xl md:text-3xl font-bold mb-12\",\"children\":\"Loved by people who deleted their stack\"}],[\"$\",\"div\",null,{\"className\":\"grid md:grid-cols-3 gap-6\",\"children\":[[\"$\",\"figure\",null,{\"className\":\"relative lp-corners bg-(--card) border border-(--line-2) shadow-[4px_4px_0_0_var(--shadow)] p-6\",\"children\":[[\"$\",\"blockquote\",null,{\"className\":\"text-[15px] leading-relaxed mb-4\",\"children\":[\"“\",\"We replaced a pipeline vendor, an orchestrator, a BI tool, and two desktop licenses with one docker-compose file. The council was impressed.\",\"”\"]}],[\"$\",\"figcaption\",null,{\"className\":\"text-sm\",\"children\":[[\"$\",\"span\",null,{\"className\":\"font-semibold\",\"children\":\"Mon M.\"}],[\"$\",\"span\",null,{\"className\":\"block text-(--muted) font-mono text-[11px] uppercase tracking-wider mt-0.5\",\"children\":\"Chancellor of Analytics\"}]]}]]}],[\"$\",\"figure\",null,{\"className\":\"relative lp-corners bg-(--card) border border-(--line-2) shadow-[4px_4px_0_0_var(--shadow)] p-6\",\"children\":[[\"$\",\"blockquote\",null,{\"className\":\"text-[15px] leading-relaxed mb-4\",\"children\":[\"“\",\"The agent fixed our nightly dbt run before I'd finished my caf. I felt a great disturbance in the on-call rotation.\",\"”\"]}],[\"$\",\"figcaption\",null,{\"className\":\"text-sm\",\"children\":[[\"$\",\"span\",null,{\"className\":\"font-semibold\",\"children\":\"Owen L.\"}],[\"$\",\"span\",null,{\"className\":\"block text-(--muted) font-mono text-[11px] uppercase tracking-wider mt-0.5\",\"children\":\"Moisture Farm Operations\"}]]}]]}],[\"$\",\"figure\",null,{\"className\":\"relative lp-corners bg-(--card) border border-(--line-2) shadow-[4px_4px_0_0_var(--shadow)] p-6\",\"children\":[[\"$\",\"blockquote\",null,{\"className\":\"text-[15px] leading-relaxed mb-4\",\"children\":[\"“\",\"I asked for an account health app in plain English. It shipped one wired to our real models. These are the dashboards I was looking for.\",\"”\"]}],[\"$\",\"figcaption\",null,{\"className\":\"text-sm\",\"children\":[[\"$\",\"span\",null,{\"className\":\"font-semibold\",\"children\":\"Ben K.\"}],[\"$\",\"span\",null,{\"className\":\"block text-(--muted) font-mono text-[11px] uppercase tracking-wider mt-0.5\",\"children\":\"Retired Data Generalist\"}]]}]]}]]}],[\"$\",\"p\",null,{\"className\":\"text-center text-xs text-(--muted) mt-8\",\"children\":\"Testimonials transmitted from a galaxy far, far away.\"}]]}]}]\n"])</script>
244<script>self.__next_f.push([1,"f:[\"$\",\"section\",null,{\"className\":\"border-y border-(--line) bg-(--inv-bg) text-(--inv-ink) px-6 py-20\",\"children\":[\"$\",\"div\",null,{\"className\":\"max-w-4xl mx-auto text-center\",\"children\":[[\"$\",\"div\",null,{\"className\":\"mb-4 text-[11px] font-mono uppercase tracking-widest text-(--inv-muted)\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"children\":\"[ \"}],\"Open Source\",[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"children\":\" ]\"}]]}],[\"$\",\"h2\",null,{\"className\":\"text-3xl md:text-4xl font-bold mb-4\",\"children\":[\"Open source.\",\" \",[\"$\",\"span\",null,{\"className\":\"instrument_serif_1a8f1c64-module__BIdUMW__className italic font-normal\",\"children\":\"Self-hostable.\"}],\" \",\"Yours.\"]}],[\"$\",\"p\",null,{\"className\":\"text-(--inv-muted) max-w-2xl mx-auto mb-8\",\"children\":\"The whole platform is MIT-licensed. Run it on your own infrastructure, keep your data where it lives, and never talk to a sales rep unless you want to. No credit card, no trial clock, no feature gates.\"}],[\"$\",\"div\",null,{\"className\":\"flex flex-col sm:flex-row items-center justify-center gap-4\",\"children\":[[\"$\",\"span\",null,{\"className\":\"group/btn inline-block w-full sm:w-auto\",\"children\":[\"$\",\"a\",null,{\"href\":\"https://github.com/mako-ai/mako\",\"onClick\":\"$undefined\",\"className\":\"block px-8 py-3 font-medium border shadow-[4px_4px_0_0_var(--btn-shadow)] group-hover/btn:translate-x-[4px] group-hover/btn:translate-y-[4px] group-hover/btn:sha
244dow-none transition-all text-center bg-(--inv-ink) text-(--inv-bg) border-(--inv-ink) [--btn-shadow:var(--inv-line)]\",\"children\":\"Star on GitHub\"}]}],[\"$\",\"span\",null,{\"className\":\"group/btn inline-block w-full sm:w-auto\",\"children\":[\"$\",\"a\",null,{\"href\":\"https://docs.mako.ai\",\"onClick\":\"$undefined\",\"className\":\"block px-8 py-3 font-medium border shadow-[4px_4px_0_0_var(--btn-shadow)] group-hover/btn:translate-x-[4px] group-hover/btn:translate-y-[4px] group-hover/btn:shadow-none transition-all text-center bg-(--inv-bg) text-(--inv-ink) border-(--inv-ink) [--btn-shadow:var(--inv-line)]\",\"children\":\"Self-hosting docs\"}]}]]}]]}]}]\n"])</script>
244<script>self.__next_f.push([1,"10:[\"$\",\"section\",null,{\"className\":\"px-6 py-24\",\"children\":[\"$\",\"div\",null,{\"className\":\"max-w-3xl mx-auto\",\"children\":[[\"$\",\"div\",null,{\"className\":\"mb-4\",\"children\":[\"$\",\"div\",null,{\"className\":\"inline-block text-[11px] font-mono uppercase tracking-widest text-(--muted)\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"children\":\"[ \"}],\"FAQ\",[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"children\":\" ]\"}]]}]}],[\"$\",\"h2\",null,{\"className\":\"text-3xl md:text-4xl font-bold mb-12\",\"children\":\"Frequently asked questions\"}],[\"$\",\"div\",null,{\"className\":\"relative border border-(--line-2) bg-(--card) -mt-px first:mt-0 lp-corners shadow-[6px_6px_0_0_var(--shadow)] \",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center gap-2 px-4 py-2 border-b border-(--line-2) bg-(--paper-2) text-[11px] font-mono uppercase tracking-widest text-(--muted)\",\"children\":\"Mako — FAQ\"}],[\"$\",\"div\",null,{\"className\":\"px-6 pb-2\",\"children\":[[\"$\",\"details\",null,{\"className\":\"group border-b last:border-b-0 border-(--line) py-5\",\"children\":[[\"$\",\"summary\",null,{\"className\":\"flex items-center justify-between cursor-pointer list-none font-medium text-lg [\u0026::-webkit-details-marker]:hidden\",\"children\":[\"What is Mako?\",[\"$\",\"span\",null,{\"className\":\"text-(--muted) transition-transform group-open:rotate-45\",\"aria-hidden\":\"true\",\"children\":\"+\"}]]}],[\"$\",\"p\",null,{\"className\":\"mt-3 text-(--body) leading-relaxed\",\"children\":\"Mako is an open-source AI data platform. It covers the whole loop in one tool: Connectors and Flows pull your SaaS data into your warehouse, Transforms runs your dbt project with an agent on call, Consoles query every database you use, Dashboards chart the results, and Apps turn them into real React tools.\"}]]}],[\"$\",\"details\",null,{\"className\":\"group border-b last:border-b-0 border-(--line) py-5\",\"children\":[[\"$\",\"summary\",null,{\"className\":\"flex items-center justify-between cursor-pointer list-none font-medium text-lg [\u0026::-webkit-details-marker]:hidden\",\"children\":[\"Do I have to adopt all five modules?\",[\"$\",\"span\",null,{\"className\":\"text-(--muted) transition-transform group-open:rotate-45\",\"aria-hidden\":\"true\",\"children\":\"+\"}]]}],[\"$\",\"p\",null,{\"className\":\"mt-3 text-(--body) leading-relaxed\",\"children\":\"No. Most teams arrive for one layer — usually Consoles or the connectors — and grow into the rest. The modules share connections, schema knowledge, and the agent's memory, so each one you add starts smarter than a standalone tool would.\"}]]}],[\"$\",\"details\",null,{\"className\":\"group border-b last:border-b-0 border-(--line) py-5\",\"children\":[[\"$\",\"summary\",null,{\"className\":\"flex items-center justify-between cursor-pointer list-none font-medium text-lg [\u0026::-webkit-details-marker]:hidden\",\"children\":[\"How does this replace Airbyte or Fivetran?\",[\"$\",\"span\",null,{\"className\":\"text-(--muted) transition-transform group-open:rotate-45\",\"aria-hidden\":\"true\",\"children\":\"+\"}]]}],[\"$\",\"p\",null,{\"className\":\"mt-3 text-(--body) leading-relaxed\",\"children\":\"Mako ships connectors for Stripe, PostHog, Close, and generic REST APIs, with scheduled Flows into your warehouse and run history per sync. If your sources are covered, you don't need a separate extraction vendor or its pricing model — and the data lands somewhere you can immediately query.\"}]]}],[\"$\",\"details\",null,{\"className\":\"group border-b last:border-b-0 border-(--line) py-5\",\"children\":[[\"$\",\"summary\",null,{\"className\":\"flex items-center justify-between cursor-pointer list-none font-medium text-lg [\u0026::-webkit-details-marker]:hidden\",\"children\":[\"What does the dbt orchestrator actually do?\",[\"$\",\"span\",null,{\"className\":\"text-(--muted) transition-transform group-open:rotate-45\",\"aria-hidden\":\"true\",\"children\":\"+\"}]]}],[\"$\",\"p\",null,{\"className\":\"mt-3 text-(--body) leading-relaxed\",\"children\":\"It runs and schedules 
244your existing dbt project, like dbt Cloud — and then goes further: the agent writes new models on request, diagnoses failed runs against your live warehouse schema, and proposes fixes as reviewable diffs.\"}]]}],\"$L2a\",\"$L2b\",\"$L2c\",\"$L2d\"]}]]}]]}]}]\n"])</script>
244<script>self.__next_f.push([1,"11:[\"$\",\"section\",null,{\"className\":\"relative border-t border-(--line) text-center\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"className\":\"pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none top-3 left-4\",\"children\":\"+\"}],[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"className\":\"pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none top-3 right-4\",\"children\":\"+\"}],[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"className\":\"pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none bottom-3 left-4\",\"children\":\"+\"}],[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"className\":\"pointer-events-none absolute z-10 font-mono text-sm leading-none text-(--muted) select-none bottom-3 right-4\",\"children\":\"+\"}],[\"$\",\"div\",null,{\"className\":\"relative px-6 py-20\",\"children\":[[\"$\",\"h2\",null,{\"className\":\"text-3xl md:text-4xl font-bold mb-4\",\"children\":\"Start deleting tools.\"}],[\"$\",\"p\",null,{\"className\":\"text-(--body) mb-8 max-w-xl mx-auto\",\"children\":\"Connect a database and ask it something. The rest of the platform is there when you need it.\"}],[\"$\",\"div\",null,{\"className\":\"flex flex-col sm:flex-row items-center justify-center gap-4\",\"children\":[[\"$\",\"span\",null,{\"className\":\"group/btn inline-block w-full sm:w-auto\",\"children\":[\"$\",\"a\",null,{\"href\":\"https://app.mako.ai\",\"onClick\":\"$undefined\",\"className\":\"block px-8 py-3 font-medium border shadow-[4px_4px_0_0_var(--btn-shadow)] group-hover/btn:translate-x-[4px] group-hover/btn:translate-y-[4px] group-hover/btn:sha
244dow-none transition-all text-center bg-(--ink) text-(--paper) border-(--ink) [--btn-shadow:var(--shadow-btn)]\",\"children\":\"Start for free\"}]}],[\"$\",\"span\",null,{\"className\":\"group/btn inline-block w-full sm:w-auto\",\"children\":[\"$\",\"a\",null,{\"href\":\"https://docs.mako.ai\",\"onClick\":\"$undefined\",\"className\":\"block px-8 py-3 font-medium border shadow-[4px_4px_0_0_var(--btn-shadow)] group-hover/btn:translate-x-[4px] group-hover/btn:translate-y-[4px] group-hover/btn:shadow-none transition-all text-center bg-(--paper) text-(--ink) border-(--ink) [--btn-shadow:var(--shadow-btn)]\",\"children\":\"Read the docs\"}]}]]}]]}]]}]\n"])</script>
244<script>self.__next_f.push([1,"12:[\"$\",\"footer\",null,{\"className\":\"border-t border-(--line) px-6 py-16\",\"children\":[\"$\",\"div\",null,{\"className\":\"max-w-6xl mx-auto\",\"children\":[[\"$\",\"div\",null,{\"className\":\"grid md:grid-cols-5 gap-10 mb-12\",\"children\":[[\"$\",\"div\",null,{\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center gap-2 mb-4\",\"children\":[[\"$\",\"svg\",null,{\"xmlns\":\"http://www.w3.org/2000/svg\",\"viewBox\":\"0 0 102 90\",\"fill\":\"currentColor\",\"className\":\"w-5 h-5\",\"children\":[\"$\",\"path\",null,{\"d\":\"m58 0 44 77-8 13H7L0 77 43 0h15ZM6 77l3 5 36-64 9 16 17 30h6L45 8 6 77Zm79-8H34l-3 5h64L55 5h-6l36 64Zm-48-5h28L51 39 37 64Z\"}]}],[\"$\",\"span\",null,{\"className\":\"font-mono font-semibold uppercase tracking-wider\",\"children\":\"Mako\"}]]}],[\"$\",\"p\",null,{\"className\":\"text-sm text-(--muted)\",\"children\":\"The open-source AI data platform.\"}]]}],[\"$\",\"div\",null,{\"children\":[[\"$\",\"h4\",null,{\"className\":\"text-sm font-semibold mb-4 font-mono uppercase tracking-wider\",\"children\":\"Platform\"}],[\"$\",\"ul\",null,{\"className\":\"space-y-2 text-sm text-(--muted)\",\"children\":[[\"$\",\"li\",\"etl\",{\"children\":[\"$\",\"$L8\",null,{\"href\":\"/etl\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"ETL Connectors \u0026 Flows\"}]}],[\"$\",\"li\",\"dbt-transforms\",{\"children\":[\"$\",\"$L8\",null,{\"href\":\"/dbt-transforms\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"dbt Transforms\"}]}],[\"$\",\"li\",\"sql-client\",{\"children\":[\"$\",\"$L8\",null,{\"href\":\"/sql-client\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"SQL Client\"}]}],[\"$\",\"li\",\"dashboards\",{\"children\":[\"$\",\"$L8\",null,{\"href\":\"/dashboards\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"Dashboards\"}]}],[\"$\",\"li\",\"app-builder\",{\"children\":[\"$\",\"$L8\",null,{\"href\":\"/app-builder\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"Apps\"}]}]]}]]}],[\"$\",\"div\",null,{\"children\":[[\"$\",\"h4\",null,{\"className\":\"text-sm font-semibold mb-4 font-mono uppercase tracking-wider\",\"children\":\"Product\"}],[\"$\",\"ul\",null,{\"className\":\"space-y-2 text-sm text-(--muted)\",\"children\":[[\"$\",\"li\",\"Pricing\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/pricing\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"Pricing\"}]}],[\"$\",\"li\",\"MCP for AI Agents\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/mcp\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"MCP for AI Agents\"}]}],[\"$\",\"li\",\"Docs\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://docs.mako.ai\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"Docs\"}]}],[\"$\",\"li\",\"GitHub\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://github.com/mako-ai/mako\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"GitHub\"}]}],[\"$\",\"li\",\"App\",{\"children\":[\"$\",\"a\",null,{\"href\":\"https://app.mako.ai\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"App\"}]}],[\"$\",\"li\",\"Download\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/download\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"Download\"}]}]]}]]}],[\"$\",\"div\",null,{\"children\":[[\"$\",\"h4\",null,{\"className\":\"text-sm font-semibold mb-4 font-mono uppercase tracking-wider\",\"children\":\"Resources\"}],[\"$\",\"ul\",null,{\"className\":\"space-y-2 text-sm text-(--muted)\",\"children\":[[\"$\",\"li\",\"Blog\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/blog\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"Blog\"}]}],[\"$\",\"li\",\"Guides\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/guides\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"Guides\"}]}],[\"$\",\"li\",\"Compare\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/compare\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"Compare\"}]}],[\"$\",\"li\",\"Support\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/support\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"Supp
244ort\"}]}]]}]]}],[\"$\",\"div\",null,{\"children\":[[\"$\",\"h4\",null,{\"className\":\"text-sm font-semibold mb-4 font-mono uppercase tracking-wider\",\"children\":\"Company\"}],[\"$\",\"ul\",null,{\"className\":\"space-y-2 text-sm text-(--muted)\",\"children\":[[\"$\",\"li\",\"About\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/about\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"About\"}]}],[\"$\",\"li\",\"Security\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/security\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"Security\"}]}],[\"$\",\"li\",\"Privacy\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/privacy\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"Privacy\"}]}],[\"$\",\"li\",\"Terms\",{\"children\":[\"$\",\"a\",null,{\"href\":\"/terms\",\"className\":\"hover:text-(--ink) transition-colors\",\"children\":\"Terms\"}]}]]}]]}]]}],\"$L2e\"]}]}]\n"])</script>
244<script>self.__next_f.push([1,"13:[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/2-jyz8zf2oelc.css?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]\n14:[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/chunks/3vor4xzhfu9b7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"async\":true,\"nonce\":\"$undefined\"}]\n15:[\"$\",\"script\",\"script-1\",{\"src\":\"/_next/static/chunks/2h-emq5cjgww7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"async\":true,\"nonce\":\"$undefined\"}]\n16:[\"$\",\"script\",\"script-2\",{\"src\":\"/_next/static/chunks/39nrdi7hy6ymd.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"async\":true,\"nonce\":\"$undefined\"}]\n17:[\"$\",\"$L2f\",null,{\"children\":[\"$\",\"$30\",null,{\"name\":\"Next.MetadataOutlet\",\"children\":\"$@31\"}]}]\n18:[\"$\",\"$1\",\"h\",{\"children\":[null,[\"$\",\"$L32\",null,{\"children\":\"$L33\"}],[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$L34\",null,{\"children\":[\"$\",\"$30\",null,{\"name\":\"Next.Metadata\",\"children\":\"$L35\"}]}]}],[\"$\",\"meta\",null,{\"name\":\"next-size-adjust\",\"content\":\"\"}]]}]\n1a:[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/0huu8yla5obps.css?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]\n1b:[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/1_nmozox8-i1r.css?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]\n"])</script>
244<script>self.__next_f.push([1,"36:I[42241,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/3vor4xzhfu9b7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/2h-emq5cjgww7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/39nrdi7hy6ymd.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"ConsoleMock\"]\n37:I[75773,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/3vor4xzhfu9b7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/2h-emq5cjgww7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/39nrdi7hy6ymd.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"DashboardMock\"]\n38:I[33774,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/3vor4xzhfu9b7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/2h-emq5cjgww7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/39nrdi7hy6ymd.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"AppBuilderMock\"]\n39:I[83846,[\"/_next/static/chunks/2t5exhmp3h-9z.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/41_hrldv9klk7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/3vor4xzhfu9b7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/2h-emq5cjgww7.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\",\"/_next/static/chunks/39nrdi7hy6ymd.js?dpl=dpl_F45imnEAnWaHHno9jVAQfN8feLdz\"],\"ThemeSelect\"]\n20:[\"$\",\"span\",null,{\"className\":\"font-mono uppercase tracking-wider text-(--muted)\",\"children\":\"Replaces\"}]\n21:[\"$\",\"span\",\"dbt Cloud\",{\"className\":\"border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)\",\"children\":\"dbt Cloud\"}]\n22:[\"$\",\"p\",null,{\"className\":\"text-(--body) text-[15px] leading-relaxed mb-4\",\"children\":\"$undefined\"}]\n23:[\"$\",\"$L8\",null,{\"href\":\"/dbt-transforms\",\"className\":\"inline-flex items-center gap-2 font-medium border-b-2 border-(--ink) pb-0.5 hover:gap-3 transition-all\",\"children\":[\"Explore \",\"dbt Transforms\",\" \",[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"children\":\"→\"}]]}]\n24:[\"$\",\"div\",null,{\"className\":\"hidden lg:block min-w-0\",\"children\":\"$undefined\"}]\n25:[\"$\",\"div\",null,{\"className\":\"flex justify-center py-2\",\"children\":[\"$\",\"span\",null,{\"className\":\"text-(--inv-muted) text-xl\",\"aria-hidden\":\"true\",\"children\":\"↓\"}]}]\n"])</script>
244<script>self.__next_f.push([1,"26:[\"$\",\"div\",\"sql-client\",{\"children\":[[\"$\",\"div\",null,{\"className\":\"relative lp-corners grid lg:grid-cols-[auto_1fr_1.1fr] gap-6 lg:gap-10 items-center bg-(--card) border border-(--line-2) shadow-[6px_6px_0_0_var(--shadow)] p-6 md:p-8\",\"children\":[[\"$\",\"div\",null,{\"className\":\"instrument_serif_1a8f1c64-module__BIdUMW__className italic text-5xl md:text-6xl text-(--line-2) leading-none\",\"children\":\"03\"}],[\"$\",\"div\",null,{\"className\":\"min-w-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-[11px] font-mono uppercase tracking-widest text-(--muted) mb-1.5\",\"children\":\"SQL Client\"}],[\"$\",\"h3\",null,{\"className\":\"text-xl md:text-2xl font-bold mb-2\",\"children\":\"The AI-native SQL client\"}],[\"$\",\"div\",null,{\"className\":\"mb-3\",\"children\":[\"$\",\"div\",null,{\"className\":\"inline-flex flex-wrap items-center gap-2 text-[12px]\",\"children\":[[\"$\",\"span\",null,{\"className\":\"font-mono uppercase tracking-wider text-(--muted)\",\"children\":\"Replaces\"}],[[\"$\",\"span\",\"DataGrip\",{\"className\":\"border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)\",\"children\":\"DataGrip\"}],[\"$\",\"span\",\"DBeaver\",{\"className\":\"border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)\",\"children\":\"DBeaver\"}],[\"$\",\"span\",\"TablePlus\",{\"className\":\"border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)\",\"children\":\"TablePlus\"}]]]}]}],[\"$\",\"p\",null,{\"className\":\"text-(--body) text-[15px] leading-relaxed mb-4\",\"children\":\"Your SQL client, like DataGrip but in the browser — Run is ⌘/Ctrl+Enter, results flip between table, JSON, and chart, and the agent writes SQL against your real schema. Consoles and connections are shared: My Consoles for you, Workspace for the team.\"}],[\"$\",\"$L8\",null,{\"href\":\"/sql-client\",\"className\":\"inline-flex items-center gap-2 font-medium border-b-2 border-(--ink) pb-0.5 hover:gap-3 transition-all\",\"children\":[\"Explore \",\"SQL Client\",\" \",[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"children\":\"→\"}]]}]]}],[\"$\",\"div\",null,{\"className\":\"hidden lg:block min-w-0\",\"children\":[\"$\",\"$L36\",null,{\"label\":\"\"}]}]]}],[\"$\",\"div\",null,{\"className\":\"flex justify-center py-2\",\"children\":[\"$\",\"span\",null,{\"className\":\"text-(--inv-muted) text-xl\",\"aria-hidden\":\"true\",\"children\":\"↓\"}]}]]}]\n"])</script>
244<script>self.__next_f.push([1,"27:[\"$\",\"div\",\"dashboards\",{\"children\":[[\"$\",\"div\",null,{\"className\":\"relative lp-corners grid lg:grid-cols-[auto_1fr_1.1fr] gap-6 lg:gap-10 items-center bg-(--card) border border-(--line-2) shadow-[6px_6px_0_0_var(--shadow)] p-6 md:p-8\",\"children\":[[\"$\",\"div\",null,{\"className\":\"instrument_serif_1a8f1c64-module__BIdUMW__className italic text-5xl md:text-6xl text-(--line-2) leading-none\",\"children\":\"04\"}],[\"$\",\"div\",null,{\"className\":\"min-w-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-[11px] font-mono uppercase tracking-widest text-(--muted) mb-1.5\",\"children\":\"Dashboards\"}],[\"$\",\"h3\",null,{\"className\":\"text-xl md:text-2xl font-bold mb-2\",\"children\":\"Dashboards the agent builds for you\"}],[\"$\",\"div\",null,{\"className\":\"mb-3\",\"children\":[\"$\",\"div\",null,{\"className\":\"inline-flex flex-wrap items-center gap-2 text-[12px]\",\"children\":[[\"$\",\"span\",null,{\"className\":\"font-mono uppercase tracking-wider text-(--muted)\",\"children\":\"Replaces\"}],[[\"$\",\"span\",\"Tableau\",{\"className\":\"border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)\",\"children\":\"Tableau\"}],[\"$\",\"span\",\"Looker Studio\",{\"className\":\"border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)\",\"children\":\"Looker Studio\"}]]]}]}],[\"$\",\"p\",null,{\"className\":\"text-(--body) text-[15px] leading-relaxed mb-4\",\"children\":\"Your BI layer, like Tableau or Looker Studio — except you describe the dashboard and the agent assembles the tiles from your saved queries and dbt models. Flip between View and Edit, or drop into the code behind any widget.\"}],[\"$\",\"$L8\",null,{\"href\":\"/dashboards\",\"className\":\"inline-flex items-center gap-2 font-medium border-b-2 border-(--ink) pb-0.5 hover:gap-3 transition-all\",\"children\":[\"Explore \",\"Dashboards\",\" \",[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"children\":\"→\"}]]}]]}],[\"$\",\"div\",null,{\"className\":\"hidden lg:block min-w-0\",\"children\":[\"$\",\"$L37\",null,{\"label\":\"\"}]}]]}],[\"$\",\"div\",null,{\"className\":\"flex justify-center py-2\",\"children\":[\"$\",\"span\",null,{\"className\":\"text-(--inv-muted) text-xl\",\"aria-hidden\":\"true\",\"children\":\"↓\"}]}]]}]\n"])</script>
244<script>self.__next_f.push([1,"28:[\"$\",\"div\",\"app-builder\",{\"children\":[[\"$\",\"div\",null,{\"className\":\"relative lp-corners grid lg:grid-cols-[auto_1fr_1.1fr] gap-6 lg:gap-10 items-center bg-(--card) border border-(--line-2) shadow-[6px_6px_0_0_var(--shadow)] p-6 md:p-8\",\"children\":[[\"$\",\"div\",null,{\"className\":\"instrument_serif_1a8f1c64-module__BIdUMW__className italic text-5xl md:text-6xl text-(--line-2) leading-none\",\"children\":\"05\"}],[\"$\",\"div\",null,{\"className\":\"min-w-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-[11px] font-mono uppercase tracking-widest text-(--muted) mb-1.5\",\"children\":\"Apps\"}],[\"$\",\"h3\",null,{\"className\":\"text-xl md:text-2xl font-bold mb-2\",\"children\":\"Full React apps on your data layer\"}],[\"$\",\"div\",null,{\"className\":\"mb-3\",\"children\":[\"$\",\"div\",null,{\"className\":\"inline-flex flex-wrap items-center gap-2 text-[12px]\",\"children\":[[\"$\",\"span\",null,{\"className\":\"font-mono uppercase tracking-wider text-(--muted)\",\"children\":\"Replaces\"}],[[\"$\",\"span\",\"Lovable\",{\"className\":\"border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)\",\"children\":\"Lovable\"}],[\"$\",\"span\",\"Replit\",{\"className\":\"border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)\",\"children\":\"Replit\"}],[\"$\",\"span\",\"Retool\",{\"className\":\"border border-(--line-2) bg-(--card) px-2 py-0.5 line-through decoration-(--err) decoration-2 text-(--body)\",\"children\":\"Retool\"}]]]}]}],[\"$\",\"p\",null,{\"className\":\"text-(--body) text-[15px] leading-relaxed mb-4\",\"children\":\"Your app builder, like Lovable or Retool — but the data layer is already bound: models, saved queries, auth. Prompt your way to a full React app, iterate in chat next to a live preview, then hit Publish.\"}],[\"$\",\"$L8\",null,{\"href\":\"/app-builder\",\"className\":\"inline-flex items-center gap-2 font-medium border-b-2 border-(--ink) pb-0.5 hover:gap-3 transition-all\",\"children\":[\"Explore \",\"Apps\",\" \",[\"$\",\"span\",null,{\"aria-hidden\":\"true\",\"children\":\"→\"}]]}]]}],[\"$\",\"div\",null,{\"className\":\"hidden lg:block min-w-0\",\"children\":[\"$\",\"$L38\",null,{\"label\":\"\"}]}]]}],false]}]\n"])</script>
244<script>self.__next_f.push([1,"29:[\"$\",\"p\",null,{\"className\":\"text-center text-(--body) mt-12 max-w-2xl mx-auto\",\"children\":\"One agent runs through all five layers. It syncs the data, models it, queries it, charts it, and ships it — and its per-workspace memory means it gets better at your stack the more you use it.\"}]\n2a:[\"$\",\"details\",null,{\"className\":\"group border-b last:border-b-0 border-(--line) py-5\",\"children\":[[\"$\",\"summary\",null,{\"className\":\"flex items-center justify-between cursor-pointer list-none font-medium text-lg [\u0026::-webkit-details-marker]:hidden\",\"children\":[\"How is this different from Lovable or Replit?\",[\"$\",\"span\",null,{\"className\":\"text-(--muted) transition-transform group-open:rotate-45\",\"aria-hidden\":\"true\",\"children\":\"+\"}]]}],[\"$\",\"p\",null,{\"className\":\"mt-3 text-(--body) leading-relaxed\",\"children\":\"Prompt-to-app builders start from a blank database. Mako's app builder starts from your data layer: the synced sources, dbt models, and saved queries underneath it. You describe the app; it's already wired to numbers that are real and fresh.\"}]]}]\n2b:[\"$\",\"details\",null,{\"className\":\"group border-b last:border-b-0 border-(--line) py-5\",\"children\":[[\"$\",\"summary\",null,{\"className\":\"flex items-center justify-between cursor-pointer list-none font-medium text-lg [\u0026::-webkit-details-marker]:hidden\",\"children\":[\"Can I use Mako from Claude Code or Cursor?\",[\"$\",\"span\",null,{\"className\":\"text-(--muted) transition-transform group-open:rotate-45\",\"aria-hidden\":\"true\",\"children\":\"+\"}]]}],[\"$\",\"p\",null,{\"className\":\"mt-3 text-(--body) leading-relaxed\",\"children\":[\"Yes — Mako is also an \",[\"$\",\"$L8\",null,{\"href\":\"/mcp\",\"className\":\"underline\",\"children\":\"MCP server\"}],\". Create a workspace API key and point Claude Code, Cursor, or Codex at \",[\"$\",\"code\",null,{\"children\":\"/api/mcp\"}],\": your own agent can then explore your schema, run read-only queries, and build Mako apps using your existing AI subscription.\"]}]]}]\n2c:[\"$\",\"details\",null,{\"className\":\"group border-b last:border-b-0 border-(--line) py-5\",\"children\":[[\"$\",\"summary\",null,{\"className\":\"flex items-center justify-between cursor-pointer list-none font-medium text-lg [\u0026::-webkit-details-marker]:hidden\",\"children\":[\"Is it really free?\",[\"$\",\"span\",null,{\"className\":\"text-(--muted) transition-transform group-open:rotate-45\",\"aria-hidden\":\"true\",\"children\":\"+\"}]]}],[\"$\",\"p\",null,{\"className\":\"mt-3 text-(--body) leading-relaxed\",\"children\":\"Mako is MIT-licensed and self-hostable with all features included — no credit card, no trial. If you'd rather not run it yourself, there's a hosted version at app.mako.ai.\"}]]}]\n2d:[\"$\",\"details\",null,{\"className\":\"group border-b last:border-b-0 border-(--line) py-5\",\"children\":[[\"$\",\"summary\",null,{\"className\":\"flex items-center justify-between cursor-pointer list-none font-medium text-lg [\u0026::-webkit-details-marker]:hidden\",\"children\":[\"Where does my data go?\",[\"$\",\"span\",null,{\"className\":\"text-(--muted) transition-transform group-open:rotate-45\",\"aria-hidden\":\"true\",\"children\":\"+\"}]]}],[\"$\",\"p\",null,{\"className\":\"mt-3 text-(--body) leading-relaxed\",\"children\":\"When you self-host, your data stays on your infrastructure. Mako connects to your databases directly; you own the deployment end to end.\"}]]}]\n2e:[\"$\",\"div\",null,{\"className\":\"flex flex-col md:flex-row items-center justify-between gap-4 pt-8 border-t border-(--line) text-sm text-(--muted)\",\"children\":[[\"$\",\"span\",null,{\"children\":[\"© \",2026,\" \",\"RealAdvisor SA\",\". Open source under \",\"MIT\",\".\"]}],[\"$\",\"div\",null,{\"className\":\"flex flex-col md:flex-row items-center gap-4\",\"children\":[[\"$\",\"span\",null,{\"children\":\"Made with 🦈 ⌨️ ☕ 🐘 🦆 somewhere near a terminal.\"}],[\"$\",\"$L39\",null,{}]]}]]}]\n"])</script>
244<script>self.__next_f.push([1,"33:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}]]\n"])</script>
244<script>self.__next_f.push([1,"31:null\n35:[[\"$\",\"title\",\"0\",{\"children\":\"Mako — The open-source AI data platform\"}],[\"$\",\"meta\",\"1\",{\"name\":\"description\",\"content\":\"ETL, dbt orchestration, a SQL client, dashboards, and an app builder — one open-source platform with an AI agent that knows your schema. Replaces five tools.\"}]]\n"])</script>
244<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":"83f4b547d8d44bcc996ccd6d10aabd49","r":1,"spa":2}' crossorigin="anonymous"></script>
244
245</body></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.