polish: extract inline CSS, add connection status, panel macro, favicon, ollama cache, toast system (#164)

Major:
- Extract all inline <style> blocks from 22 Jinja2 templates into
  static/css/mission-control.css — single cacheable stylesheet
- Add tox lint check that fails on inline <style> in templates

Minor:
1. Connection status indicator in topbar (green/amber/red dot) reflecting
   WebSocket + Ollama reachability, with auto-reconnect
2. Jinja2 {% macro panel(title) %} in macros.html — eliminates repeated
   .card.mc-panel markup; index.html converted as example
3. SVG favicon (purple T + orange dot)
4. 30-second TTL cache on _check_ollama() to avoid blocking the event loop
   on every health poll (asyncio.to_thread was already in place)
5. Toast notification system (McToast.show) for transient status messages —
   wired into connection status for Ollama/WebSocket state changes

Enforcement:
- CLAUDE.md updated with conventions 11-14 (no inline CSS, use panel macro,
  use toasts, never block the event loop)
- tox lint + pre-push environments now fail on inline <style> blocks

https://claude.ai/code/session_014FQ785MQdyJQ4BAXrRSo9w

Co-authored-by: Claude <noreply@anthropic.com>

src/dashboard/templates/thinking.html

@@ -2,97 +2,7 @@
 
 {% block title %}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 extra_styles %}{% endblock %}
 
 {% block content %}
 <div class="container thinking-container py-4">