index.html html
2,400 lines 108.8 KB
Raw
sha256:700fafdd1afa490919f9515d660ca6e75456bcd5bb67513abcd8757a634c01f6 docs: record AIP-b SD-21 land (KN #308) Human 9 days ago
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1">
6 <meta name="description" content="Knowtation — Markdown vault you own, semantic search, MCP/CLI for agents; proposals need human approval; memory consolidation; hosted Hub or self-host.">
7 <meta name="theme-color" content="#0a192f">
8 <link rel="icon" href="/assets/favicon.png" type="image/png" sizes="32x32">
9 <title>Knowtation — Know and own your data</title>
10 <script>
11 (function () {
12 try {
13 var t = localStorage.getItem('knowtation-theme');
14 if (t === 'light' || t === 'dark') document.documentElement.setAttribute('data-theme', t);
15 } catch (e) {}
16 })();
17 </script>
18 <style>
19 :root {
20 --font-sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
21 --bg: #0a192f;
22 --surface: #0d2138;
23 --surface-elevated: #152a45;
24 --text: #fafafa;
25 --text-muted: #a1a1a1;
26 --accent: #89cff0;
27 --accent-dim: rgba(137, 207, 240, 0.18);
28 --accent-soft: rgba(137, 207, 240, 0.1);
29 --accent-glow: color-mix(in srgb, var(--accent) 32%, transparent);
30 --cta-on-accent: #0a1628;
31 --border: #2a3f5c;
32 --success: #34d399;
33 --radius: 12px;
34 --radius-lg: 20px;
35 --hero-grey-lines: #e4e4e4;
36 }
37 html[data-theme="light"] {
38 --bg: #f5f7fb;
39 --surface: #ffffff;
40 --surface-elevated: #eef2f8;
41 --text: #0f172a;
42 --text-muted: #556070;
43 --border: #d8dee9;
44 --accent: #5eb8e8;
45 --accent-dim: rgba(94, 184, 232, 0.2);
46 --accent-soft: rgba(94, 184, 232, 0.12);
47 --accent-glow: color-mix(in srgb, var(--accent) 28%, transparent);
48 --cta-on-accent: #0a1628;
49 --hero-grey-lines: #4a5a6a;
50 }
51 * { box-sizing: border-box; }
52 html { scroll-behavior: smooth; }
53 body {
54 margin: 0;
55 font-family: var(--font-sans);
56 background: var(--bg);
57 color: var(--text);
58 line-height: 1.65;
59 font-size: 1rem;
60 -webkit-font-smoothing: antialiased;
61 }
62 .container { max-width: 1100px; margin: 0 auto; padding: 0 1.5rem; }
63 .wide { max-width: 1200px; margin: 0 auto; padding: 0 1.5rem; }
64
65 .landing-header {
66 display: flex;
67 justify-content: flex-end;
68 align-items: center;
69 padding: 0.75rem 1.5rem;
70 gap: 0.75rem;
71 flex-wrap: wrap;
72 border-bottom: 1px solid var(--border);
73 }
74 .landing-header-start {
75 display: flex;
76 align-items: center;
77 flex-wrap: wrap;
78 gap: 0.35rem;
79 margin-right: auto;
80 }
81 .landing-header-social {
82 display: flex;
83 align-items: center;
84 gap: 0.15rem;
85 }
86 .social-icon-link {
87 display: inline-flex;
88 align-items: center;
89 justify-content: center;
90 width: 2.25rem;
91 height: 2.25rem;
92 color: var(--text-muted);
93 border-radius: 10px;
94 border: 1px solid transparent;
95 transition: color 0.15s, border-color 0.15s, background 0.15s;
96 }
97 .social-icon-link:hover {
98 color: var(--accent);
99 border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
100 background: var(--surface-elevated);
101 }
102 .social-icon-link svg {
103 width: 1.15rem;
104 height: 1.15rem;
105 fill: currentColor;
106 }
107 .theme-toggle {
108 display: inline-flex;
109 align-items: center;
110 gap: 0.4rem;
111 padding: 0.45rem 0.85rem;
112 font-size: 0.85rem;
113 font-weight: 600;
114 font-family: var(--font-sans);
115 color: var(--text-muted);
116 background: var(--surface);
117 border: 1px solid var(--border);
118 border-radius: 10px;
119 cursor: pointer;
120 transition: color 0.15s, border-color 0.15s, background 0.15s;
121 }
122 .theme-toggle:hover {
123 color: var(--accent);
124 border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
125 background: var(--surface-elevated);
126 }
127 .theme-toggle .theme-toggle-icon { font-size: 1rem; line-height: 1; }
128 .landing-header .cta-signin {
129 padding: 0.5rem 1rem;
130 font-size: 0.9rem;
131 }
132
133 .hero {
134 padding: 2rem 0 1.5rem;
135 text-align: center;
136 }
137 .hero-title-main-only {
138 font-family: var(--font-sans);
139 font-size: clamp(2.1rem, 6vw, 3rem);
140 font-weight: 600;
141 margin: 0 0 0.5rem;
142 letter-spacing: -0.02em;
143 line-height: 1.2;
144 }
145 .hero-brand-sub {
146 font-size: clamp(1.26rem, 2.4vw, 1.5rem);
147 color: var(--text-muted);
148 margin: 0 auto 1.15rem;
149 max-width: 30em;
150 font-weight: 400;
151 line-height: 1.45;
152 }
153 .hero-brand-sub-accent {
154 color: var(--accent);
155 }
156 .hero-messages {
157 max-width: 38rem;
158 margin: 0 auto 1.5rem;
159 text-align: center;
160 }
161 .hero-messages p {
162 margin: 0 0 0.5rem;
163 font-size: 1.1rem;
164 color: var(--hero-grey-lines);
165 line-height: 1.55;
166 font-weight: 400;
167 }
168 .hero-messages p:last-child { margin-bottom: 0; }
169
170 .deploy-headlines {
171 text-align: center;
172 max-width: 42rem;
173 margin: 0 auto 2.25rem;
174 padding: 2.5rem 1.5rem 2.35rem;
175 }
176 .deploy-headlines .deploy-title {
177 font-family: var(--font-sans);
178 font-size: clamp(1.05rem, 2.2vw, 1.28rem);
179 font-weight: 700;
180 color: var(--text);
181 line-height: 1.4;
182 margin: 0;
183 }
184
185 /* Overview video: full-width within .wide, 16:9, continues with channel uploads playlist */
186 .landing-overview-video {
187 margin: 0 auto 0;
188 }
189 .landing-video-frame {
190 position: relative;
191 width: 100%;
192 aspect-ratio: 16 / 9;
193 border-radius: var(--radius-lg);
194 overflow: hidden;
195 border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
196 background: #0a0f18;
197 box-shadow: 0 12px 40px color-mix(in srgb, var(--accent) 12%, transparent);
198 }
199 .landing-video-frame iframe {
200 position: absolute;
201 inset: 0;
202 width: 100%;
203 height: 100%;
204 border: 0;
205 }
206 .landing-channel-strip {
207 margin-top: 1.25rem;
208 }
209 .landing-channel-strip-title {
210 font-family: var(--font-sans);
211 font-size: 0.88rem;
212 font-weight: 600;
213 color: var(--text-muted);
214 text-transform: uppercase;
215 letter-spacing: 0.06em;
216 margin: 0 0 0.65rem;
217 }
218 .landing-channel-scroll {
219 display: flex;
220 gap: 0.75rem;
221 overflow-x: auto;
222 padding-bottom: 0.35rem;
223 scroll-snap-type: x mandatory;
224 -webkit-overflow-scrolling: touch;
225 }
226 .landing-channel-scroll::-webkit-scrollbar {
227 height: 6px;
228 }
229 .landing-channel-scroll::-webkit-scrollbar-thumb {
230 background: color-mix(in srgb, var(--accent) 45%, var(--border));
231 border-radius: 3px;
232 }
233 .landing-channel-card {
234 flex: 0 0 min(240px, 72vw);
235 scroll-snap-align: start;
236 border-radius: 10px;
237 overflow: hidden;
238 border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--border));
239 background: var(--surface-elevated);
240 text-decoration: none;
241 color: var(--text);
242 transition: border-color 0.15s, transform 0.15s;
243 }
244 .landing-channel-card:hover {
245 border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
246 transform: translateY(-2px);
247 }
248 .landing-channel-card:focus-visible {
249 outline: 2px solid var(--accent);
250 outline-offset: 2px;
251 }
252 .landing-channel-card img {
253 display: block;
254 width: 100%;
255 aspect-ratio: 16 / 9;
256 object-fit: cover;
257 background: #111;
258 }
259 .landing-channel-card span {
260 display: block;
261 padding: 0.5rem 0.65rem 0.65rem;
262 font-size: 0.88rem;
263 font-weight: 600;
264 line-height: 1.35;
265 }
266 .landing-channel-card--subscribe span {
267 color: var(--accent);
268 }
269 .landing-channel-card--text {
270 display: flex;
271 align-items: center;
272 justify-content: center;
273 min-height: 8.5rem;
274 background: linear-gradient(135deg, var(--surface-elevated) 0%, var(--surface) 100%);
275 }
276 .landing-channel-card--text span {
277 padding: 1rem;
278 text-align: center;
279 }
280
281 .spotlight-intro {
282 text-align: center;
283 max-width: 52rem;
284 margin: 5.5rem auto 1.75rem;
285 padding: 0 1.5rem;
286 }
287 .spotlight-intro-title {
288 font-family: var(--font-sans);
289 font-size: clamp(1.65rem, 4.8vw, 2.65rem);
290 font-weight: 700;
291 color: var(--accent);
292 line-height: 1.22;
293 margin: 0 0 0.85rem;
294 letter-spacing: -0.025em;
295 text-wrap: balance;
296 }
297 .spotlight-intro-subtitle {
298 font-family: var(--font-sans);
299 font-size: clamp(0.95rem, 2.1vw, 1.12rem);
300 font-weight: 500;
301 color: var(--hero-grey-lines);
302 line-height: 1.5;
303 margin: 0 auto;
304 max-width: 38rem;
305 text-wrap: balance;
306 }
307 html[data-theme="light"] .spotlight-intro-subtitle {
308 color: var(--text-muted);
309 }
310
311 .spotlight-pair {
312 display: grid;
313 grid-template-columns: 1fr 1fr;
314 gap: 1.25rem;
315 max-width: 1100px;
316 margin: 0 auto 2rem;
317 padding: 0 1.5rem;
318 }
319 @media (max-width: 768px) {
320 .spotlight-pair { grid-template-columns: 1fr; }
321 }
322 .spotlight-card {
323 padding: 1.5rem 1.35rem;
324 text-align: center;
325 border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
326 border-radius: var(--radius-lg);
327 background: linear-gradient(135deg, var(--surface-elevated) 0%, var(--surface) 100%);
328 }
329 .spotlight-card-icon {
330 font-size: 2.1rem;
331 line-height: 1;
332 margin-bottom: 0.45rem;
333 }
334 .spotlight-card h2 {
335 font-family: var(--font-sans);
336 font-size: clamp(1.05rem, 2.2vw, 1.25rem);
337 font-weight: 700;
338 margin: 0 0 0.55rem;
339 color: var(--text);
340 }
341 .spotlight-card p {
342 margin: 0;
343 font-size: 0.95rem;
344 color: var(--text-muted);
345 line-height: 1.6;
346 }
347 .spotlight-card a {
348 color: var(--accent);
349 text-decoration: none;
350 font-weight: 600;
351 }
352 .spotlight-card a:hover { text-decoration: underline; }
353
354 .cta {
355 display: inline-flex;
356 align-items: center;
357 gap: 0.5rem;
358 background: var(--accent);
359 color: var(--cta-on-accent);
360 padding: 0.85rem 1.75rem;
361 border-radius: 10px;
362 font-weight: 600;
363 font-size: 0.95rem;
364 text-decoration: none;
365 transition: transform 0.15s, box-shadow 0.15s;
366 }
367 .cta:hover {
368 transform: translateY(-1px);
369 box-shadow: 0 8px 24px var(--accent-glow);
370 }
371 .cta-secondary {
372 background: transparent;
373 color: var(--accent);
374 border: 1px solid var(--accent);
375 }
376 .cta-secondary:hover {
377 background: var(--accent-soft);
378 box-shadow: none;
379 }
380 .hero .cta-row .cta-secondary {
381 border-color: var(--accent);
382 }
383 .cta-row {
384 display: flex;
385 flex-wrap: wrap;
386 justify-content: center;
387 align-items: center;
388 gap: 0.75rem;
389 margin-top: 1.25rem;
390 }
391 .hero .cta-row {
392 display: grid;
393 grid-template-columns: 1fr 1fr;
394 align-items: stretch;
395 width: 100%;
396 max-width: 26rem;
397 margin-left: auto;
398 margin-right: auto;
399 gap: 0.75rem;
400 }
401 .hero .cta-row .cta {
402 justify-content: center;
403 text-align: center;
404 width: 100%;
405 box-sizing: border-box;
406 padding-left: 1rem;
407 padding-right: 1rem;
408 }
409 @media (max-width: 480px) {
410 .hero .cta-row {
411 grid-template-columns: 1fr;
412 max-width: 20rem;
413 }
414 }
415
416 .badge {
417 display: inline-flex;
418 align-items: center;
419 gap: 0.4rem;
420 background: var(--accent-dim);
421 color: var(--accent);
422 padding: 0.4rem 1rem;
423 border-radius: 999px;
424 font-size: 0.8rem;
425 font-weight: 600;
426 text-decoration: none;
427 letter-spacing: 0.02em;
428 }
429 .badge:hover {
430 background: color-mix(in srgb, var(--accent) 28%, transparent);
431 color: var(--accent);
432 }
433 .badge-wrap .badge {
434 color: var(--text-muted);
435 }
436 .badge-wrap .badge:hover {
437 color: var(--text-muted);
438 }
439 .badge-wrap { text-align: center; padding: 1rem 0 0.5rem; }
440
441 /* Band B — three steps only, after hero + GitHub badge, before deploy headlines */
442 .band-b-path {
443 margin: 0 auto;
444 padding: 0.5rem 1.5rem 1.75rem;
445 }
446 .band-b-path-inner {
447 max-width: 56rem;
448 margin: 0 auto;
449 border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--border));
450 border-radius: var(--radius-lg);
451 background: linear-gradient(135deg, var(--surface-elevated) 0%, var(--surface) 100%);
452 padding: 1.2rem 1.15rem 1.35rem;
453 }
454 .band-b-steps {
455 display: grid;
456 grid-template-columns: repeat(3, 1fr);
457 gap: 0.85rem;
458 list-style: none;
459 margin: 0;
460 padding: 0;
461 align-items: stretch;
462 }
463 @media (max-width: 720px) {
464 .band-b-steps { grid-template-columns: 1fr; }
465 }
466 .band-b-step {
467 margin: 0;
468 padding: 1rem 0.9rem 1.05rem;
469 border-radius: var(--radius);
470 border: 1px solid var(--border);
471 background: var(--surface);
472 display: flex;
473 flex-direction: column;
474 min-height: 100%;
475 }
476 .band-b-step-head {
477 display: flex;
478 flex-direction: row;
479 align-items: center;
480 gap: 0.5rem;
481 margin: 0 0 0.5rem;
482 }
483 .band-b-step-marker {
484 flex-shrink: 0;
485 font-family: var(--font-sans);
486 font-size: clamp(1.5rem, 3.8vw, 2.1rem);
487 font-weight: 700;
488 line-height: 1;
489 color: var(--accent);
490 letter-spacing: -0.03em;
491 }
492 .band-b-step-title {
493 font-family: var(--font-sans);
494 font-size: clamp(0.95rem, 2vw, 1.05rem);
495 font-weight: 700;
496 margin: 0;
497 color: var(--text);
498 line-height: 1.25;
499 }
500 .band-b-step p {
501 flex: 1 1 auto;
502 margin: 0;
503 font-size: 0.86rem;
504 color: var(--text-muted);
505 line-height: 1.55;
506 min-height: calc(2 * 1.55 * 0.86rem);
507 }
508 .band-b-step-links {
509 margin-top: auto;
510 padding-top: 0.55rem;
511 display: flex;
512 flex-direction: column;
513 align-items: flex-start;
514 gap: 0.35rem;
515 }
516 .band-b-step-link {
517 font-size: 0.86rem;
518 font-weight: 600;
519 color: var(--accent);
520 text-decoration: none;
521 border: none;
522 background: none;
523 padding: 0;
524 }
525 .band-b-step-link:hover {
526 text-decoration: underline;
527 }
528 .band-b-step-link:focus-visible {
529 outline: 2px solid var(--accent);
530 outline-offset: 2px;
531 border-radius: 4px;
532 }
533 .band-b-step-link--secondary {
534 font-weight: 500;
535 margin-top: 0.4rem;
536 color: color-mix(in srgb, var(--accent) 88%, var(--text-muted));
537 }
538 .band-b-step-link--secondary:hover {
539 color: var(--accent);
540 }
541
542 /* Ecosystem rings (hero graphic) */
543 .landing-ecosystem {
544 position: relative;
545 margin: 1.5rem auto 0;
546 max-width: 360px;
547 padding: 1rem;
548 isolation: isolate;
549 }
550 .landing-ecosystem::before {
551 content: "";
552 position: absolute;
553 left: 50%;
554 top: 50%;
555 width: min(100%, 340px);
556 height: min(100%, 340px);
557 max-width: 340px;
558 max-height: 340px;
559 transform: translate(-50%, -50%);
560 border-radius: 50%;
561 background: radial-gradient(
562 ellipse 58% 58% at 50% 50%,
563 color-mix(in srgb, var(--accent) 16%, transparent) 0%,
564 transparent 72%
565 );
566 pointer-events: none;
567 z-index: 0;
568 }
569 .landing-ecosystem-rings {
570 position: relative;
571 width: 320px;
572 height: 320px;
573 margin: 0 auto;
574 z-index: 1;
575 filter:
576 drop-shadow(0 0 14px color-mix(in srgb, var(--accent) 28%, transparent))
577 drop-shadow(0 0 32px color-mix(in srgb, var(--accent) 12%, transparent));
578 }
579 .landing-ecosystem-svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
580 .landing-ecosystem-center {
581 position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
582 display: flex; flex-direction: column; align-items: center; gap: 0.35rem; z-index: 2;
583 padding: 1.25rem; min-width: 100px; min-height: 90px; box-sizing: border-box;
584 }
585 .landing-ecosystem-core-icon {
586 font-size: 2.75rem;
587 line-height: 1;
588 filter: grayscale(0.15)
589 drop-shadow(0 0 8px color-mix(in srgb, var(--accent) 40%, transparent))
590 drop-shadow(0 0 18px color-mix(in srgb, var(--accent) 18%, transparent));
591 }
592 .landing-ecosystem-core-label {
593 color: var(--accent);
594 font-weight: 600;
595 font-size: 0.95rem;
596 text-shadow:
597 0 0 12px color-mix(in srgb, var(--accent) 45%, transparent),
598 0 0 24px color-mix(in srgb, var(--accent) 20%, transparent);
599 }
600 .landing-ecosystem-icon {
601 position: absolute; left: 50%; top: 50%; width: 36px; height: 36px; margin-left: -18px; margin-top: -18px;
602 display: flex; align-items: center; justify-content: center; font-size: 1.35rem;
603 transform-origin: center center; z-index: 1; opacity: 0.9;
604 }
605 .landing-ecosystem-icon-1 { transform: rotate(0deg) translate(0, -90px); }
606 .landing-ecosystem-icon-2 { transform: rotate(45deg) translate(0, -90px); }
607 .landing-ecosystem-icon-3 { transform: rotate(90deg) translate(0, -90px); }
608 .landing-ecosystem-icon-4 { transform: rotate(135deg) translate(0, -90px); }
609 .landing-ecosystem-icon-5 { transform: rotate(180deg) translate(0, -90px); }
610 .landing-ecosystem-icon-6 { transform: rotate(225deg) translate(0, -90px); }
611 .landing-ecosystem-icon-7 { transform: rotate(270deg) translate(0, -90px); }
612 .landing-ecosystem-icon-8 { transform: rotate(315deg) translate(0, -90px); }
613 .landing-ecosystem-icon-9 { transform: rotate(0deg) translate(0, -135px); }
614 .landing-ecosystem-icon-10 { transform: rotate(30deg) translate(0, -135px); }
615 .landing-ecosystem-icon-11 { transform: rotate(60deg) translate(0, -135px); }
616 .landing-ecosystem-icon-12 { transform: rotate(90deg) translate(0, -135px); }
617 .landing-ecosystem-icon-13 { transform: rotate(120deg) translate(0, -135px); }
618 .landing-ecosystem-icon-14 { transform: rotate(150deg) translate(0, -135px); }
619 .landing-ecosystem-icon-15 { transform: rotate(180deg) translate(0, -135px); }
620 .landing-ecosystem-icon-16 { transform: rotate(210deg) translate(0, -135px); }
621 .landing-ecosystem-icon-17 { transform: rotate(240deg) translate(0, -135px); }
622 .landing-ecosystem-icon-18 { transform: rotate(270deg) translate(0, -135px); }
623 .landing-ecosystem-icon-19 { transform: rotate(300deg) translate(0, -135px); }
624 .landing-ecosystem-icon-20 { transform: rotate(330deg) translate(0, -135px); }
625
626 /* Vertical flow */
627 .flow-intro-block {
628 text-align: center;
629 padding: 2rem 1.5rem 1rem;
630 max-width: 44rem;
631 margin: 0 auto;
632 }
633 .flow-intro-block--after-ecosystem {
634 padding-top: 2.75rem;
635 padding-bottom: 1.5rem;
636 }
637 .flow-intro-title {
638 font-family: var(--font-sans);
639 font-size: clamp(1.45rem, 4.2vw, 2.15rem);
640 font-weight: 700;
641 color: var(--text);
642 line-height: 1.3;
643 margin: 0 0 0.65rem;
644 letter-spacing: -0.02em;
645 }
646 .flow-intro-sub {
647 font-size: clamp(0.88rem, 2vw, 1rem);
648 color: var(--text-muted);
649 line-height: 1.55;
650 margin: 0 0 0.85rem;
651 font-weight: 400;
652 }
653 .flow-intro-sub--accent {
654 color: var(--accent);
655 font-weight: 600;
656 }
657 /* Structured memory (hero fold + main): same type scale as Ecosystem visions; doc-link blue, normal weight, centered */
658 .structured-memory-heading {
659 color: #58a6ff;
660 text-align: center;
661 font-weight: 400;
662 text-shadow: none;
663 }
664 html[data-theme="light"] .structured-memory-heading {
665 color: #0969da;
666 }
667 .ecosystem-vision-heading-wrap .flow-intro-title.structured-memory-heading {
668 text-shadow: none;
669 }
670 .hero-value-fold-heading-text {
671 margin: 0;
672 }
673 .hero-value-fold-summary-row {
674 display: flex;
675 align-items: center;
676 justify-content: center;
677 gap: 0.55rem;
678 }
679 .hero-value-fold-chevron {
680 flex-shrink: 0;
681 font-size: 2.35rem;
682 line-height: 0.85;
683 font-weight: 700;
684 color: #4da3ff;
685 text-shadow:
686 0 0 8px rgba(77, 163, 255, 0.95),
687 0 0 18px rgba(77, 163, 255, 0.55);
688 transition: transform 0.2s ease;
689 }
690 html[data-theme="light"] .hero-value-fold-chevron {
691 color: #0969da;
692 text-shadow:
693 0 0 6px rgba(9, 105, 218, 0.45),
694 0 0 14px rgba(9, 105, 218, 0.28);
695 }
696 .hero-value-fold[open] .hero-value-fold-chevron {
697 transform: rotate(-180deg);
698 }
699 .hero-value-fold-triangle {
700 display: flex;
701 flex-direction: column;
702 align-items: center;
703 gap: 0.28rem;
704 margin-top: 0.4rem;
705 width: 100%;
706 }
707 .hero-value-fold-triangle span {
708 display: block;
709 height: 2px;
710 border-radius: 1px;
711 background: #4da3ff;
712 }
713 html[data-theme="light"] .hero-value-fold-triangle span {
714 background: #0969da;
715 }
716 .hero-value-fold-triangle span:nth-child(1) { width: 8.25rem; }
717 .hero-value-fold-triangle span:nth-child(2) { width: 5.15rem; }
718 .hero-value-fold-triangle span:nth-child(3) { width: 2.35rem; }
719 .feature-highlights {
720 padding: 2.5rem 0 2.75rem;
721 border-top: 1px solid var(--border);
722 }
723 .feature-highlights h2 {
724 font-family: var(--font-sans);
725 text-align: center;
726 font-size: clamp(1.2rem, 2.8vw, 1.5rem);
727 font-weight: 700;
728 margin: 0 0 0.35rem;
729 color: var(--text);
730 }
731 .feature-highlights .feature-highlights-lead {
732 text-align: center;
733 color: var(--text-muted);
734 font-size: 0.95rem;
735 max-width: 34em;
736 margin: 0 auto 1.75rem;
737 line-height: 1.55;
738 }
739 .feature-highlights-grid {
740 display: grid;
741 grid-template-columns: repeat(4, 1fr);
742 gap: 1.25rem;
743 }
744 @media (max-width: 1024px) {
745 .feature-highlights-grid { grid-template-columns: repeat(2, 1fr); }
746 }
747 @media (max-width: 520px) {
748 .feature-highlights-grid { grid-template-columns: 1fr; }
749 }
750
751 .ecosystem-vision-section {
752 position: relative;
753 isolation: isolate;
754 overflow: visible;
755 padding: 4.25rem 0 3.75rem;
756 margin-top: 1.5rem;
757 border-top: 1px solid var(--border);
758 }
759 .ecosystem-vision-section::before {
760 content: "";
761 position: absolute;
762 inset: 0;
763 pointer-events: none;
764 z-index: 0;
765 /* Ellipse must stay ≤100% wide or the fade clips as sharp vertical edges. */
766 background: radial-gradient(
767 ellipse 72% 70% at 50% 54%,
768 color-mix(in srgb, var(--accent) 15%, transparent) 0%,
769 color-mix(in srgb, var(--accent) 4.5%, transparent) 48%,
770 transparent 72%
771 );
772 }
773 .ecosystem-vision-section > * {
774 position: relative;
775 z-index: 1;
776 }
777 .ecosystem-vision-heading-wrap {
778 display: flex;
779 justify-content: center;
780 padding: 1.25rem 1rem 0.35rem;
781 margin: 0 auto;
782 max-width: 44rem;
783 }
784 .ecosystem-vision-heading-wrap .flow-intro-title {
785 text-align: center;
786 max-width: 40rem;
787 margin-left: auto;
788 margin-right: auto;
789 text-shadow:
790 0 0 5px color-mix(in srgb, var(--accent) 58%, transparent),
791 0 0 12px color-mix(in srgb, var(--accent) 32%, transparent);
792 }
793 .ecosystem-architecture-title {
794 font-family: var(--font-sans);
795 text-align: center;
796 font-size: clamp(1.2rem, 2.8vw, 1.5rem);
797 font-weight: 700;
798 margin: 0 0 1.15rem;
799 color: var(--accent);
800 letter-spacing: -0.02em;
801 }
802 .ecosystem-vision-lead {
803 text-align: center;
804 color: var(--text-muted);
805 font-size: 0.98rem;
806 max-width: 40rem;
807 margin: 0 auto 1.5rem;
808 line-height: 1.6;
809 }
810 .ecosystem-vision-lead a,
811 .ecosystem-vision-lead a:visited,
812 .family-presence-band a,
813 .family-presence-band a:visited,
814 a.ourware-link,
815 a.ourware-link:visited {
816 color: #7dd3fc;
817 font-weight: 700;
818 text-decoration: underline;
819 text-underline-offset: 0.15em;
820 }
821 html[data-theme="light"] .ecosystem-vision-lead a,
822 html[data-theme="light"] .ecosystem-vision-lead a:visited,
823 html[data-theme="light"] .family-presence-band a,
824 html[data-theme="light"] .family-presence-band a:visited,
825 html[data-theme="light"] a.ourware-link,
826 html[data-theme="light"] a.ourware-link:visited {
827 color: #0369a1;
828 }
829 .family-presence-band {
830 background: #000;
831 color: #e8eef6;
832 padding: 3.25rem 1.5rem;
833 margin: 0;
834 border-top: 1px solid #1a1a1a;
835 }
836 .family-presence-inner {
837 max-width: 1100px;
838 margin: 0 auto;
839 display: grid;
840 grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.2fr);
841 gap: 2rem 2.5rem;
842 align-items: center;
843 }
844 @media (max-width: 800px) {
845 .family-presence-inner { grid-template-columns: 1fr; }
846 }
847 .family-presence-figure {
848 margin: 0;
849 }
850 .family-presence-figure img {
851 display: block;
852 width: 100%;
853 height: auto;
854 border-radius: 14px;
855 background: #111;
856 }
857 .family-presence-copy h2 {
858 font-family: var(--font-sans);
859 font-size: clamp(1.25rem, 3vw, 1.65rem);
860 font-weight: 700;
861 color: #fff;
862 margin: 0 0 0.85rem;
863 letter-spacing: -0.02em;
864 }
865 .family-presence-copy p {
866 margin: 0 0 0.85rem;
867 line-height: 1.65;
868 font-size: 0.98rem;
869 color: #d7dee8;
870 }
871 .family-presence-copy p:last-child { margin-bottom: 0; }
872 .brain-grow-show {
873 margin: 0;
874 }
875 .brain-grow-show__kicker {
876 margin: 0 0 0.65rem;
877 font-size: 0.78rem;
878 letter-spacing: 0.08em;
879 text-transform: uppercase;
880 color: #9aa8b8;
881 font-weight: 600;
882 }
883 .brain-grow-show__stack {
884 position: relative;
885 overflow: hidden;
886 border-radius: 14px;
887 background: #111;
888 aspect-ratio: 3 / 2;
889 }
890 .brain-grow-show__slide {
891 position: absolute;
892 inset: 0;
893 opacity: 0;
894 transition: opacity 0.45s ease;
895 pointer-events: none;
896 }
897 .brain-grow-show__slide.is-active {
898 opacity: 1;
899 pointer-events: auto;
900 }
901 .brain-grow-show__slide img {
902 display: block;
903 width: 100%;
904 height: 100%;
905 object-fit: cover;
906 background: #111;
907 }
908 .brain-grow-show__caption {
909 margin: 0.7rem 0 0;
910 text-align: center;
911 color: #f4f7fb;
912 font-size: 0.95rem;
913 }
914 .brain-grow-show__dots {
915 display: flex;
916 flex-wrap: wrap;
917 justify-content: center;
918 gap: 0.4rem;
919 margin-top: 0.7rem;
920 }
921 .brain-grow-show__dot {
922 width: 0.55rem;
923 height: 0.55rem;
924 padding: 0;
925 border-radius: 50%;
926 border: 1px solid #9aa8b8;
927 background: transparent;
928 cursor: pointer;
929 }
930 .brain-grow-show__dot[aria-current="true"] {
931 background: #f4f7fb;
932 border-color: #f4f7fb;
933 }
934 .ecosystem-flow-row {
935 display: flex;
936 flex-wrap: wrap;
937 align-items: stretch;
938 justify-content: center;
939 gap: 0.65rem 0.5rem;
940 margin: 0 auto 1.25rem;
941 max-width: 56rem;
942 }
943 .ecosystem-flow-row.ecosystem-flow-row--in-card {
944 margin-top: 0;
945 margin-bottom: 1.35rem;
946 max-width: 100%;
947 }
948 .ecosystem-flow-node {
949 flex: 1 1 120px;
950 min-width: 100px;
951 max-width: 160px;
952 padding: 0.85rem 0.65rem;
953 border-radius: var(--radius);
954 border: 1px solid var(--border);
955 background: var(--surface);
956 text-align: center;
957 font-size: 0.8rem;
958 font-weight: 600;
959 color: var(--text);
960 line-height: 1.35;
961 }
962 .ecosystem-flow-node span {
963 display: block;
964 font-weight: 400;
965 font-size: 0.72rem;
966 color: var(--text-muted);
967 margin-top: 0.25rem;
968 }
969 .ecosystem-flow-arrow {
970 align-self: center;
971 color: var(--accent);
972 font-size: 1.1rem;
973 opacity: 0.85;
974 }
975 @media (max-width: 640px) {
976 .ecosystem-flow-arrow { display: none; }
977 }
978 .ecosystem-vision-card {
979 border: none;
980 border-radius: 0;
981 background: transparent;
982 padding: 0.5rem 0 0;
983 margin-top: 0.35rem;
984 max-width: 40rem;
985 margin-left: auto;
986 margin-right: auto;
987 }
988 .ecosystem-vision-card > p {
989 margin: 0 0 1rem;
990 font-size: 0.95rem;
991 color: var(--text-muted);
992 line-height: 1.6;
993 }
994 .ecosystem-vision-card .flow-details { margin-top: 0.5rem; }
995 .ecosystem-doc-link-hint {
996 font-size: 0.82rem;
997 color: var(--text-muted);
998 margin: 0.75rem 0 0;
999 }
1000 .feature-highlight-card {
1001 border: 1px solid var(--border);
1002 border-radius: var(--radius);
1003 padding: 1.35rem 1.25rem;
1004 background: var(--surface);
1005 text-align: center;
1006 }
1007 .feature-highlight-card .fh-icon {
1008 font-size: 2rem;
1009 line-height: 1;
1010 margin-bottom: 0.5rem;
1011 }
1012 .feature-highlight-card h3 {
1013 font-family: var(--font-sans);
1014 font-size: 1.05rem;
1015 font-weight: 700;
1016 margin: 0 0 0.45rem;
1017 color: var(--text);
1018 }
1019 .feature-highlight-card p {
1020 margin: 0;
1021 font-size: 0.9rem;
1022 color: var(--text-muted);
1023 line-height: 1.55;
1024 }
1025 .flow-track {
1026 padding: 1rem 0 3rem;
1027 }
1028 .flow-step {
1029 display: grid;
1030 grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
1031 gap: 1.75rem 2.5rem;
1032 align-items: start;
1033 padding: 3rem 0;
1034 margin-bottom: 0.5rem;
1035 border-top: 1px solid var(--border);
1036 }
1037 .flow-step:first-of-type { border-top: none; padding-top: 1.5rem; }
1038 @media (max-width: 820px) {
1039 .flow-step {
1040 grid-template-columns: 1fr;
1041 gap: 1rem;
1042 }
1043 }
1044 .flow-visual {
1045 text-align: center;
1046 padding: 0.5rem 1rem;
1047 }
1048 @media (min-width: 821px) {
1049 .flow-visual { text-align: left; padding-left: 0; }
1050 }
1051 .flow-step-num {
1052 font-size: 0.75rem;
1053 font-weight: 700;
1054 letter-spacing: 0.12em;
1055 text-transform: uppercase;
1056 color: var(--accent);
1057 margin: 0 0 0.5rem;
1058 }
1059 .flow-icon {
1060 font-size: clamp(2.5rem, 6vw, 3.25rem);
1061 line-height: 1.2;
1062 display: block;
1063 margin-bottom: 0.35rem;
1064 }
1065 .flow-visual-caption {
1066 font-size: clamp(1.05rem, 2.4vw, 1.7rem);
1067 color: var(--text-muted);
1068 margin: 0;
1069 max-width: 18rem;
1070 line-height: 1.4;
1071 font-weight: 500;
1072 margin-left: auto;
1073 margin-right: auto;
1074 }
1075 @media (min-width: 821px) {
1076 .flow-visual-caption { margin-left: 0; }
1077 }
1078 .flow-import-icons {
1079 display: flex;
1080 flex-wrap: wrap;
1081 gap: 0.3rem 0.55rem;
1082 margin: 0.75rem auto 0;
1083 max-width: 20rem;
1084 justify-content: center;
1085 }
1086 @media (min-width: 821px) {
1087 .flow-import-icons { justify-content: flex-start; margin-left: 0; max-width: 22rem; }
1088 }
1089 .flow-import-icon {
1090 font-size: 0.68rem;
1091 color: var(--text-muted);
1092 white-space: nowrap;
1093 line-height: 1.3;
1094 }
1095 .flow-import-grid {
1096 display: grid;
1097 grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr));
1098 gap: 0.45rem;
1099 margin: 0.75rem 0;
1100 }
1101 .flow-import-tile {
1102 display: flex;
1103 flex-direction: column;
1104 align-items: center;
1105 padding: 0.45rem 0.35rem;
1106 border-radius: 6px;
1107 border: 1px solid var(--border);
1108 background: var(--card-bg, rgba(255,255,255,0.03));
1109 text-align: center;
1110 font-size: 0.78rem;
1111 line-height: 1.3;
1112 }
1113 .flow-import-tile small {
1114 font-size: 0.65rem;
1115 color: var(--text-muted);
1116 }
1117 .flow-detail-heading {
1118 font-size: 0.9rem;
1119 font-weight: 700;
1120 margin: 1rem 0 0.35rem;
1121 letter-spacing: -0.02em;
1122 }
1123 .detail-inner > .flow-detail-heading:first-of-type {
1124 margin-top: 0;
1125 }
1126 .flow-body h2 {
1127 font-family: var(--font-sans);
1128 font-size: clamp(1.35rem, 3vw, 1.65rem);
1129 font-weight: 700;
1130 margin: 0 0 0.65rem;
1131 letter-spacing: -0.02em;
1132 line-height: 1.25;
1133 }
1134 .flow-body > p {
1135 margin: 0 0 1rem;
1136 color: var(--text-muted);
1137 font-size: 0.98rem;
1138 max-width: 38em;
1139 }
1140 .flow-details {
1141 margin-top: 0.25rem;
1142 border: 1px solid var(--border);
1143 border-radius: var(--radius);
1144 background: var(--surface);
1145 overflow: hidden;
1146 }
1147 .flow-details summary {
1148 cursor: pointer;
1149 padding: 0.85rem 1.1rem;
1150 font-weight: 600;
1151 font-size: 0.9rem;
1152 color: var(--accent);
1153 list-style: none;
1154 display: flex;
1155 align-items: center;
1156 justify-content: space-between;
1157 gap: 0.75rem;
1158 user-select: none;
1159 }
1160 .flow-details summary::-webkit-details-marker { display: none; }
1161 .flow-details summary::after {
1162 content: "▾";
1163 font-size: 0.75rem;
1164 opacity: 0.7;
1165 transition: transform 0.2s;
1166 }
1167 .flow-details[open] summary::after { transform: rotate(180deg); }
1168 .flow-details summary:hover { background: var(--surface-elevated); }
1169 .flow-details .detail-inner {
1170 padding: 0 1.1rem 1.1rem;
1171 border-top: 1px solid var(--border);
1172 font-size: 0.88rem;
1173 color: var(--text-muted);
1174 line-height: 1.65;
1175 }
1176 .flow-details .detail-inner ul {
1177 margin: 0.5rem 0 0;
1178 padding-left: 1.2rem;
1179 }
1180 .flow-details .detail-inner li { margin-bottom: 0.4rem; }
1181 .flow-details .detail-inner a { color: var(--accent); text-decoration: none; }
1182 .flow-details .detail-inner a:hover { text-decoration: underline; }
1183 .flow-details code {
1184 background: var(--surface-elevated);
1185 padding: 0.12rem 0.35rem;
1186 border-radius: 4px;
1187 font-size: 0.86em;
1188 }
1189
1190 .flow-closing {
1191 text-align: center;
1192 padding: 2rem 1.5rem 3rem;
1193 border-top: 1px solid var(--border);
1194 }
1195 .flow-closing p { color: var(--text-muted); font-size: 0.95rem; max-width: 32em; margin: 0 auto 1.25rem; }
1196
1197 /* Value pitch: differentiation + proposals + glossary (see docs/WHITEPAPER.md) */
1198 .value-pitch {
1199 padding: 1.75rem 1.5rem 2rem;
1200 background: var(--surface);
1201 border-bottom: 1px solid var(--border);
1202 }
1203 .value-pitch-inner { max-width: 960px; margin: 0 auto; }
1204 .value-pitch > .value-pitch-inner > .ecosystem-vision-heading-wrap {
1205 padding-top: 0.25rem;
1206 padding-bottom: 0.5rem;
1207 }
1208 .value-pitch-lead {
1209 margin: 0 0 1.25rem;
1210 color: var(--text-muted);
1211 font-size: 1.05rem;
1212 max-width: 48rem;
1213 }
1214 .value-pitch-root-list {
1215 list-style: none;
1216 margin: 0 0 1.1rem;
1217 padding: 0;
1218 max-width: none;
1219 display: flex;
1220 flex-wrap: wrap;
1221 align-items: center;
1222 column-gap: 0.65rem;
1223 row-gap: 0.35rem;
1224 color: var(--text-muted);
1225 font-size: 1.05rem;
1226 line-height: 1.45;
1227 }
1228 .value-pitch-root-list li {
1229 position: relative;
1230 padding-left: 0.75rem;
1231 margin-bottom: 0;
1232 flex: 0 1 auto;
1233 }
1234 .value-pitch-root-list li::before {
1235 content: "";
1236 position: absolute;
1237 left: 0;
1238 top: 0.55em;
1239 width: 0.35rem;
1240 height: 0.35rem;
1241 border-radius: 50%;
1242 background: #58a6ff;
1243 }
1244 html[data-theme="light"] .value-pitch-root-list li::before {
1245 background: #0969da;
1246 }
1247 .value-pitch-grid {
1248 display: grid;
1249 gap: 1.25rem;
1250 margin-bottom: 1.25rem;
1251 align-items: stretch;
1252 }
1253 @media (min-width: 768px) {
1254 .value-pitch-grid { grid-template-columns: 1fr 1fr; }
1255 }
1256 .value-blurb {
1257 display: flex;
1258 flex-direction: column;
1259 min-height: 100%;
1260 background: var(--surface-elevated);
1261 border: 1px solid var(--border);
1262 border-radius: var(--radius);
1263 padding: 1.1rem 1.25rem;
1264 }
1265 .value-blurb > .landing-details {
1266 margin-top: auto;
1267 }
1268 .value-blurb h3 {
1269 margin: 0 0 0.65rem;
1270 font-size: 1.05rem;
1271 }
1272 .value-blurb ul { margin: 0; padding-left: 1.2rem; color: var(--text-muted); font-size: 0.95rem; }
1273 .value-blurb li { margin-bottom: 0.4rem; }
1274 .value-pill-caption {
1275 margin: 0 0 0.5rem;
1276 font-size: 0.85rem;
1277 font-weight: 600;
1278 color: var(--text-muted);
1279 text-transform: uppercase;
1280 letter-spacing: 0.04em;
1281 }
1282 .value-pill-row {
1283 list-style: none;
1284 margin: 0 0 1rem;
1285 padding: 0;
1286 display: flex;
1287 flex-wrap: wrap;
1288 gap: 0.45rem;
1289 }
1290 .value-pill-row li {
1291 margin: 0;
1292 font-size: 0.82rem;
1293 padding: 0.28rem 0.65rem;
1294 border-radius: 999px;
1295 border: 1px solid var(--border);
1296 background: color-mix(in srgb, var(--accent-soft) 40%, var(--surface));
1297 color: var(--text);
1298 }
1299 .landing-details {
1300 margin-top: 0.75rem;
1301 border-radius: var(--radius);
1302 border: 1px solid var(--border);
1303 background: var(--surface);
1304 padding: 0;
1305 }
1306 .landing-details + .landing-details { margin-top: 0.5rem; }
1307 .landing-details summary {
1308 cursor: pointer;
1309 font-weight: 600;
1310 padding: 0.65rem 0.85rem;
1311 list-style: none;
1312 display: flex;
1313 align-items: center;
1314 gap: 0.5rem;
1315 user-select: none;
1316 }
1317 .landing-details summary::-webkit-details-marker { display: none; }
1318 .landing-details summary::before {
1319 content: "▶";
1320 font-size: 1rem;
1321 line-height: 1;
1322 color: #58a6ff;
1323 flex-shrink: 0;
1324 transition: transform 0.2s ease;
1325 }
1326 html[data-theme="light"] .landing-details summary::before {
1327 color: #0969da;
1328 }
1329 .landing-details[open] summary::before {
1330 transform: rotate(90deg);
1331 }
1332 .landing-details[open] summary {
1333 border-bottom: 1px solid var(--border);
1334 }
1335 .landing-details .landing-details-body {
1336 padding: 0.75rem 0.85rem 0.9rem;
1337 font-size: 0.9rem;
1338 color: var(--text-muted);
1339 line-height: 1.55;
1340 }
1341 .landing-details .landing-details-body a { color: var(--accent); }
1342
1343 /* Hero fold: full structured-memory block, collapsed by default (sits under hero graphic, above CTAs) */
1344 .hero-value-fold {
1345 margin-top: 1.35rem;
1346 margin-bottom: 1.25rem;
1347 text-align: left;
1348 width: 100%;
1349 max-width: none;
1350 margin-left: auto;
1351 margin-right: auto;
1352 border: none;
1353 background: transparent;
1354 padding: 0;
1355 }
1356 .hero-value-fold-summary {
1357 list-style: none;
1358 cursor: pointer;
1359 padding: 0.85rem 1rem 1.15rem;
1360 display: flex;
1361 flex-direction: column;
1362 align-items: center;
1363 justify-content: center;
1364 }
1365 .hero-value-fold-summary::-webkit-details-marker { display: none; }
1366 .hero-value-fold-summary::marker { content: ""; }
1367 .hero-value-fold-body {
1368 padding: 1rem 0 2rem;
1369 border-top: 1px solid var(--border);
1370 }
1371
1372 footer {
1373 padding: 2.5rem 1.5rem;
1374 text-align: center;
1375 color: var(--text-muted);
1376 font-size: 0.9rem;
1377 border-top: 1px solid var(--border);
1378 }
1379 footer a { color: var(--accent); text-decoration: none; }
1380 footer a:hover { text-decoration: underline; }
1381 footer .footer-community { margin: 0 0 0.9rem; }
1382 footer .footer-discord-link {
1383 display: inline-flex;
1384 align-items: center;
1385 justify-content: center;
1386 gap: 0.45rem;
1387 color: var(--accent);
1388 }
1389 footer .footer-discord-link:hover { text-decoration: underline; }
1390 footer .footer-discord-icon {
1391 width: 1.2em;
1392 height: 1.2em;
1393 flex-shrink: 0;
1394 }
1395 footer .footer-social-icons {
1396 display: flex;
1397 align-items: center;
1398 justify-content: center;
1399 gap: 1rem;
1400 margin: 0 0 0.85rem;
1401 }
1402 footer .footer-social-icons a {
1403 display: inline-flex;
1404 align-items: center;
1405 justify-content: center;
1406 padding: 0.3rem;
1407 color: var(--accent);
1408 text-decoration: none;
1409 border-radius: 10px;
1410 transition: color 0.15s, background 0.15s;
1411 }
1412 footer .footer-social-icons a:hover {
1413 background: var(--surface-elevated);
1414 }
1415 footer .footer-social-icons svg {
1416 width: 1.35rem;
1417 height: 1.35rem;
1418 fill: currentColor;
1419 }
1420 footer .footer-links { margin-top: 0.75rem; display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem 1rem; }
1421 footer .footer-family {
1422 margin: 1.15rem 0 0;
1423 font-size: 0.92rem;
1424 color: var(--text-muted);
1425 }
1426 footer .footer-family-link,
1427 footer .footer-family-link:visited {
1428 display: inline-flex;
1429 align-items: center;
1430 gap: 0.4rem;
1431 color: #ffffff;
1432 font-weight: 700;
1433 text-decoration: none;
1434 vertical-align: middle;
1435 }
1436 footer .footer-family-link:hover { text-decoration: underline; }
1437 html[data-theme="light"] footer .footer-family-link {
1438 color: #0f172a;
1439 }
1440 footer .ourware-mark {
1441 width: 1.35rem;
1442 height: 1.2rem;
1443 flex-shrink: 0;
1444 color: #7dd3fc;
1445 }
1446 html[data-theme="light"] footer .ourware-mark {
1447 color: #0369a1;
1448 }
1449 footer .footer-ourware-social {
1450 display: flex;
1451 align-items: center;
1452 justify-content: center;
1453 gap: 0.85rem;
1454 margin: 0.65rem 0 0;
1455 }
1456 footer .footer-ourware-social a {
1457 display: inline-flex;
1458 align-items: center;
1459 justify-content: center;
1460 padding: 0.25rem;
1461 color: #7dd3fc;
1462 text-decoration: none;
1463 border-radius: 10px;
1464 transition: color 0.15s, background 0.15s;
1465 }
1466 footer .footer-ourware-social a:hover {
1467 background: var(--surface-elevated);
1468 }
1469 html[data-theme="light"] footer .footer-ourware-social a {
1470 color: #0369a1;
1471 }
1472 footer .footer-ourware-social svg {
1473 width: 1.2rem;
1474 height: 1.2rem;
1475 fill: currentColor;
1476 }
1477 </style>
1478 </head>
1479 <body>
1480 <header class="landing-header">
1481 <div class="landing-header-start">
1482 <button type="button" id="theme-toggle" class="theme-toggle" aria-label="Switch to light theme" aria-pressed="true" title="Day / night">
1483 <span class="theme-toggle-icon" aria-hidden="true">🌙</span>
1484 <span class="theme-toggle-label">Night</span>
1485 </button>
1486 <nav class="landing-header-social" aria-label="Social links">
1487 <a href="https://discord.gg/NrtzhZtrED" class="social-icon-link" target="_blank" rel="noopener noreferrer" aria-label="Knowtation on Discord" title="Discord">
1488 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0 12.64 12.64 0 0 0-.617-1.25.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057 19.9 19.9 0 0 0 5.993 3.03.078.078 0 0 0 .084-.028c.462-.63.874-1.295 1.226-1.994a.076.076 0 0 0-.041-.106 13.107 13.107 0 0 1-1.872-.892.077.077 0 0 1-.008-.128 10.2 10.2 0 0 0 .372-.292.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127 12.299 12.299 0 0 1-1.873.892.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028 19.839 19.839 0 0 0 6.002-3.03.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.956-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.955-2.419 2.157-2.419 1.168 0 2.176 1.096 2.157 2.42 0 1.333-.948 2.418-2.157 2.418z"/></svg>
1489 </a>
1490 <a href="https://www.youtube.com/@Knowtation" class="social-icon-link" target="_blank" rel="noopener noreferrer" aria-label="Knowtation on YouTube" title="YouTube">
1491 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z"/></svg>
1492 </a>
1493 <a href="https://x.com/Knowtation1111" class="social-icon-link" target="_blank" rel="noopener noreferrer" aria-label="Knowtation on X (@Knowtation1111)" title="X (Twitter)">
1494 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M18.901 1.153h3.68l-8.04 9.19L24 22.846h-7.406l-5.8-7.584-6.638 7.584H.474l8.6-9.83L0 1.154h7.594l5.243 6.932L18.901 1.153zm-1.292 19.494h2.039L6.486 3.24H4.298l13.311 17.407z"/></svg>
1495 </a>
1496 </nav>
1497 </div>
1498 <a href="#" id="main-signin-google" class="cta cta-signin" data-provider="google">Sign in with Google</a>
1499 <a href="#" id="main-signin-github" class="cta cta-signin" data-provider="github">Sign in with GitHub</a>
1500 </header>
1501
1502 <div class="container">
1503 <header class="hero">
1504 <h1 class="hero-title-main-only">Knowtation</h1>
1505 <p class="hero-brand-sub"><span class="hero-brand-sub-accent">Your notes, become known.</span> One place for you and your agents.</p>
1506 <div class="hero-messages">
1507 <p>Precise retrieval - faster answers - lower token cost</p>
1508 <p>Narrow search first - then discover insights</p>
1509 <p>Memory consolidation - context flexibility</p>
1510 <p>Own your Markdown vault</p>
1511 </div>
1512 <div class="landing-ecosystem" aria-label="Knowtation at the center of your tools">
1513 <div class="landing-ecosystem-rings">
1514 <svg class="landing-ecosystem-svg" viewBox="0 0 320 320" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
1515 <circle cx="160" cy="160" r="90" fill="none" stroke="var(--border)" stroke-width="1"/>
1516 <circle cx="160" cy="160" r="135" fill="none" stroke="var(--border)" stroke-width="1"/>
1517 <circle cx="160" cy="160" r="158" fill="none" stroke="var(--accent)" stroke-width="1" opacity="0.6"/>
1518 </svg>
1519 <div class="landing-ecosystem-center">
1520 <span class="landing-ecosystem-core-icon" aria-hidden="true">📁</span>
1521 <span class="landing-ecosystem-core-label">Your vault</span>
1522 </div>
1523 <div class="landing-ecosystem-icon landing-ecosystem-icon-1" title="Cursor">✏️</div>
1524 <div class="landing-ecosystem-icon landing-ecosystem-icon-2" title="Claude">🤖</div>
1525 <div class="landing-ecosystem-icon landing-ecosystem-icon-3" title="Agents">🦌</div>
1526 <div class="landing-ecosystem-icon landing-ecosystem-icon-4" title="MCP">🔌</div>
1527 <div class="landing-ecosystem-icon landing-ecosystem-icon-5" title="CLI">💻</div>
1528 <div class="landing-ecosystem-icon landing-ecosystem-icon-6" title="Search">🔍</div>
1529 <div class="landing-ecosystem-icon landing-ecosystem-icon-7" title="Import">📥</div>
1530 <div class="landing-ecosystem-icon landing-ecosystem-icon-8" title="Memory">🧠</div>
1531 <div class="landing-ecosystem-icon landing-ecosystem-icon-9" title="GitHub">🐙</div>
1532 <div class="landing-ecosystem-icon landing-ecosystem-icon-10" title="Hub">🌐</div>
1533 <div class="landing-ecosystem-icon landing-ecosystem-icon-11" title="Tags">🏷️</div>
1534 <div class="landing-ecosystem-icon landing-ecosystem-icon-12" title="Time">⏱️</div>
1535 <div class="landing-ecosystem-icon landing-ecosystem-icon-13" title="Chains">🔗</div>
1536 <div class="landing-ecosystem-icon landing-ecosystem-icon-14" title="Proposals">📋</div>
1537 <div class="landing-ecosystem-icon landing-ecosystem-icon-15" title="ICP">⬡</div>
1538 <div class="landing-ecosystem-icon landing-ecosystem-icon-16" title="Media">🎬</div>
1539 <div class="landing-ecosystem-icon landing-ecosystem-icon-17" title="Transcribe">🎙️</div>
1540 <div class="landing-ecosystem-icon landing-ecosystem-icon-18" title="Sync">🔄</div>
1541 <div class="landing-ecosystem-icon landing-ecosystem-icon-19" title="Notes">📝</div>
1542 <div class="landing-ecosystem-icon landing-ecosystem-icon-20" title="Export">📤</div>
1543 </div>
1544 </div>
1545 <details class="hero-value-fold" id="structured-memory-hero-fold">
1546 <summary class="hero-value-fold-summary">
1547 <span class="hero-value-fold-summary-row">
1548 <span class="flow-intro-title structured-memory-heading hero-value-fold-heading-text">Structured memory for humans and agents</span>
1549 <span class="hero-value-fold-chevron" aria-hidden="true">▾</span>
1550 </span>
1551 <span class="hero-value-fold-triangle" aria-hidden="true">
1552 <span></span>
1553 <span></span>
1554 <span></span>
1555 </span>
1556 </summary>
1557 <div class="hero-value-fold-body value-pitch-inner">
1558 <p class="value-pitch-lead">
1559 Your <strong>owned</strong>, <strong>indexed</strong> notes—optional <strong>time</strong>, <strong>chains</strong>, <strong>episodes</strong>, and <strong>entities</strong>—plus a deep <strong>MCP</strong> surface for assistants that support it.
1560 </p>
1561 <ul class="value-pitch-root-list">
1562 <li>Root Solution</li>
1563 <li>Semantic search</li>
1564 <li>Agent proposals with human review</li>
1565 <li>Team roles</li>
1566 <li>Scoped vaults</li>
1567 <li>Memory consolidation</li>
1568 <li>Causal-temporal structure</li>
1569 <li>More than a trim pass on chat or terminal logs.</li>
1570 </ul>
1571 <div class="value-pitch-grid">
1572 <div class="value-blurb">
1573 <h3>Depth you can use</h3>
1574 <ul>
1575 <li>Causal chains, episodes, entities, snapshots, and summary notes when you add frontmatter.</li>
1576 <li>Agent tools such as semantic neighbors, wikilinks, tasks, clustering, and tag suggestions.</li>
1577 <li>Hosted prompts and memory flows for long-running work (see docs for full lists).</li>
1578 <li><strong>Imports, capture, transcribe</strong> — one indexed vault for humans and agents.</li>
1579 </ul>
1580 <details class="landing-details">
1581 <summary>Technical pointers</summary>
1582 <div class="landing-details-body">
1583 Start with <a href="https://github.com/aaronrene/knowtation/blob/main/docs/INTENTION-AND-TEMPORAL.md" target="_blank" rel="noopener">Intention and temporal</a>,
1584 <a href="https://github.com/aaronrene/knowtation/blob/main/docs/PARITY-MATRIX-HOSTED.md" target="_blank" rel="noopener">Hosted parity matrix</a>, and
1585 <a href="https://github.com/aaronrene/knowtation/blob/main/docs/PARITY-MATRIX-HOSTED.md" target="_blank" rel="noopener">Hosted MCP parity matrix</a>.
1586 </div>
1587 </details>
1588 </div>
1589 <div class="value-blurb">
1590 <h3>Agents suggest. Humans approve.</h3>
1591 <ul>
1592 <li><strong>Proposals</strong> stay out of the canonical vault until reviewers pass rubrics and admins apply changes.</li>
1593 <li>Built for teams that need <strong>audit trails</strong>, <strong>roles</strong>, and optional <strong>LLM review hints</strong>—not silent AI overwrites.</li>
1594 <li>Same AI speed with a <strong>human gate</strong>, optional <strong>rubrics</strong>, and a durable <strong>paper trail</strong> from propose → evaluate → approve.</li>
1595 <li><strong>Scoped roles</strong> — viewer, editor, evaluator, admin — so each person only touches what their job allows.</li>
1596 </ul>
1597 <details class="landing-details">
1598 <summary>How proposals work (API)</summary>
1599 <div class="landing-details-body">
1600 Agents and editors create rows via <code>POST /api/v1/proposals</code>; humans evaluate; approve writes the vault.
1601 See <a href="https://github.com/aaronrene/knowtation/blob/main/docs/PROPOSAL-LIFECYCLE.md" target="_blank" rel="noopener">Proposal lifecycle</a> and
1602 <a href="https://github.com/aaronrene/knowtation/blob/main/docs/AGENT-INTEGRATION.md" target="_blank" rel="noopener">Agent integration §4</a>.
1603 </div>
1604 </details>
1605 </div>
1606 </div>
1607 <p class="value-pill-caption" id="value-pill-caption-hero">Glossary chips — concepts you can combine</p>
1608 <ul class="value-pill-row" role="list" aria-labelledby="value-pill-caption-hero">
1609 <li role="listitem">Semantic search</li>
1610 <li role="listitem">Keyword search</li>
1611 <li role="listitem">Causal chain</li>
1612 <li role="listitem">Episode</li>
1613 <li role="listitem">Entity</li>
1614 <li role="listitem">Snapshot</li>
1615 <li role="listitem">Summarizes</li>
1616 <li role="listitem">Consolidate</li>
1617 <li role="listitem">Discover</li>
1618 <li role="listitem">Evaluate</li>
1619 <li role="listitem">Propose</li>
1620 <li role="listitem">Approve</li>
1621 <li role="listitem">MCP prompt</li>
1622 <li role="listitem">Wikilink</li>
1623 <li role="listitem">Memory event</li>
1624 <li role="listitem">Temporal summary</li>
1625 <li role="listitem">Resume session</li>
1626 <li role="listitem">Knowledge gap</li>
1627 <li role="listitem">Capture</li>
1628 <li role="listitem">Import</li>
1629 <li role="listitem">Rubric</li>
1630 <li role="listitem">Scoped access</li>
1631 <li role="listitem">Multi-vault</li>
1632 <li role="listitem">Transcribe</li>
1633 <li role="listitem">Attestation</li>
1634 <li role="listitem">Indexed vault</li>
1635 <li role="listitem">Relate</li>
1636 <li role="listitem">Cluster</li>
1637 <li role="listitem">Tag suggest</li>
1638 <li role="listitem">Enrich</li>
1639 <li role="listitem">Extract tasks</li>
1640 </ul>
1641 </div>
1642 </details>
1643 <div class="cta-row">
1644 <a href="/hub/" class="cta cta-secondary">Hosted Hub (Beta)</a>
1645 <a href="https://github.com/aaronrene/knowtation/blob/main/docs/TWO-PATHS-HOSTED-AND-SELF-HOSTED.md#quick-start-self-hosted" class="cta cta-secondary" target="_blank" rel="noopener">Self-host quick start</a>
1646 </div>
1647 </header>
1648 </div>
1649
1650 <div class="badge-wrap">
1651 <a href="https://github.com/aaronrene/knowtation" class="badge" target="_blank" rel="noopener">Open source on GitHub</a>
1652 </div>
1653
1654 <section class="band-b-path wide" aria-label="Three steps: note or import, add agents, ask your AI">
1655 <div class="band-b-path-inner">
1656 <ul class="band-b-steps" role="list">
1657 <li class="band-b-step">
1658 <div class="band-b-step-head">
1659 <span class="band-b-step-marker">1</span>
1660 <h3 class="band-b-step-title">Note / import</h3>
1661 </div>
1662 <p>Capture or import into your indexed vault. Keep work out of chat-only threads. Export and own your history</p>
1663 <div class="band-b-step-links">
1664 <a href="/hub/" class="band-b-step-link">Hosted Hub (Beta)</a>
1665 <a href="https://github.com/aaronrene/knowtation/blob/main/docs/TWO-PATHS-HOSTED-AND-SELF-HOSTED.md#quick-start-self-hosted" class="band-b-step-link band-b-step-link--secondary" target="_blank" rel="noopener">Self-host quick start</a>
1666 </div>
1667 </li>
1668 <li class="band-b-step">
1669 <div class="band-b-step-head">
1670 <span class="band-b-step-marker">2</span>
1671 <h3 class="band-b-step-title">Add agents (desktop MCP)</h3>
1672 </div>
1673 <p>Desktop: MCP OAuth Sign-in in Cursor/Claude to <code>mcp.knowtation.store</code>. Cloud agents (Hermes/Hostinger): Hub <strong>Connect cloud agent</strong> or the documented mcp-remote interim — not a pasted Hub session JWT.</p>
1674 <div class="band-b-step-links">
1675 <a href="https://github.com/aaronrene/knowtation/blob/main/docs/AGENT-INTEGRATION.md" class="band-b-step-link" target="_blank" rel="noopener">Agent integration (MCP &amp; CLI)</a>
1676 </div>
1677 </li>
1678 <li class="band-b-step">
1679 <div class="band-b-step-head">
1680 <span class="band-b-step-marker">3</span>
1681 <h3 class="band-b-step-title">Ask your AI</h3>
1682 </div>
1683 <p>Paste phased prompts for install, index, and checks. Your assistant walks the steps you pick. Customize your specs and schema creatively using our many tags, tools, and prompts.</p>
1684 <div class="band-b-step-links">
1685 <a href="https://github.com/aaronrene/knowtation/blob/main/docs/AI-ASSISTED-SETUP.md" class="band-b-step-link" target="_blank" rel="noopener">AI-assisted setup (prompts)</a>
1686 </div>
1687 </li>
1688 </ul>
1689 </div>
1690 </section>
1691
1692 <div class="deploy-headlines wide">
1693 <p class="deploy-title">Run locally or get online access with our hosted service on decentralized Internet Computer canisters.</p>
1694 </div>
1695
1696 <section class="landing-overview-video wide" aria-label="Knowtation overview video">
1697 <!-- If the iframe shows "Video unavailable" but youtube.com/watch?v=… works: YouTube Studio → Content → this video → Details → Allow embedding must be ON. -->
1698 <div class="landing-video-frame">
1699 <iframe
1700 src="https://www.youtube.com/embed/LPHBkyZmvVo?rel=0&amp;modestbranding=1&amp;playsinline=1"
1701 title="KNOWTATION Overview (embedded)"
1702 allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
1703 allowfullscreen
1704 loading="lazy"
1705 ></iframe>
1706 </div>
1707 <div class="landing-channel-strip">
1708 <p class="landing-channel-strip-title">Channel</p>
1709 <div class="landing-channel-scroll" role="list">
1710 <!-- Add another <a class="landing-channel-card" role="listitem"> when you publish more videos (copy thumbnail URL pattern below). -->
1711 <a class="landing-channel-card" role="listitem" href="https://www.youtube.com/watch?v=LPHBkyZmvVo&amp;list=UUW-qQC8z_QcBz5QfDi2zapw" target="_blank" rel="noopener noreferrer">
1712 <img src="https://i.ytimg.com/vi/LPHBkyZmvVo/mqdefault.jpg" width="320" height="180" alt="Thumbnail: KNOWTATION Overview on YouTube" decoding="async" />
1713 <span>KNOWTATION Overview</span>
1714 </a>
1715 <a class="landing-channel-card landing-channel-card--subscribe landing-channel-card--text" role="listitem" href="https://www.youtube.com/@Knowtation/videos" target="_blank" rel="noopener noreferrer">
1716 <span>Open the channel on YouTube — subscribe for new uploads</span>
1717 </a>
1718 </div>
1719 </div>
1720 </section>
1721
1722 <header class="spotlight-intro wide">
1723 <h2 class="spotlight-intro-title">Know thyself... and your agents</h2>
1724 <p class="spotlight-intro-subtitle">Proposals, Evaluations, and Scoped Access =<br />Security, Savings, and Ownership and Control</p>
1725 </header>
1726
1727 <section class="spotlight-pair wide" aria-label="Trust and memory">
1728 <article class="spotlight-card">
1729 <div class="spotlight-card-icon" aria-hidden="true">🔏</div>
1730 <h2>Attestation for serious teams</h2>
1731 <p>Legal, compliance, finance, and operations increasingly need proof of <strong>who approved a change</strong> and <strong>that the record was not silently altered</strong>. Knowtation pairs human-in-the-loop proposals with <strong>HMAC-signed attestation</strong> and optional <strong>Internet Computer blockchain anchoring</strong> — an audit trail you can point to, not just another row in a vendor database. <a href="https://github.com/aaronrene/knowtation/blob/main/docs/WHITEPAPER.md" target="_blank" rel="noopener">Whitepaper: attestation and ICP</a></p>
1732 </article>
1733 <article class="spotlight-card">
1734 <div class="spotlight-card-icon" aria-hidden="true">🧠</div>
1735 <h2>Notes that become truly known</h2>
1736 <p>Your vault is searchable; <strong>memory</strong> keeps what agents and you did over time. <strong>Consolidation</strong> folds noisy events into compact facts so future context stays small. Optional <strong>Discover</strong> traces <strong>cross-topic insights</strong> — new paths between ideas — so yesterday’s notes actively inform tomorrow’s decisions instead of sitting in a forgotten folder. That is what “become known” means: interconnected, growing context, not a one-off chat dump.</p>
1737 </article>
1738 </section>
1739
1740 <section class="feature-highlights wide" aria-labelledby="feature-highlights-heading">
1741 <h2 id="feature-highlights-heading">What teams care about</h2>
1742 <p class="feature-highlights-lead">Solutions for the worries we hear most: cost, lock-in, trust, and “can my agents actually use this?”</p>
1743 <div class="feature-highlights-grid">
1744 <div class="feature-highlight-card">
1745 <div class="fh-icon" aria-hidden="true">💸</div>
1746 <h3>Lower token spend</h3>
1747 <p>Narrow search - only notes you need. Memory consolidation continuously keeps future context smaller.</p>
1748 </div>
1749 <div class="feature-highlight-card">
1750 <div class="fh-icon" aria-hidden="true">📁</div>
1751 <h3>Files you own</h3>
1752 <p>Markdown in your vault — Git, editors, backups. No “export my life’s work” crisis when you switch tools.</p>
1753 </div>
1754 <div class="feature-highlight-card">
1755 <div class="fh-icon" aria-hidden="true">🔏</div>
1756 <h3>Audit-ready trust</h3>
1757 <p>Attestation plus optional IC anchoring for provable intent. Pair with proposals - no unchecked agents</p>
1758 </div>
1759 <div class="feature-highlight-card">
1760 <div class="fh-icon" aria-hidden="true">🤖</div>
1761 <h3>Agents that go deep</h3>
1762 <p>33 MCP tools, memory, consolidation, and the same CLI you use — not a thin search wrapper.</p>
1763 </div>
1764 <div class="feature-highlight-card">
1765 <div class="fh-icon" aria-hidden="true">📥</div>
1766 <h3>Everything in one vault</h3>
1767 <p>Imports, capture, digital wallet CSVs, Supabase bridge — one searchable corpus for humans and agents.</p>
1768 </div>
1769 <div class="feature-highlight-card">
1770 <div class="fh-icon" aria-hidden="true">🌐</div>
1771 <h3>Hosted or self-hosted</h3>
1772 <p>Same product: decentralized canisters when you want zero ops, or full control on your metal.</p>
1773 </div>
1774 <div class="feature-highlight-card">
1775 <div class="fh-icon" aria-hidden="true">⬡</div>
1776 <h3>Decentralized online portal</h3>
1777 <p>A Hosted Hub where you own the data: back up to GitHub anytime for portability.</p>
1778 </div>
1779 <div class="feature-highlight-card">
1780 <div class="fh-icon" aria-hidden="true">👥</div>
1781 <h3>Teams online, fast</h3>
1782 <p>Invite viewers, editors, and admins with scoped access in minutes.<br>No per-seat pricing</p>
1783 </div>
1784 </div>
1785 </section>
1786
1787 <section class="ecosystem-vision-section wide" aria-labelledby="ecosystem-vision-heading">
1788 <div class="ecosystem-vision-heading-wrap">
1789 <h2 id="ecosystem-vision-heading" class="flow-intro-title">Ecosystem visions</h2>
1790 </div>
1791 <p class="ecosystem-vision-lead">Knowtation is part of <a class="ourware-link" href="https://ourware.org" target="_blank" rel="noopener noreferrer">Ourware</a>, the organization that supports community operating systems. Knowtation is the <strong>brain</strong> — files, search, memory, and review. Together with <strong>your custom workflow</strong>, you get one direction: humans and agents propose, humans curate, and history stays inspectable across life, work, and research.</p>
1792 <div class="ecosystem-vision-card">
1793 <h3 class="ecosystem-architecture-title">Future Facing Architecture</h3>
1794 <div class="ecosystem-flow-row ecosystem-flow-row--in-card" aria-hidden="true">
1795 <div class="ecosystem-flow-node">Knowtation<span>Brain · vault · memory</span></div>
1796 <span class="ecosystem-flow-arrow">↔</span>
1797 <div class="ecosystem-flow-node">Muse / MuseHub<span>Hands · VCS · review</span></div>
1798 <span class="ecosystem-flow-arrow">↔</span>
1799 <div class="ecosystem-flow-node">scool.ing<span>Lifelong learning</span></div>
1800 <span class="ecosystem-flow-arrow">↔</span>
1801 <div class="ecosystem-flow-node">Your Vision<span>Propel Projects</span></div>
1802 </div>
1803 <p>Use Knowtation any way you can imagine. Our vision was built around connecting open-source projects that share patterns: tiered retrieval, proposals before commit, and JSON-friendly automation. The use cases are infinite in business, research, legal, creative, personal life and more. We are curious to see how bridges may evolve.</p>
1804 <p>Connect with our fellow community projects and partners to create an incredible future with supercharged tools. Adjust at will to fit your needs.</p>
1805 <details class="flow-details">
1806 <summary>Technical details and links</summary>
1807 <div class="detail-inner">
1808 <p><strong>Stack roles (from <a href="https://github.com/aaronrene/knowtation/blob/main/docs/ECOSYSTEM-VISION.md" target="_blank" rel="noopener">ECOSYSTEM-VISION.md</a>):</strong></p>
1809 <ul>
1810 <li><strong>Ourware</strong> — Organization that supports this family of community operating systems — <a href="https://ourware.org" target="_blank" rel="noopener noreferrer">ourware.org</a></li>
1811 <li><strong>Knowtation</strong> — Vaults, semantic search, Hub, MCP/CLI (<a href="https://github.com/aaronrene/knowtation/blob/main/docs/WHITEPAPER.md" target="_blank" rel="noopener">WHITEPAPER.md</a>)</li>
1812 <li><strong>Muse / MuseHub</strong> — Domain-agnostic VCS, MuseHub collaboration — <a href="https://github.com/cgcardona/muse" target="_blank" rel="noopener">github.com/cgcardona/muse</a>, <a href="https://staging.musehub.ai/explore" target="_blank" rel="noopener">MuseHub (staging)</a></li>
1813 <li><strong>scool.ing</strong> — Control panel for private lifelong learning — <a href="https://scool.ing" target="_blank" rel="noopener noreferrer">scool.ing</a></li>
1814 <li><strong>theBRAIN</strong> — Spaces and presence: a private AI you can hold, with consent — <a href="https://the-brain.space" target="_blank" rel="noopener noreferrer">the-brain.space</a></li>
1815 <li><strong>Overseer Kit</strong> — Freeze the plan, review independently, verify the build — <a href="https://github.com/aaronrene/overseer-kit" target="_blank" rel="noopener noreferrer">github.com/aaronrene/overseer-kit</a></li>
1816 </ul>
1817 <p><strong>Knowtation integration:</strong> <a href="https://github.com/aaronrene/knowtation/blob/main/docs/AGENT-INTEGRATION.md" target="_blank" rel="noopener">Agent integration</a> — CLI, MCP, Hub API, proposals, optional external lineage, and hosted MCP in one guide. Multi-agent patterns: <a href="https://github.com/aaronrene/knowtation/blob/main/docs/AGENT-ORCHESTRATION.md" target="_blank" rel="noopener">AGENT-ORCHESTRATION.md</a>.</p>
1818 <p class="ecosystem-doc-link-hint">Full narrative, use cases, triple loop, and phasing: <a href="https://github.com/aaronrene/knowtation/blob/main/docs/ECOSYSTEM-VISION.md" target="_blank" rel="noopener">docs/ECOSYSTEM-VISION.md</a></p>
1819 </div>
1820 </details>
1821 </div>
1822 </section>
1823
1824 <section class="family-presence-band" aria-labelledby="family-presence-heading">
1825 <div class="family-presence-inner">
1826 <div class="brain-grow-show" data-brain-grow-show>
1827 <p class="brain-grow-show__kicker">Many Ways to Grow</p>
1828 <div class="brain-grow-show__stack" aria-live="polite" aria-atomic="true">
1829 <div class="brain-grow-show__slide is-active">
1830 <img src="/assets/thebrain-show/models-lineup-sensors.webp" width="1536" height="1024" alt="Four theBRAIN models in a ladder lineup with side sensors and docks">
1831 </div>
1832 <div class="brain-grow-show__slide">
1833 <img src="/assets/thebrain-show/tech-exploded-dual-cam.webp" width="1536" height="1024" alt="Exploded view of theBRAIN internals with dual cameras and round mic array">
1834 </div>
1835 <div class="brain-grow-show__slide">
1836 <img src="/assets/thebrain-show/privacy-local-desk.webp" width="1536" height="1024" alt="Person working at a desk with a personal theBRAIN unit nearby">
1837 </div>
1838 <div class="brain-grow-show__slide">
1839 <img src="/assets/thebrain-show/models-movable-vision-coverage.webp" width="1600" height="900" alt="theBRAIN vision coverage plate showing movable camera dock positions">
1840 </div>
1841 <div class="brain-grow-show__slide">
1842 <img src="/assets/thebrain-show/tech-sensor-addons.webp" width="1536" height="1024" alt="theBRAIN with optional climate, GPS, and slim vision sensor add-ons">
1843 </div>
1844 <div class="brain-grow-show__slide">
1845 <img src="/assets/thebrain-show/privacy-team-posture.webp" width="1536" height="1024" alt="Team collaborating near a shared theBRAIN unit with visible consent posture">
1846 </div>
1847 <div class="brain-grow-show__slide">
1848 <img src="/assets/thebrain-show/tech-exploded-internals.webp" width="1536" height="1024" alt="Exploded internals of theBRAIN showing Raspberry Pi stack and UPS">
1849 </div>
1850 <div class="brain-grow-show__slide">
1851 <img src="/assets/thebrain-show/usecase-adult-second-brain.webp" width="1536" height="1024" alt="Adult using a theBRAIN unit as a personal second brain at home">
1852 </div>
1853 <div class="brain-grow-show__slide">
1854 <img src="/assets/thebrain-show/models-brain-pro-max-omni.webp" width="1536" height="1024" alt="BRAIN PRO MAX OMNI product shells showing the shared form factor">
1855 </div>
1856 <div class="brain-grow-show__slide">
1857 <img src="/assets/thebrain-show/privacy-shared-room.webp" width="1536" height="1024" alt="People in a shared room with a theBRAIN unit as group presence">
1858 </div>
1859 </div>
1860 <p class="brain-grow-show__caption"><strong>BRAIN → PRO → MAX → OMNI</strong></p>
1861 <div class="brain-grow-show__dots" role="tablist" aria-label="theBRAIN Many Ways to Grow slides">
1862 <button type="button" class="brain-grow-show__dot" aria-label="BRAIN → PRO → MAX → OMNI" aria-current="true"></button>
1863 <button type="button" class="brain-grow-show__dot" aria-label="Dual cameras &amp; mic array"></button>
1864 <button type="button" class="brain-grow-show__dot" aria-label="Private at the desk"></button>
1865 <button type="button" class="brain-grow-show__dot" aria-label="Movable vision docks"></button>
1866 <button type="button" class="brain-grow-show__dot" aria-label="Sensors &amp; side docks"></button>
1867 <button type="button" class="brain-grow-show__dot" aria-label="Team in the room"></button>
1868 <button type="button" class="brain-grow-show__dot" aria-label="Pi 5 stack inside"></button>
1869 <button type="button" class="brain-grow-show__dot" aria-label="Everyday companion"></button>
1870 <button type="button" class="brain-grow-show__dot" aria-label="One shell, four tiers"></button>
1871 <button type="button" class="brain-grow-show__dot" aria-label="Shared space intelligence"></button>
1872 </div>
1873 </div>
1874 <div class="family-presence-copy">
1875 <h2 id="family-presence-heading">Control panel, presence, and the Ourware family</h2>
1876 <p>
1877 <a href="https://scool.ing" target="_blank" rel="noopener noreferrer">scool.ing</a>
1878 is the control panel — a private lifelong-learning home for school, work, research, and teams. Calendar, tasks, and Flows live there. Agent help runs only with consent.
1879 </p>
1880 <p>
1881 <a href="https://the-brain.space" target="_blank" rel="noopener noreferrer">theBRAIN</a>
1882 brings spaces and presence into the system: a private AI you can hold in the room. It speaks, shows when it is thinking, runs on the device, and works in personal and shared spaces with consent.
1883 </p>
1884 <p>
1885 Knowtation keeps the vault. MuseHub keeps history.
1886 <a class="ourware-link" href="https://ourware.org" target="_blank" rel="noopener noreferrer">Ourware</a>
1887 is the organization that supports this family of community operating systems.
1888 </p>
1889 </div>
1890 </div>
1891 </section>
1892
1893 <section class="value-pitch wide" id="structured-memory-main" aria-labelledby="value-pitch-title">
1894 <div class="value-pitch-inner">
1895 <div class="ecosystem-vision-heading-wrap">
1896 <h2 id="value-pitch-title" class="flow-intro-title structured-memory-heading">Structured memory for humans and agents</h2>
1897 </div>
1898 <p class="value-pitch-lead">
1899 Your <strong>owned</strong>, <strong>indexed</strong> notes—optional <strong>time</strong>, <strong>chains</strong>, <strong>episodes</strong>, and <strong>entities</strong>—plus a deep <strong>MCP</strong> surface for assistants that support it.
1900 </p>
1901 <ul class="value-pitch-root-list">
1902 <li>Root Solution</li>
1903 <li>Semantic search</li>
1904 <li>Agent proposals with human review</li>
1905 <li>Team roles</li>
1906 <li>Scoped vaults</li>
1907 <li>Memory consolidation</li>
1908 <li>Causal-temporal structure</li>
1909 <li>More than a trim pass on chat or terminal logs.</li>
1910 </ul>
1911 <div class="value-pitch-grid">
1912 <div class="value-blurb">
1913 <h3>Depth you can use</h3>
1914 <ul>
1915 <li>Causal chains, episodes, entities, snapshots, and summary notes when you add frontmatter.</li>
1916 <li>Agent tools such as semantic neighbors, wikilinks, tasks, clustering, and tag suggestions.</li>
1917 <li>Hosted prompts and memory flows for long-running work (see docs for full lists).</li>
1918 <li><strong>Imports, capture, transcribe</strong> — one indexed vault for humans and agents.</li>
1919 </ul>
1920 <details class="landing-details">
1921 <summary>Technical pointers</summary>
1922 <div class="landing-details-body">
1923 Start with <a href="https://github.com/aaronrene/knowtation/blob/main/docs/INTENTION-AND-TEMPORAL.md" target="_blank" rel="noopener">Intention and temporal</a>,
1924 <a href="https://github.com/aaronrene/knowtation/blob/main/docs/PARITY-MATRIX-HOSTED.md" target="_blank" rel="noopener">Hosted parity matrix</a>, and
1925 <a href="https://github.com/aaronrene/knowtation/blob/main/docs/PARITY-MATRIX-HOSTED.md" target="_blank" rel="noopener">Hosted MCP parity matrix</a>.
1926 </div>
1927 </details>
1928 </div>
1929 <div class="value-blurb">
1930 <h3>Agents suggest. Humans approve.</h3>
1931 <ul>
1932 <li><strong>Proposals</strong> stay out of the canonical vault until reviewers pass rubrics and admins apply changes.</li>
1933 <li>Built for teams that need <strong>audit trails</strong>, <strong>roles</strong>, and optional <strong>LLM review hints</strong>—not silent AI overwrites.</li>
1934 <li>Same AI speed with a <strong>human gate</strong>, optional <strong>rubrics</strong>, and a durable <strong>paper trail</strong> from propose → evaluate → approve.</li>
1935 <li><strong>Scoped roles</strong> — viewer, editor, evaluator, admin — so each person only touches what their job allows.</li>
1936 </ul>
1937 <details class="landing-details">
1938 <summary>How proposals work (API)</summary>
1939 <div class="landing-details-body">
1940 Agents and editors create rows via <code>POST /api/v1/proposals</code>; humans evaluate; approve writes the vault.
1941 See <a href="https://github.com/aaronrene/knowtation/blob/main/docs/PROPOSAL-LIFECYCLE.md" target="_blank" rel="noopener">Proposal lifecycle</a> and
1942 <a href="https://github.com/aaronrene/knowtation/blob/main/docs/AGENT-INTEGRATION.md" target="_blank" rel="noopener">Agent integration §4</a>.
1943 </div>
1944 </details>
1945 </div>
1946 </div>
1947 <p class="value-pill-caption" id="value-pill-caption-main">Glossary chips — concepts you can combine</p>
1948 <ul class="value-pill-row" role="list" aria-labelledby="value-pill-caption-main">
1949 <li role="listitem">Semantic search</li>
1950 <li role="listitem">Keyword search</li>
1951 <li role="listitem">Causal chain</li>
1952 <li role="listitem">Episode</li>
1953 <li role="listitem">Entity</li>
1954 <li role="listitem">Snapshot</li>
1955 <li role="listitem">Summarizes</li>
1956 <li role="listitem">Consolidate</li>
1957 <li role="listitem">Discover</li>
1958 <li role="listitem">Evaluate</li>
1959 <li role="listitem">Propose</li>
1960 <li role="listitem">Approve</li>
1961 <li role="listitem">MCP prompt</li>
1962 <li role="listitem">Wikilink</li>
1963 <li role="listitem">Memory event</li>
1964 <li role="listitem">Temporal summary</li>
1965 <li role="listitem">Resume session</li>
1966 <li role="listitem">Knowledge gap</li>
1967 <li role="listitem">Capture</li>
1968 <li role="listitem">Import</li>
1969 <li role="listitem">Rubric</li>
1970 <li role="listitem">Scoped access</li>
1971 <li role="listitem">Multi-vault</li>
1972 <li role="listitem">Transcribe</li>
1973 <li role="listitem">Attestation</li>
1974 <li role="listitem">Indexed vault</li>
1975 <li role="listitem">Relate</li>
1976 <li role="listitem">Cluster</li>
1977 <li role="listitem">Tag suggest</li>
1978 <li role="listitem">Enrich</li>
1979 <li role="listitem">Extract tasks</li>
1980 </ul>
1981 </div>
1982 </section>
1983
1984 <div class="flow-intro-block flow-intro-block--after-ecosystem">
1985 <p class="flow-intro-title">Control, customize and own your data, agents, memory, and backup.</p>
1986 <p class="flow-intro-sub flow-intro-sub--accent">Discover new paths with cross-topic insights</p>
1987 </div>
1988
1989 <section class="flow-track wide" aria-label="How Knowtation works">
1990 <article class="flow-step">
1991 <div class="flow-visual">
1992 <p class="flow-step-num">Step 1</p>
1993 <span class="flow-icon" aria-hidden="true">🔐</span>
1994 <p class="flow-visual-caption">Sign in, invite teammates, pick who sees what.</p>
1995 </div>
1996 <div class="flow-body">
1997 <h2>Sign in and set scope</h2>
1998 <p>Use Google or GitHub to open the hosted Hub. Add people with viewer, editor, or admin roles. Multi-vault setups let each team or project keep its own boundary while you stay in one account. <strong>Teams are included at no additional cost.</strong></p>
1999 <details class="flow-details">
2000 <summary>Technical details</summary>
2001 <div class="detail-inner">
2002 <p>Hosted auth flows through the gateway; JWTs carry user id and role for API and Hub UI. Self-hosted Hub uses the same role model with <code>data/hub_roles.json</code> and optional invites.</p>
2003 <ul>
2004 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/TEAMS-AND-COLLABORATION.md" target="_blank" rel="noopener">Teams and collaboration</a></li>
2005 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/TWO-PATHS-HOSTED-AND-SELF-HOSTED.md" target="_blank" rel="noopener">Hosted vs self-hosted paths</a></li>
2006 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/HUB-API.md" target="_blank" rel="noopener">Hub API and JWT</a></li>
2007 </ul>
2008 </div>
2009 </details>
2010 </div>
2011 </article>
2012
2013 <article class="flow-step">
2014 <div class="flow-visual">
2015 <p class="flow-step-num">Step 2</p>
2016 <span class="flow-icon" aria-hidden="true">📥</span>
2017 <p class="flow-visual-caption">Stream messages to your inbox and pull exports into one vault.</p>
2018 <p class="flow-import-icons" aria-label="Live capture channels">
2019 <span class="flow-import-icon">💬 Slack</span>
2020 <span class="flow-import-icon">🎮 Discord</span>
2021 <span class="flow-import-icon">✈️ Telegram</span>
2022 <span class="flow-import-icon">📱 WhatsApp</span>
2023 </p>
2024 <p class="flow-import-icons" aria-label="Supported import sources">
2025 <span class="flow-import-icon">🤖 ChatGPT</span>
2026 <span class="flow-import-icon">🧠 Claude</span>
2027 <span class="flow-import-icon">💾 Mem0</span>
2028 <span class="flow-import-icon">📝 Notion</span>
2029 <span class="flow-import-icon">🎫 Jira</span>
2030 <span class="flow-import-icon">📓 NotebookLM</span>
2031 <span class="flow-import-icon">📁 Google Drive</span>
2032 <span class="flow-import-icon">📋 Linear</span>
2033 <span class="flow-import-icon">🔗 MIF</span>
2034 <span class="flow-import-icon">📄 Markdown</span>
2035 <span class="flow-import-icon">🎙️ Audio</span>
2036 <span class="flow-import-icon">💰 Wallet CSV</span>
2037 <span class="flow-import-icon">🗄️ Supabase</span>
2038 <span class="flow-import-icon">🦞 OpenClaw</span>
2039 </p>
2040 </div>
2041 <div class="flow-body">
2042 <h2>Capture and import</h2>
2043 <p><strong>Capture</strong> sends Slack, Discord, Telegram, or WhatsApp (via automation) straight to your inbox through the Hub. <strong>Import</strong> brings batch exports—chats, docs, tickets, audio, wallet CSVs—into the same Markdown vault. Webhooks and adapters write inbox notes automatically; you keep the files.</p>
2044 <details class="flow-details">
2045 <summary>Technical details</summary>
2046 <div class="detail-inner">
2047 <p class="flow-detail-heading">Capture (messages → inbox)</p>
2048 <p>Hub endpoint: <code>POST /api/v1/capture</code> with JSON. Optional: set <code>CAPTURE_WEBHOOK_SECRET</code> in Hub env and send header <code>X-Webhook-Secret</code>.</p>
2049 <div class="flow-import-grid">
2050 <span class="flow-import-tile">💬 <strong>Slack</strong><br><small>Adapter port 3132; <code>SLACK_SIGNING_SECRET</code></small></span>
2051 <span class="flow-import-tile">🎮 <strong>Discord</strong><br><small>Adapter port 3133; webhook or bot</small></span>
2052 <span class="flow-import-tile">✈️ <strong>Telegram</strong><br><small>Adapter port 3134; bot → capture</small></span>
2053 <span class="flow-import-tile">📱 <strong>WhatsApp</strong><br><small>Zapier / n8n → POST capture</small></span>
2054 </div>
2055 <p>Run a capture adapter (<code>scripts/capture-slack-adapter.mjs</code>, <code>capture-discord-adapter.mjs</code>, <code>capture-telegram-adapter.mjs</code>) or any automation that maps events to the capture format. Example body: <code>{"body":"text","source":"slack"}</code>. Full contract: <a href="https://github.com/aaronrene/knowtation/blob/main/docs/CAPTURE-CONTRACT.md" target="_blank" rel="noopener">Capture contract</a>; platform wiring: <a href="https://github.com/aaronrene/knowtation/blob/main/docs/MESSAGING-INTEGRATION.md" target="_blank" rel="noopener">Messaging integration</a>.</p>
2056 <p class="flow-detail-heading">Batch import (exports and files)</p>
2057 <p>Importers normalize to vault notes with <code>source</code>, <code>source_id</code>, and <code>date</code> for idempotent re-runs. Supabase memory tables can be imported for users coming from database-centric stacks.</p>
2058 <div class="flow-import-grid">
2059 <span class="flow-import-tile">🤖 <strong>ChatGPT</strong><br><small>ZIP or folder export</small></span>
2060 <span class="flow-import-tile">🧠 <strong>Claude</strong><br><small>Chat + memory export</small></span>
2061 <span class="flow-import-tile">💾 <strong>Mem0</strong><br><small>JSON memory export</small></span>
2062 <span class="flow-import-tile">📝 <strong>Notion</strong><br><small>API; page IDs + key</small></span>
2063 <span class="flow-import-tile">🎫 <strong>Jira</strong><br><small>CSV export</small></span>
2064 <span class="flow-import-tile">📓 <strong>NotebookLM</strong><br><small>Markdown or JSON</small></span>
2065 <span class="flow-import-tile">📁 <strong>Google Drive</strong><br><small>Markdown folder</small></span>
2066 <span class="flow-import-tile">📋 <strong>Linear</strong><br><small>CSV export</small></span>
2067 <span class="flow-import-tile">🔗 <strong>MIF</strong><br><small>Memory Interchange</small></span>
2068 <span class="flow-import-tile">📄 <strong>Markdown</strong><br><small>File or folder</small></span>
2069 <span class="flow-import-tile">🎙️ <strong>Audio</strong><br><small>Whisper transcription</small></span>
2070 <span class="flow-import-tile">💰 <strong>Wallet CSV</strong><br><small>Tx history; 11 formats</small></span>
2071 <span class="flow-import-tile">🗄️ <strong>Supabase</strong><br><small>Memory table import</small></span>
2072 <span class="flow-import-tile">🦞 <strong>OpenClaw</strong><br><small>Agent memory + chats</small></span>
2073 <span class="flow-import-tile">🪶 <strong>Hermes Agent</strong><br><small>Import memory/profile (not vault connect)</small></span>
2074 <span class="flow-import-tile">📥 <strong>Imports</strong><br><small>Local files &amp; team uploads</small></span>
2075 </div>
2076 <ul>
2077 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/IMPORT-SOURCES.md" target="_blank" rel="noopener">All import sources and formats</a></li>
2078 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/CAPTURE-CONTRACT.md" target="_blank" rel="noopener">Capture contract (webhooks, adapters)</a></li>
2079 <li>Digital wallet and exchange CSVs → per-transaction notes with chain and address metadata (see Import Sources)</li>
2080 </ul>
2081 </div>
2082 </details>
2083 </div>
2084 </article>
2085
2086 <article class="flow-step">
2087 <div class="flow-visual">
2088 <p class="flow-step-num">Step 3</p>
2089 <span class="flow-icon" aria-hidden="true">📚</span>
2090 <p class="flow-visual-caption">Starter vault layouts and agent skill packs—before agents run wide.</p>
2091 </div>
2092 <div class="flow-body">
2093 <h2>Templates and Skills</h2>
2094 <p><strong>Templates</strong> are example folders and notes you copy or seed into a vault. <strong>Skill packs</strong> are agent playbooks (Cursor and similar) that say how to search, which MCP prompts to use, and how outputs should look. Together they give you a sane default between importing data and letting agents work the vault.</p>
2095 <details class="flow-details">
2096 <summary>Technical details</summary>
2097 <div class="detail-inner">
2098 <p class="flow-detail-heading">Vault templates</p>
2099 <p>Each template lives under <code>vault/templates/&lt;name&gt;/</code> with a README and sample notes. Hosted: set <code>KNOWTATION_HUB_URL</code>, <code>KNOWTATION_HUB_TOKEN</code>, then <code>npm run seed:template-research-lab</code> (or <code>business-ops</code>, <code>finance</code>, <code>engineering-team</code>, <code>personal-knowledge</code>, <code>smart-home</code>, <code>content-creation</code>, <code>education</code>).</p>
2100 <ul>
2101 <li><strong>Research lab</strong> — literature, protocols, experiments, meetings</li>
2102 <li><strong>Business ops</strong> — decisions, customers, playbooks, competitive</li>
2103 <li><strong>Finance</strong> — thesis, positions, transactions, tax, reports</li>
2104 <li><strong>Engineering team</strong> — architecture, runbooks, incidents, retros</li>
2105 <li><strong>Personal knowledge</strong> — inbox, projects, areas, journal</li>
2106 <li><strong>Smart home</strong> — devices, automations, energy, maintenance</li>
2107 <li><strong>Content creation</strong> — drafts, research, outlines, style guide</li>
2108 <li><strong>Education</strong> — courses, assignments, study notes, schedule</li>
2109 </ul>
2110 <p class="flow-detail-heading">Skill packs</p>
2111 <p>Domain skills: <strong>research-assistant</strong>, <strong>business-analyst</strong>, <strong>financial-ops</strong>. Marketing pipeline (seven): <strong>marketing-research</strong>, <strong>marketing-strategy</strong>, <strong>marketing-writer</strong>, <strong>marketing-editor</strong>, <strong>marketing-visual</strong>, <strong>marketing-distribution</strong>, <strong>marketing-analytics</strong>. Files live under <code>.cursor/skills/packs/&lt;name&gt;/SKILL.md</code>; they compose with MCP prompts and the base knowtation skill.</p>
2112 <ul>
2113 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/TEMPLATES-AND-SKILLS.md" target="_blank" rel="noopener">Templates and skills — architecture, lists, seed and activation</a></li>
2114 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/POPULAR-PROMPTS-AND-STARTERS.md" target="_blank" rel="noopener">Popular prompts and copy-paste starters</a> — MCP prompt names, any-LLM blocks, CLI one-liners (wiki, research, and more)</li>
2115 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/SHOWCASE-VAULT.md" target="_blank" rel="noopener">Showcase vault and seed scripts</a></li>
2116 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/AGENT-INTEGRATION.md" target="_blank" rel="noopener">Agent integration</a> (CLI, MCP, Hub API)</li>
2117 </ul>
2118 </div>
2119 </details>
2120 </div>
2121 </article>
2122
2123 <article class="flow-step">
2124 <div class="flow-visual">
2125 <p class="flow-step-num">Step 4</p>
2126 <span class="flow-icon" aria-hidden="true">🤖</span>
2127 <p class="flow-visual-caption">Agents get the right context, not the whole vault.</p>
2128 </div>
2129 <div class="flow-body">
2130 <h2>Agent flow: context, memory, cost</h2>
2131 <p>Agents connect through a large MCP surface and the same CLI you use. They are guided to search narrowly, then open specific notes. Memory prompts remind them what already happened so they skip redundant work. That pattern saves tokens and improves answers.</p>
2132 <details class="flow-details">
2133 <summary>Technical details</summary>
2134 <div class="detail-inner">
2135 <p>Knowtation ships many MCP tools (search, get-note, memory store/query/consolidate, proposals, and more), resources (vault listings, media URIs, config snapshots), and prompts for workflows like briefs, meetings, and session resume. Hosted MCP adds OAuth-gated access aligned with Hub roles.</p>
2136 <p><strong>Token savings (operational layer).</strong> Beyond “search small, then open one note,” the product now wires savings into hosted and self-hosted operation: consolidation passes and quotas by plan, optional Discover inside the same consolidate run, advanced knobs (lookback, max events/topics, output token cap) persisted on billing records when hosted and in <code>config/local.yaml</code> when self-hosted, encrypt-aware consolidation prompts when memory encryption is on, and hosted MCP <code>search</code> over HTTP POST with parity fields so agents can keep payloads small in the browser path too.</p>
2137 <ul>
2138 <li>Two-step retrieval: <code>search</code> with <code>--fields</code>, <code>--limit</code>, filters → then <code>get_note</code> for bodies</li>
2139 <li>Memory-aware prompts: <code>memory-context</code>, <code>memory-informed-search</code>, <code>resume-session</code></li>
2140 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/TOKEN-SAVINGS.md" target="_blank" rel="noopener">Token savings program</a> (consolidation, Discover, advanced knobs, hosted metering)</li>
2141 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/RETRIEVAL-AND-CLI-REFERENCE.md" target="_blank" rel="noopener">Retrieval and CLI reference</a></li>
2142 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/AGENT-INTEGRATION.md" target="_blank" rel="noopener">Agent integration</a></li>
2143 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/POPULAR-PROMPTS-AND-STARTERS.md" target="_blank" rel="noopener">Popular prompts and copy-paste starters</a> (MCP recipes, any-LLM text, CLI)</li>
2144 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/TEMPLATES-AND-SKILLS.md" target="_blank" rel="noopener">Starter vault templates and agent skill packs</a> — pre-built domain structures and agent playbooks for research, business, finance, marketing, education, and more</li>
2145 </ul>
2146 </div>
2147 </details>
2148 </div>
2149 </article>
2150
2151 <article class="flow-step">
2152 <div class="flow-visual">
2153 <p class="flow-step-num">Step 5</p>
2154 <span class="flow-icon" aria-hidden="true">🧠</span>
2155 <p class="flow-visual-caption">Re-index when content changes; compress memory; Discover cross-topic insights.</p>
2156 </div>
2157 <div class="flow-body">
2158 <h2>Index, re-index, consolidate</h2>
2159 <p>After imports or edits, indexing refreshes vectors so search stays accurate. A consolidation engine merges memory events into compact facts, verifies them against the vault, and can run an optional <strong>Discover</strong> pass that <strong>discovers cross-topic insights</strong> — patterns, tensions, and follow-ups across topics — on a schedule you control, with billing-aware limits when hosted. <strong>Discover is optional:</strong> when enabled, it enriches memory so agents load sharper, wider context in later sessions without pasting the whole vault into the prompt.</p>
2160 <details class="flow-details">
2161 <summary>Technical details</summary>
2162 <div class="detail-inner">
2163 <p>Indexer writes chunks to Qdrant or sqlite-vec. Consolidation runs consolidate, verify, and optional Discover — <strong>Discover discovers cross-topic insights</strong> by emitting <code>insight</code> events that connect themes a single-topic merge would miss. Cost guardrails apply throughout. Hosted mode persists advanced knobs through billing and gateway settings; Discover runs inside the same consolidate request (not a second pass count) when turned on.</p>
2164 <ul>
2165 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/MEMORY-CONSOLIDATION-GUIDE.md" target="_blank" rel="noopener">Memory consolidation guide</a></li>
2166 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/DAEMON-CONSOLIDATION-SPEC.md" target="_blank" rel="noopener">Daemon consolidation spec</a></li>
2167 <li>CLI: <code>npm run index</code>; API routes under <code>/api/v1/memory/consolidate</code> (self-hosted Hub)</li>
2168 </ul>
2169 </div>
2170 </details>
2171 </div>
2172 </article>
2173
2174 <article class="flow-step">
2175 <div class="flow-visual">
2176 <p class="flow-step-num">Step 6</p>
2177 <span class="flow-icon" aria-hidden="true">🐙</span>
2178 <p class="flow-visual-caption">Tie the vault to GitHub for history and portability.</p>
2179 </div>
2180 <div class="flow-body">
2181 <h2>GitHub backup to your vault</h2>
2182 <p>Connect a repository so your vault — notes and media — is backed up and versioned the way engineers already work. Your canonical story stays in plain files and commits under your control, not an opaque database export.</p>
2183 <details class="flow-details">
2184 <summary>Technical details</summary>
2185 <div class="detail-inner">
2186 <p>The Hub and bridge coordinate OAuth to GitHub, commits for backup, and (where configured) image upload paths. Proposals and review queues align with human-in-the-loop changes before writes land in the vault.</p>
2187 <ul>
2188 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/PROVENANCE-AND-GIT.md" target="_blank" rel="noopener">Provenance and Git</a></li>
2189 <li><a href="https://github.com/aaronrene/knowtation/blob/main/hub/gateway/README.md" target="_blank" rel="noopener">Gateway deploy (hosted)</a></li>
2190 </ul>
2191 </div>
2192 </details>
2193 </div>
2194 </article>
2195
2196 <article class="flow-step">
2197 <div class="flow-visual">
2198 <p class="flow-step-num">Step 7</p>
2199 <span class="flow-icon" aria-hidden="true">⬡</span>
2200 <p class="flow-visual-caption">Hosted data on ICP; or run everything yourself.</p>
2201 </div>
2202 <div class="flow-body">
2203 <h2>Decentralized and self-hosted</h2>
2204 <p>Hosted vaults can live on Internet Computer canisters with a gateway in front. Prefer your own machines? The same project runs locally with full control over config, keys, and network boundaries.</p>
2205 <details class="flow-details">
2206 <summary>Technical details</summary>
2207 <div class="detail-inner">
2208 <p>Motoko canisters store note payloads and proposal records; the gateway proxies with JWT verification and rate limits. Attestation records can be HMAC-signed and optionally anchored on-chain for audit.</p>
2209 <ul>
2210 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/WHITEPAPER.md" target="_blank" rel="noopener">Whitepaper (architecture and trust)</a></li>
2211 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/SELF-HOSTED-SETUP-CHECKLIST.md" target="_blank" rel="noopener">Self-hosted checklist</a></li>
2212 <li>ICP canister code under <code>hub/icp/</code> in the repo</li>
2213 </ul>
2214 </div>
2215 </details>
2216 </div>
2217 </article>
2218
2219 <article class="flow-step">
2220 <div class="flow-visual">
2221 <p class="flow-step-num">Step 8</p>
2222 <span class="flow-icon" aria-hidden="true">🌐</span>
2223 <p class="flow-visual-caption">Use it in the browser from anywhere; share at role granularity.</p>
2224 </div>
2225 <div class="flow-body">
2226 <h2>Hosted Hub and sharing</h2>
2227 <p>The web Hub is the friendly face: browse, search, edit, imports, settings, and billing when you use the hosted service. Team members see only what their role allows; you are not sharing a single password to a pile of notes.</p>
2228 <details class="flow-details">
2229 <summary>Technical details</summary>
2230 <div class="detail-inner">
2231 <p>Stripe-backed plans meter searches, index jobs, consolidation passes, and scale with your tier. The bridge handles vault IO, memory events in serverless deployments, and parity with self-hosted behavior where documented.</p>
2232 <ul>
2233 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/HUB-API.md" target="_blank" rel="noopener">Hub API</a></li>
2234 <li><a href="https://github.com/aaronrene/knowtation/blob/main/hub/gateway/README.md" target="_blank" rel="noopener">Deploy gateway (hosted)</a></li>
2235 </ul>
2236 </div>
2237 </details>
2238 </div>
2239 </article>
2240
2241 <article class="flow-step">
2242 <div class="flow-visual">
2243 <p class="flow-step-num">Step 9</p>
2244 <span class="flow-icon" aria-hidden="true">🏷️</span>
2245 <p class="flow-visual-caption">Tags, entities, episodes, and causal chains — optional but powerful.</p>
2246 </div>
2247 <div class="flow-body">
2248 <h2>Structure: entities, episodes, causality</h2>
2249 <p>Optional frontmatter links notes across time and topic: projects, tags, entities, episode ids, causal chains, and follow-on relationships. Agents and filters use the same fields, so “what happened next?” stays searchable without dumping everything into the prompt.</p>
2250 <details class="flow-details">
2251 <summary>Technical details</summary>
2252 <div class="detail-inner">
2253 <p>Fields are opt-in in Markdown YAML frontmatter. CLI and MCP accept filters such as <code>--entity</code>, <code>--episode</code>, and <code>--chain</code>. See the spec and intention doc for the full schema and examples.</p>
2254 <ul>
2255 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/INTENTION-AND-TEMPORAL.md" target="_blank" rel="noopener">Intention and temporal fields</a></li>
2256 <li><a href="https://github.com/aaronrene/knowtation/blob/main/docs/SPEC.md" target="_blank" rel="noopener">SPEC (frontmatter and CLI)</a></li>
2257 </ul>
2258 </div>
2259 </details>
2260 </div>
2261 </article>
2262 </section>
2263
2264 <div class="flow-closing container">
2265 <p><strong style="color: var(--text);">Read the full story</strong> in the whitepaper — thesis, token levers, imports, memory providers, attestation, and billing model.</p>
2266 <div class="cta-row">
2267 <a href="https://github.com/aaronrene/knowtation/blob/main/docs/WHITEPAPER.md" class="cta" target="_blank" rel="noopener">Whitepaper</a>
2268 <a href="https://github.com/aaronrene/knowtation/blob/main/README.md" class="cta cta-secondary" target="_blank" rel="noopener">README</a>
2269 <a href="https://github.com/aaronrene/knowtation/blob/main/docs/AI-ASSISTED-SETUP.md" class="cta cta-secondary" target="_blank" rel="noopener">AI-assisted setup</a>
2270 </div>
2271 </div>
2272
2273 <footer>
2274 <p class="footer-community">
2275 <a href="https://discord.gg/NrtzhZtrED" class="footer-discord-link" target="_blank" rel="noopener noreferrer">
2276 <svg class="footer-discord-icon" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" fill="currentColor">
2277 <path d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0 12.64 12.64 0 0 0-.617-1.25.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057 19.9 19.9 0 0 0 5.993 3.03.078.078 0 0 0 .084-.028c.462-.63.874-1.295 1.226-1.994a.076.076 0 0 0-.041-.106 13.107 13.107 0 0 1-1.872-.892.077.077 0 0 1-.008-.128 10.2 10.2 0 0 0 .372-.292.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127 12.299 12.299 0 0 1-1.873.892.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028 19.839 19.839 0 0 0 6.002-3.03.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.956-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.955-2.419 2.157-2.419 1.168 0 2.176 1.096 2.157 2.42 0 1.333-.948 2.418-2.157 2.418z"/>
2278 </svg>
2279 <strong>Join the community</strong>
2280 </a>
2281 </p>
2282 <div class="footer-social-icons" role="navigation" aria-label="YouTube and X">
2283 <a href="https://www.youtube.com/@Knowtation" target="_blank" rel="noopener noreferrer" aria-label="Knowtation on YouTube" title="YouTube">
2284 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z"/></svg>
2285 </a>
2286 <a href="https://x.com/Knowtation1111" target="_blank" rel="noopener noreferrer" aria-label="Knowtation on X (@Knowtation1111)" title="X (Twitter)">
2287 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M18.901 1.153h3.68l-8.04 9.19L24 22.846h-7.406l-5.8-7.584-6.638 7.584H.474l8.6-9.83L0 1.154h7.594l5.243 6.932L18.901 1.153zm-1.292 19.494h2.039L6.486 3.24H4.298l13.311 17.407z"/></svg>
2288 </a>
2289 </div>
2290 <p><a href="https://github.com/aaronrene/knowtation">Knowtation</a> — Your notes, your data, your context.</p>
2291 <div class="footer-links">
2292 <a href="/hub/">Hub</a>
2293 <a href="https://github.com/aaronrene/knowtation/blob/main/docs/GETTING-STARTED.md" target="_blank" rel="noopener">Getting started</a>
2294 <a href="https://github.com/aaronrene/knowtation/blob/main/docs/AGENT-ORCHESTRATION.md" target="_blank" rel="noopener">Agent orchestration</a>
2295 </div>
2296 <p class="footer-family">Part of the <a class="footer-family-link" href="https://ourware.org" target="_blank" rel="noopener noreferrer"><svg class="ourware-mark" viewBox="0 0 80 72" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" fill="none"><circle cx="24" cy="26" r="8" stroke="currentColor" stroke-width="6.5"/><circle cx="56" cy="26" r="8" stroke="currentColor" stroke-width="6.5"/><path d="M18 50 C 30 64 50 64 62 50" stroke="currentColor" stroke-width="6.5" stroke-linecap="round"/></svg>Ourware</a> family</p>
2297 <div class="footer-ourware-social" role="navigation" aria-label="Ourware on social">
2298 <a href="https://www.facebook.com/profile.php?id=61593821631787" target="_blank" rel="noopener noreferrer" aria-label="Ourware on Facebook" title="Facebook">
2299 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M14 8h3V4.5C16.4 4.3 15.2 4 13.9 4 11.2 4 9.3 5.7 9.3 8.7V11H6.5v3.8h2.8V22h3.4v-7.2H15l.5-3.8h-3.2V9c0-1.1.3-1.8 1.7-1.8z"/></svg>
2300 </a>
2301 <a href="https://www.linkedin.com/company/143378951" target="_blank" rel="noopener noreferrer" aria-label="Ourware on LinkedIn" title="LinkedIn">
2302 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M20.45 20.45h-3.56v-5.57c0-1.33-.02-3.04-1.85-3.04-1.85 0-2.13 1.45-2.13 2.94v5.67H9.35V9h3.41v1.56h.05c.48-.9 1.64-1.85 3.37-1.85 3.6 0 4.27 2.37 4.27 5.46v6.28zM5.34 7.43a2.06 2.06 0 1 1 0-4.13 2.06 2.06 0 0 1 0 4.13zM7.12 20.45H3.56V9h3.56v11.45zM22.23 0H1.77C.79 0 0 .77 0 1.73v20.54C0 23.24.79 24 1.77 24h20.46c.98 0 1.77-.76 1.77-1.73V1.73C24 .77 23.21 0 22.23 0z"/></svg>
2303 </a>
2304 <a href="https://www.youtube.com/channel/UC85lDAayTYjkqPFOyDaORWA" target="_blank" rel="noopener noreferrer" aria-label="Ourware on YouTube" title="YouTube">
2305 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z"/></svg>
2306 </a>
2307 <a href="https://x.com/ourware" target="_blank" rel="noopener noreferrer" aria-label="Ourware on X (@ourware)" title="X (Twitter)">
2308 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M18.901 1.153h3.68l-8.04 9.19L24 22.846h-7.406l-5.8-7.584-6.638 7.584H.474l8.6-9.83L0 1.154h7.594l5.243 6.932L18.901 1.153zm-1.292 19.494h2.039L6.486 3.24H4.298l13.311 17.407z"/></svg>
2309 </a>
2310 </div>
2311 </footer>
2312
2313 <script>
2314 (function () {
2315 var key = 'knowtation-theme';
2316 var root = document.documentElement;
2317 var meta = document.querySelector('meta[name="theme-color"]');
2318 var btn = document.getElementById('theme-toggle');
2319 var icon = btn && btn.querySelector('.theme-toggle-icon');
2320 var label = btn && btn.querySelector('.theme-toggle-label');
2321
2322 function currentTheme() {
2323 return root.getAttribute('data-theme') === 'light' ? 'light' : 'dark';
2324 }
2325
2326 function syncThemeButton() {
2327 if (!btn) return;
2328 var isDark = currentTheme() === 'dark';
2329 btn.setAttribute('aria-pressed', isDark ? 'true' : 'false');
2330 btn.setAttribute('aria-label', isDark ? 'Switch to light theme' : 'Switch to dark theme');
2331 if (icon) icon.textContent = isDark ? '🌙' : '☀️';
2332 if (label) label.textContent = isDark ? 'Night' : 'Day';
2333 }
2334
2335 function applyTheme(theme) {
2336 root.setAttribute('data-theme', theme);
2337 try { localStorage.setItem(key, theme); } catch (e) {}
2338 if (meta) meta.setAttribute('content', theme === 'light' ? '#f5f7fb' : '#0a192f');
2339 syncThemeButton();
2340 }
2341
2342 syncThemeButton();
2343 if (btn) {
2344 btn.addEventListener('click', function () {
2345 applyTheme(currentTheme() === 'dark' ? 'light' : 'dark');
2346 });
2347 }
2348 })();
2349
2350 (function () {
2351 var host = typeof location !== 'undefined' && location.hostname;
2352 var gateway = (host === 'knowtation.store' || host === 'www.knowtation.store')
2353 ? 'https://knowtation-gateway.netlify.app'
2354 : (typeof location !== 'undefined' ? location.origin : '');
2355 document.querySelectorAll('.cta-signin').forEach(function (a) {
2356 var p = a.getAttribute('data-provider');
2357 if (gateway && p) a.href = gateway + '/auth/login?provider=' + p;
2358 });
2359 })();
2360
2361 (function () {
2362 var root = document.querySelector('[data-brain-grow-show]');
2363 if (!root) return;
2364 var slides = root.querySelectorAll('.brain-grow-show__slide');
2365 var dots = root.querySelectorAll('.brain-grow-show__dot');
2366 var caption = root.querySelector('.brain-grow-show__caption strong');
2367 var i = 0;
2368 var timer;
2369
2370 function show(next) {
2371 slides[i].classList.remove('is-active');
2372 dots[i].removeAttribute('aria-current');
2373 i = (next + slides.length) % slides.length;
2374 slides[i].classList.add('is-active');
2375 dots[i].setAttribute('aria-current', 'true');
2376 if (caption) caption.textContent = dots[i].getAttribute('aria-label') || '';
2377 }
2378
2379 function start() {
2380 stop();
2381 timer = setInterval(function () { show(i + 1); }, 4500);
2382 }
2383
2384 function stop() {
2385 if (timer) clearInterval(timer);
2386 }
2387
2388 dots.forEach(function (dot, idx) {
2389 dot.addEventListener('click', function () {
2390 show(idx);
2391 start();
2392 });
2393 });
2394 root.addEventListener('mouseenter', stop);
2395 root.addEventListener('mouseleave', start);
2396 start();
2397 })();
2398 </script>
2399 </body>
2400 </html>
File History 1 commit
sha256:700fafdd1afa490919f9515d660ca6e75456bcd5bb67513abcd8757a634c01f6 docs: record AIP-b SD-21 land (KN #308) Human 9 days ago