Add dreaming mode UI to thinking.html

src/dashboard/templates/thinking.html

@@ -7,7 +7,25 @@
 {% block content %}
 <div class="container thinking-container py-4">
 
-  <div class="thinking-header mb-4">
+  
+  <div class="d-flex justify-content-between align-items-center mb-4">
+    <div class="thinking-header">
+      <div class="thinking-title">Thought Stream</div>
+      <div class="thinking-subtitle">
+        Inner monologue &mdash; always thinking, always pondering.
+      </div>
+    </div>
+    <div class="dreaming-controls d-flex align-items-center gap-3">
+      <div class="form-check form-switch">
+        <input class="form-check-input" type="checkbox" id="dreamingToggle" hx-post="/thinking/dreaming/toggle" hx-trigger="change" hx-swap="none">
+        <label class="form-check-label" for="dreamingToggle">Dreaming Mode</label>
+      </div>
+      <button class="btn btn-sm btn-outline-primary" hx-post="/thinking/dream" hx-swap="none" hx-on::after-request="location.reload()">
+        Dream Now
+      </button>
+    </div>
+  </div>
+
     <div class="thinking-title">Thought Stream</div>
     <div class="thinking-subtitle">
       Inner monologue &mdash; always thinking, always pondering.
@@ -50,3 +68,13 @@
 
 </div>
 {% endblock %}
+
+<script>
+  document.addEventListener('DOMContentLoaded', function() {
+    fetch('/thinking/dreaming/status')
+      .then(res => res.json())
+      .then(data => {
+        document.getElementById('dreamingToggle').checked = data.dreaming_enabled;
+      });
+  });
+</script>