feat: add default thinking thread — Timmy always ponders (#75)

src/dashboard/templates/thinking.html

@@ -0,0 +1,142 @@
+{% extends "base.html" %}
+
+{% block title %}Timmy Time — Thought Stream{% endblock %}
+
+{% block extra_styles %}
+<style>
+.thinking-container { max-width: 680px; }
+
+.thinking-header {
+  border-left: 3px solid var(--purple);
+  padding-left: 1rem;
+}
+.thinking-title {
+  font-size: 1.6rem;
+  font-weight: 700;
+  color: var(--purple);
+  letter-spacing: 0.04em;
+  font-family: var(--font);
+}
+.thinking-subtitle {
+  font-size: 0.75rem;
+  color: var(--text-dim);
+  margin-top: 0.25rem;
+}
+
+.thought-card {
+  border: 1px solid var(--border);
+  border-radius: var(--radius-md);
+  padding: 1rem;
+  margin-bottom: 0.75rem;
+  background: rgba(24, 10, 45, 0.5);
+  transition: border-color 0.2s;
+}
+.thought-card:hover {
+  border-color: var(--purple);
+}
+
+.thought-content {
+  font-size: 0.95rem;
+  line-height: 1.65;
+  color: var(--text-bright);
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+.thought-meta {
+  display: flex;
+  gap: 0.75rem;
+  align-items: center;
+  margin-bottom: 0.5rem;
+  flex-wrap: wrap;
+}
+
+.thought-time {
+  font-size: 0.72rem;
+  color: var(--text-dim);
+  font-family: var(--font);
+}
+
+.seed-badge {
+  font-size: 0.68rem;
+  padding: 0.15em 0.5em;
+  border-radius: 4px;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+}
+.seed-existential { background: rgba(138, 43, 226, 0.2); color: #c084fc; }
+.seed-swarm       { background: rgba(0, 232, 122, 0.15); color: var(--green); }
+.seed-scripture   { background: rgba(255, 193, 7, 0.15); color: var(--amber); }
+.seed-creative    { background: rgba(236, 72, 153, 0.2); color: #f472b6; }
+.seed-memory      { background: rgba(56, 189, 248, 0.15); color: #38bdf8; }
+.seed-freeform    { background: rgba(148, 163, 184, 0.15); color: #94a3b8; }
+
+.thought-chain-link {
+  font-size: 0.72rem;
+  color: var(--text-dim);
+  text-decoration: none;
+  font-family: var(--font);
+}
+.thought-chain-link:hover { color: var(--purple); }
+
+.no-thoughts {
+  text-align: center;
+  color: var(--text-dim);
+  padding: 3rem 0;
+  font-size: 0.9rem;
+}
+
+@media (max-width: 576px) {
+  .thinking-title { font-size: 1.3rem; }
+  .thought-content { font-size: 0.9rem; }
+}
+</style>
+{% endblock %}
+
+{% block content %}
+<div class="container thinking-container py-4">
+
+  <div class="thinking-header mb-4">
+    <div class="thinking-title">Thought Stream</div>
+    <div class="thinking-subtitle">
+      Timmy's inner monologue &mdash; always thinking, always pondering.
+    </div>
+  </div>
+
+  <div class="card mc-panel">
+    <div class="card-header mc-panel-header d-flex justify-content-between align-items-center">
+      <span>// INNER THOUGHTS</span>
+      <span class="badge" style="background:var(--purple-dim); color:var(--purple);">{{ thoughts | length }} thoughts</span>
+    </div>
+    <div class="card-body p-3"
+         id="thought-stream"
+         hx-get="/thinking/api"
+         hx-trigger="every 60s"
+         hx-swap="innerHTML"
+         hx-select-oob="false">
+
+      {% if thoughts %}
+        {% for thought in thoughts %}
+        <div class="thought-card">
+          <div class="thought-meta">
+            <span class="seed-badge seed-{{ thought.seed_type }}">{{ thought.seed_type }}</span>
+            <span class="thought-time">{{ thought.created_at[:19] }}</span>
+            {% if thought.parent_id %}
+            <a href="/thinking/api/{{ thought.id }}/chain" class="thought-chain-link" title="View thought chain">chain</a>
+            {% endif %}
+          </div>
+          <div class="thought-content">{{ thought.content | e }}</div>
+        </div>
+        {% endfor %}
+      {% else %}
+        <div class="no-thoughts">
+          Timmy hasn't had any thoughts yet. The thinking thread will begin shortly after startup.
+        </div>
+      {% endif %}
+
+    </div>
+  </div>
+
+</div>
+{% endblock %}