Files
Timmy-time-dashboard/docs/index.html

927 lines
31 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<title>Timmy Time — Mission Control</title>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;600;700&display=swap" rel="stylesheet" />
<style>
/* ── Reset & base ────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
--bg-deep: #060d14;
--bg-panel: #0c1824;
--bg-card: #0f2030;
--border: #1a3a55;
--border-glow: #1e4d72;
--text: #b8d0e8;
--text-dim: #4a7a9a;
--text-bright: #ddeeff;
--green: #00e87a;
--amber: #ffb800;
--red: #ff4455;
--blue: #00aaff;
--purple: #aa77ff;
--font: 'JetBrains Mono', monospace;
}
html { scroll-behavior: smooth; }
body {
background: var(--bg-deep);
color: var(--text);
font-family: var(--font);
font-size: 14px;
line-height: 1.7;
min-height: 100vh;
overflow-x: hidden;
}
a { color: var(--blue); text-decoration: none; }
a:hover { text-decoration: underline; }
/* ── Scanline overlay ────────────────────────────────────────────────── */
body::before {
content: '';
position: fixed;
inset: 0;
background: repeating-linear-gradient(
0deg,
transparent,
transparent 2px,
rgba(0, 170, 255, 0.012) 2px,
rgba(0, 170, 255, 0.012) 4px
);
pointer-events: none;
z-index: 999;
}
/* ── Header ──────────────────────────────────────────────────────────── */
header {
border-bottom: 1px solid var(--border);
background: var(--bg-panel);
padding: 0 2rem;
display: flex;
align-items: center;
justify-content: space-between;
height: 56px;
position: sticky;
top: 0;
z-index: 100;
}
.logo {
font-size: 13px;
font-weight: 700;
color: var(--blue);
letter-spacing: 0.15em;
text-transform: uppercase;
}
.logo span { color: var(--text-dim); }
nav { display: flex; gap: 1.5rem; align-items: center; }
nav a {
color: var(--text-dim);
font-size: 12px;
letter-spacing: 0.08em;
text-transform: uppercase;
transition: color 0.2s;
}
nav a:hover { color: var(--blue); text-decoration: none; }
.btn-primary {
background: var(--blue);
color: #000;
font-family: var(--font);
font-size: 12px;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
padding: 8px 18px;
border: none;
cursor: pointer;
transition: background 0.2s, box-shadow 0.2s;
display: inline-block;
}
.btn-primary:hover {
background: #33bbff;
box-shadow: 0 0 16px rgba(0, 170, 255, 0.4);
text-decoration: none;
}
/* ── Hero ────────────────────────────────────────────────────────────── */
.hero {
padding: 7rem 2rem 5rem;
text-align: center;
position: relative;
overflow: hidden;
}
.hero::before {
content: '';
position: absolute;
top: -80px;
left: 50%;
transform: translateX(-50%);
width: 600px;
height: 600px;
background: radial-gradient(circle, rgba(0, 170, 255, 0.08) 0%, transparent 70%);
pointer-events: none;
}
.hero-label {
font-size: 11px;
letter-spacing: 0.25em;
color: var(--blue);
text-transform: uppercase;
margin-bottom: 1.5rem;
}
.hero h1 {
font-size: clamp(2rem, 6vw, 4.5rem);
font-weight: 700;
color: var(--text-bright);
letter-spacing: -0.02em;
line-height: 1.1;
margin-bottom: 1rem;
}
.hero h1 em {
font-style: normal;
color: var(--blue);
}
.hero-sub {
font-size: clamp(13px, 2vw, 16px);
color: var(--text-dim);
max-width: 560px;
margin: 0 auto 2.5rem;
}
.hero-badges {
display: flex;
gap: 0.75rem;
justify-content: center;
flex-wrap: wrap;
margin-bottom: 2.5rem;
}
.badge {
font-size: 11px;
letter-spacing: 0.05em;
padding: 4px 12px;
border: 1px solid var(--border-glow);
color: var(--text-dim);
background: var(--bg-panel);
}
.badge.green { border-color: var(--green); color: var(--green); }
.badge.amber { border-color: var(--amber); color: var(--amber); }
.badge.blue { border-color: var(--blue); color: var(--blue); }
.badge.purple { border-color: var(--purple); color: var(--purple); }
.hero-cta { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.btn-ghost {
border: 1px solid var(--border-glow);
color: var(--text);
font-family: var(--font);
font-size: 12px;
font-weight: 600;
letter-spacing: 0.08em;
text-transform: uppercase;
padding: 8px 18px;
background: transparent;
cursor: pointer;
transition: border-color 0.2s, color 0.2s;
display: inline-block;
}
.btn-ghost:hover {
border-color: var(--blue);
color: var(--blue);
text-decoration: none;
}
/* ── Stats bar ───────────────────────────────────────────────────────── */
.stats {
display: flex;
justify-content: center;
gap: 0;
border-top: 1px solid var(--border);
border-bottom: 1px solid var(--border);
background: var(--bg-panel);
}
.stat {
flex: 1;
max-width: 200px;
padding: 1.5rem 1rem;
text-align: center;
border-right: 1px solid var(--border);
}
.stat:last-child { border-right: none; }
.stat-number {
font-size: 2rem;
font-weight: 700;
color: var(--blue);
line-height: 1;
margin-bottom: 0.25rem;
}
.stat-label {
font-size: 11px;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--text-dim);
}
/* ── Section layout ──────────────────────────────────────────────────── */
section { padding: 5rem 2rem; max-width: 1100px; margin: 0 auto; }
.section-label {
font-size: 11px;
letter-spacing: 0.2em;
text-transform: uppercase;
color: var(--blue);
margin-bottom: 0.75rem;
}
section h2 {
font-size: clamp(1.4rem, 3vw, 2.2rem);
font-weight: 700;
color: var(--text-bright);
margin-bottom: 1rem;
}
.section-intro {
color: var(--text-dim);
max-width: 620px;
margin-bottom: 3rem;
}
/* ── Feature grid ────────────────────────────────────────────────────── */
.feature-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 1px;
border: 1px solid var(--border);
background: var(--border);
}
.feature-card {
background: var(--bg-panel);
padding: 2rem;
transition: background 0.2s;
}
.feature-card:hover { background: var(--bg-card); }
.feature-icon {
font-size: 1.5rem;
margin-bottom: 1rem;
display: block;
}
.feature-card h3 {
font-size: 14px;
font-weight: 700;
color: var(--text-bright);
margin-bottom: 0.5rem;
letter-spacing: 0.05em;
text-transform: uppercase;
}
.feature-card p {
font-size: 13px;
color: var(--text-dim);
line-height: 1.6;
}
.feature-tag {
display: inline-block;
font-size: 10px;
letter-spacing: 0.08em;
text-transform: uppercase;
padding: 2px 8px;
margin-top: 0.75rem;
border: 1px solid var(--border);
color: var(--text-dim);
}
/* ── Architecture ────────────────────────────────────────────────────── */
.arch-wrap {
border: 1px solid var(--border);
background: var(--bg-panel);
padding: 2rem;
overflow-x: auto;
}
.arch-wrap pre {
font-family: var(--font);
font-size: 12px;
color: var(--text);
line-height: 1.6;
white-space: pre;
}
.arch-wrap pre .hl-blue { color: var(--blue); }
.arch-wrap pre .hl-green { color: var(--green); }
.arch-wrap pre .hl-amber { color: var(--amber); }
.arch-wrap pre .hl-purple { color: var(--purple); }
.arch-wrap pre .hl-dim { color: var(--text-dim); }
/* ── Quickstart ──────────────────────────────────────────────────────── */
.quickstart-steps { display: flex; flex-direction: column; gap: 1.5rem; }
.step {
display: grid;
grid-template-columns: 48px 1fr;
gap: 1.25rem;
align-items: start;
}
.step-num {
width: 48px;
height: 48px;
border: 1px solid var(--border-glow);
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
color: var(--blue);
font-size: 16px;
flex-shrink: 0;
}
.step h4 {
font-size: 13px;
font-weight: 700;
color: var(--text-bright);
margin-bottom: 0.5rem;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.step p { font-size: 13px; color: var(--text-dim); margin-bottom: 0.5rem; }
code {
background: var(--bg-card);
border: 1px solid var(--border);
padding: 0.15em 0.5em;
font-family: var(--font);
font-size: 12px;
color: var(--green);
}
pre.codeblock {
background: var(--bg-card);
border: 1px solid var(--border);
padding: 1.25rem 1.5rem;
font-family: var(--font);
font-size: 12px;
color: var(--text);
line-height: 1.7;
overflow-x: auto;
margin-top: 0.5rem;
}
pre.codeblock .cmd { color: var(--green); }
pre.codeblock .cmt { color: var(--text-dim); }
pre.codeblock .flag { color: var(--amber); }
/* ── Agent team ──────────────────────────────────────────────────────── */
.agent-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
gap: 1px;
border: 1px solid var(--border);
background: var(--border);
}
.agent-card {
background: var(--bg-panel);
padding: 2rem;
position: relative;
}
.agent-accent {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 2px;
}
.agent-name {
font-size: 15px;
font-weight: 700;
color: var(--text-bright);
margin-bottom: 0.25rem;
}
.agent-role {
font-size: 11px;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--text-dim);
margin-bottom: 1.25rem;
}
.agent-list {
list-style: none;
font-size: 12px;
color: var(--text-dim);
}
.agent-list li { padding: 0.2rem 0; }
.agent-list li::before { content: '→ '; color: var(--border-glow); }
/* ── Roadmap ─────────────────────────────────────────────────────────── */
.roadmap { display: flex; flex-direction: column; gap: 0; }
.roadmap-item {
display: grid;
grid-template-columns: 120px 1fr;
gap: 0;
border: 1px solid var(--border);
margin-top: -1px;
}
.roadmap-version {
background: var(--bg-card);
border-right: 1px solid var(--border);
padding: 1.5rem 1.25rem;
display: flex;
flex-direction: column;
justify-content: center;
}
.roadmap-ver-num {
font-weight: 700;
color: var(--blue);
font-size: 13px;
}
.roadmap-ver-name {
font-size: 11px;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--text-dim);
margin-top: 0.15rem;
}
.roadmap-content { padding: 1.5rem 1.5rem; }
.roadmap-status {
font-size: 11px;
letter-spacing: 0.1em;
text-transform: uppercase;
margin-bottom: 0.5rem;
}
.roadmap-content h4 {
font-size: 13px;
font-weight: 700;
color: var(--text-bright);
margin-bottom: 0.5rem;
}
.roadmap-content p { font-size: 12px; color: var(--text-dim); }
/* ── Footer ──────────────────────────────────────────────────────────── */
footer {
border-top: 1px solid var(--border);
background: var(--bg-panel);
padding: 2rem;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 1rem;
}
.footer-copy {
font-size: 11px;
color: var(--text-dim);
letter-spacing: 0.05em;
}
.footer-links { display: flex; gap: 1.5rem; }
.footer-links a {
font-size: 11px;
color: var(--text-dim);
letter-spacing: 0.08em;
text-transform: uppercase;
transition: color 0.2s;
}
.footer-links a:hover { color: var(--blue); text-decoration: none; }
/* ── Divider ─────────────────────────────────────────────────────────── */
.divider {
border: none;
border-top: 1px solid var(--border);
margin: 0;
}
/* ── Responsive ──────────────────────────────────────────────────────── */
@media (max-width: 640px) {
header { padding: 0 1rem; }
nav { display: none; }
.hero { padding: 4rem 1rem 3rem; }
.stats { flex-wrap: wrap; }
.stat { max-width: none; flex: 0 0 50%; border-right: none;
border-bottom: 1px solid var(--border); }
section { padding: 3rem 1rem; }
.roadmap-item { grid-template-columns: 1fr; }
.roadmap-version { border-right: none; border-bottom: 1px solid var(--border); }
footer { flex-direction: column; align-items: flex-start; }
}
</style>
</head>
<body>
<!-- ── Header ──────────────────────────────────────────────────────────── -->
<header>
<div class="logo">TIMMY TIME <span>// MISSION CONTROL</span></div>
<nav>
<a href="#features">Features</a>
<a href="#architecture">Architecture</a>
<a href="#quickstart">Quickstart</a>
<a href="#agents">Agent Team</a>
<a href="#roadmap">Roadmap</a>
<a class="btn-primary" href="https://github.com/AlexanderWhitestone/Timmy-time-dashboard">GitHub →</a>
</nav>
</header>
<!-- ── Hero ────────────────────────────────────────────────────────────── -->
<section class="hero" style="max-width:100%; padding-left:2rem; padding-right:2rem;">
<p class="hero-label">Sovereign AI Agent System</p>
<h1>Your agents.<br><em>Your hardware.</em><br>Your sats.</h1>
<p class="hero-sub">
A local-first AI command center. Talk to Timmy, coordinate your swarm,
gate API access with Bitcoin Lightning — no cloud AI, no telemetry, no compromise.
</p>
<div class="hero-badges">
<span class="badge green">Full Test Suite Passing</span>
<span class="badge blue">FastAPI + HTMX</span>
<span class="badge amber">Lightning L402</span>
<span class="badge">No Cloud AI</span>
<span class="badge purple">Multi-Agent Swarm</span>
<span class="badge">MIT License</span>
</div>
<div class="hero-cta">
<a class="btn-primary" href="https://github.com/AlexanderWhitestone/Timmy-time-dashboard">View on GitHub</a>
<a class="btn-ghost" href="#quickstart">Get Started</a>
</div>
</section>
<!-- ── Stats ────────────────────────────────────────────────────────────── -->
<div class="stats">
<div class="stat">
<div class="stat-number">640+</div>
<div class="stat-label">Tests Passing</div>
</div>
<div class="stat">
<div class="stat-number">58</div>
<div class="stat-label">API Endpoints</div>
</div>
<div class="stat">
<div class="stat-number">15</div>
<div class="stat-label">Subsystems</div>
</div>
<div class="stat">
<div class="stat-number">0</div>
<div class="stat-label">Cloud AI Calls</div>
</div>
</div>
<hr class="divider" />
<!-- ── Features ─────────────────────────────────────────────────────────── -->
<section id="features">
<p class="section-label">Capabilities</p>
<h2>Everything in one dashboard</h2>
<p class="section-intro">
Built for the operator who wants sovereignty without sacrificing capability.
Every subsystem works offline.
</p>
<div class="feature-grid">
<div class="feature-card">
<span class="feature-icon">🤖</span>
<h3>Timmy Agent</h3>
<p>Agno-powered conversational agent backed by Ollama (llama3.2 default) or
AirLLM for 70B405B models on Apple Silicon. SQLite memory, no cloud.</p>
<span class="feature-tag">Agno · Ollama · AirLLM</span>
</div>
<div class="feature-card">
<span class="feature-icon">🌐</span>
<h3>Mission Control UI</h3>
<p>FastAPI backend with Jinja2 + HTMX frontend. Dark terminal aesthetic.
Real-time health polling, chat history, live swarm feed — no JavaScript framework.</p>
<span class="feature-tag">FastAPI · HTMX · Bootstrap 5</span>
</div>
<div class="feature-card">
<span class="feature-icon">🐝</span>
<h3>Multi-Agent Swarm</h3>
<p>Spawn sub-agents, post tasks, run 15-second Lightning auctions. Registry,
manager, bidder, and coordinator — all in-process or as separate subprocesses.</p>
<span class="feature-tag">Coordinator · Registry · Auction</span>
</div>
<div class="feature-card">
<span class="feature-icon"></span>
<h3>L402 Lightning Payments</h3>
<p>Bitcoin Lightning payment gating via HMAC macaroons. Mock backend for dev,
LND backend scaffolded for production. Auction bids priced in sats.</p>
<span class="feature-tag">L402 · Macaroon · BOLT11</span>
</div>
<div class="feature-card">
<span class="feature-icon">🎙️</span>
<h3>Voice I/O</h3>
<p>Pattern-matched NLU detects intents (status, swarm, task, help) from natural
language. TTS via pyttsx3 speaks responses aloud. Fully offline.</p>
<span class="feature-tag">NLU · pyttsx3 · Intent Detection</span>
</div>
<div class="feature-card">
<span class="feature-icon">📱</span>
<h3>Mobile Optimized</h3>
<p>iOS safe-area, 44px touch targets, 16px inputs (no zoom), momentum scroll,
dynamic viewport height. 21-scenario HITL test harness built in.</p>
<span class="feature-tag">iOS · HITL · Responsive</span>
</div>
<div class="feature-card">
<span class="feature-icon">🔴</span>
<h3>WebSocket Live Feed</h3>
<p>Real-time swarm events — agent joins, task posts, auction bids, completions —
broadcast over WebSocket to the live dashboard.</p>
<span class="feature-tag">WebSocket · Live Events</span>
</div>
<div class="feature-card">
<span class="feature-icon">🛡️</span>
<h3>Security First</h3>
<p>XSS prevention via textContent (not innerHTML). Startup warnings for default
secrets. HMAC-signed macaroons. Graceful degradation on every optional service.</p>
<span class="feature-tag">XSS-safe · HMAC · Warnings</span>
</div>
<div class="feature-card">
<span class="feature-icon">🔧</span>
<h3>Self-TDD Watchdog</h3>
<p>Continuous test runner polls pytest every 60 seconds and alerts on regressions.
Runs alongside dev work in the background — silent when green.</p>
<span class="feature-tag">pytest · self-tdd · CI</span>
</div>
</div>
</section>
<hr class="divider" />
<!-- ── Architecture ──────────────────────────────────────────────────────── -->
<section id="architecture">
<p class="section-label">System Design</p>
<h2>Architecture</h2>
<p class="section-intro">
A layered local stack. Every dependency can degrade gracefully — Ollama offline?
Error message. Redis missing? In-memory pub/sub. pyttsx3 absent? TTS is a no-op.
</p>
<div class="arch-wrap">
<pre>
<span class="hl-blue">Browser / Phone</span>
│ HTTP + HTMX + WebSocket
┌─────────────────────────────────────────────────────────┐
<span class="hl-blue">FastAPI (dashboard.app)</span>
│ routes: agents · health · swarm · marketplace · voice │
└────────┬──────────────┬────────────────┬────────────────┘
│ │ │
▼ ▼ ▼
<span class="hl-green">Jinja2</span> <span class="hl-amber">Timmy Agent</span> <span class="hl-purple">Swarm Coordinator</span>
Templates │ ├─ Registry (SQLite)
(HTMX) ├─ <span class="hl-green">Ollama</span> ├─ AuctionManager (15s bids)
└─ <span class="hl-amber">AirLLM</span> ├─ SwarmComms (Redis / mem)
(70B405B) └─ SwarmManager (subprocess)
├── <span class="hl-blue">Voice NLU + TTS</span> (pyttsx3, local)
├── <span class="hl-blue">WebSocket live feed</span> (ws_manager)
├── <span class="hl-amber">L402 Lightning proxy</span> (macaroon + BOLT11 invoice)
├── <span class="hl-green">Push notifications</span> (local + macOS native)
└── Siri Shortcuts API (iOS automation endpoints)
<span class="hl-dim">Persistence: timmy.db (Agno memory) · data/swarm.db (registry + tasks)
External: Ollama :11434 · optional Redis · optional LND gRPC</span>
</pre>
</div>
</section>
<hr class="divider" />
<!-- ── Quickstart ─────────────────────────────────────────────────────────── -->
<section id="quickstart">
<p class="section-label">Get Running</p>
<h2>Quickstart</h2>
<p class="section-intro">
Five minutes from zero to a running agent. You need Python 3.11+ and Ollama.
</p>
<div class="quickstart-steps">
<div class="step">
<div class="step-num">1</div>
<div>
<h4>Clone</h4>
<pre class="codeblock"><span class="cmd">git clone</span> https://github.com/AlexanderWhitestone/Timmy-time-dashboard.git
<span class="cmd">cd</span> Timmy-time-dashboard</pre>
</div>
</div>
<div class="step">
<div class="step-num">2</div>
<div>
<h4>Install</h4>
<pre class="codeblock"><span class="cmd">make install</span>
<span class="cmt"># or manually:</span>
<span class="cmd">python3 -m venv</span> .venv <span class="cmt">&amp;&amp;</span> <span class="cmd">source</span> .venv/bin/activate
<span class="cmd">pip install</span> -e ".[dev]"</pre>
</div>
</div>
<div class="step">
<div class="step-num">3</div>
<div>
<h4>Start Ollama</h4>
<pre class="codeblock"><span class="cmt"># In a separate terminal:</span>
<span class="cmd">ollama serve</span>
<span class="cmd">ollama pull</span> llama3.2 <span class="cmt"># ~2 GB, one-time download</span></pre>
</div>
</div>
<div class="step">
<div class="step-num">4</div>
<div>
<h4>Launch</h4>
<pre class="codeblock"><span class="cmd">make dev</span>
<span class="cmt"># Opens at http://localhost:8000</span>
<span class="cmt"># Mobile: http://&lt;your-lan-ip&gt;:8000</span></pre>
</div>
</div>
<div class="step">
<div class="step-num">5</div>
<div>
<h4>Test</h4>
<pre class="codeblock"><span class="cmd">make test</span> <span class="cmt"># full test suite — no Ollama needed</span>
<span class="cmd">make test-cov</span> <span class="cmt"># + coverage report</span>
<span class="cmd">make watch</span> <span class="cmt"># self-TDD watchdog in background</span></pre>
</div>
</div>
</div>
</section>
<hr class="divider" />
<!-- ── Agent Team ─────────────────────────────────────────────────────────── -->
<section id="agents">
<p class="section-label">Contributors</p>
<h2>The agent team</h2>
<p class="section-intro">
This repo is built by a multi-agent team. Each tool has a defined lane.
See <a href="https://github.com/AlexanderWhitestone/Timmy-time-dashboard/blob/main/AGENTS.md">AGENTS.md</a>
for the full development standards.
</p>
<div class="agent-grid">
<div class="agent-card">
<div class="agent-accent" style="background: var(--blue);"></div>
<div class="agent-name">Claude</div>
<div class="agent-role">Anthropic · Architect</div>
<ul class="agent-list">
<li>Foundation, scaffolding, CI</li>
<li>Testing and quality passes</li>
<li>Documentation and tooling</li>
<li>Iterative refinement</li>
</ul>
</div>
<div class="agent-card">
<div class="agent-accent" style="background: var(--purple);"></div>
<div class="agent-name">Kimi</div>
<div class="agent-role">Moonshot AI · Feature Engine</div>
<ul class="agent-list">
<li>High-volume feature drops</li>
<li>New subsystem builds</li>
<li>Large context, rapid expansion</li>
<li>Agent persona implementation</li>
</ul>
</div>
<div class="agent-card">
<div class="agent-accent" style="background: var(--amber);"></div>
<div class="agent-name">Manus</div>
<div class="agent-role">Manus AI · Security Specialist</div>
<ul class="agent-list">
<li>Security audits (XSS, injection)</li>
<li>Coverage gap analysis</li>
<li>Targeted bug fixes</li>
<li>Payment flow validation</li>
</ul>
</div>
<div class="agent-card">
<div class="agent-accent" style="background: var(--text-dim);"></div>
<div class="agent-name">Alexander Whitestone</div>
<div class="agent-role">Human · Orchestrator</div>
<ul class="agent-list">
<li>Vision and product decisions</li>
<li>Agent task assignment</li>
<li>PR review and merge</li>
<li>Bitcoin / Lightning domain</li>
</ul>
</div>
</div>
</section>
<hr class="divider" />
<!-- ── Roadmap ────────────────────────────────────────────────────────────── -->
<section id="roadmap">
<p class="section-label">What's Next</p>
<h2>Roadmap</h2>
<p class="section-intro">Three phases, each named after a book.</p>
<div class="roadmap">
<div class="roadmap-item">
<div class="roadmap-version">
<div class="roadmap-ver-num">v1.0.0</div>
<div class="roadmap-ver-name">Genesis</div>
</div>
<div class="roadmap-content">
<div class="roadmap-status" style="color:var(--green);">✓ Complete</div>
<h4>Foundation</h4>
<p>Agno + Ollama + SQLite + FastAPI dashboard + HTMX + full test suite.
CLI, mobile layout, Bootstrap, CI/CD, AirLLM big-brain backend.</p>
</div>
</div>
<div class="roadmap-item">
<div class="roadmap-version">
<div class="roadmap-ver-num">v2.0.0</div>
<div class="roadmap-ver-name">Exodus</div>
</div>
<div class="roadmap-content">
<div class="roadmap-status" style="color:var(--amber);">⟳ In progress</div>
<h4>Multi-Agent Economy</h4>
<p>Swarm coordination, L402 Lightning payment gating, voice NLU/TTS,
marketplace, WebSocket live feed. Agent personas: Echo, Mace, Helm,
Seer, Forge, Quill. Real LND gRPC backend.</p>
</div>
</div>
<div class="roadmap-item">
<div class="roadmap-version">
<div class="roadmap-ver-num">v3.0.0</div>
<div class="roadmap-ver-name">Revelation</div>
</div>
<div class="roadmap-content">
<div class="roadmap-status" style="color:var(--text-dim);">◌ Planned</div>
<h4>Sovereign Deployment</h4>
<p>Bitcoin Lightning treasury — agents earn and spend sats autonomously.
Single <code>.app</code> bundle for macOS (no Python install).
Federation between Timmy instances.</p>
</div>
</div>
</div>
</section>
<hr class="divider" />
<!-- ── Footer ────────────────────────────────────────────────────────────── -->
<footer>
<div class="footer-copy">
TIMMY TIME // MISSION CONTROL &nbsp;·&nbsp; MIT License &nbsp;·&nbsp;
No cloud AI. No telemetry. Sats are sovereignty.
</div>
<div class="footer-links">
<a href="https://github.com/AlexanderWhitestone/Timmy-time-dashboard">GitHub</a>
<a href="https://github.com/AlexanderWhitestone/Timmy-time-dashboard/blob/main/AGENTS.md">AGENTS.md</a>
<a href="https://github.com/AlexanderWhitestone/Timmy-time-dashboard/blob/main/README.md">README</a>
<a href="https://github.com/AlexanderWhitestone/Timmy-time-dashboard/issues">Issues</a>
</div>
</footer>
</body>
</html>