alive-ai 0.1.12 → 0.1.14

package/README.md

@@ -277,6 +277,12 @@ The real WebUI streams local runtime state over Server-Sent Events and shows:
 - attachment, circadian rhythm, sleepiness, body memory, dreams, curiosity, and conflicts,
 - runtime health through local endpoints.
 
+The WebUI hydrates from durable runtime stores instead of only the current browser session. Chat rows are journaled per active user under `data/users/<user>/webui_chat.jsonl`, with fallback to episodic conversation history. `/state` and the SSE stream now use the same composed snapshot: visible chat, runtime state, soul state, aliveness state, current thoughts, memory counters, and the active dashboard user.
+
+Settings edits validate JSON before saving and write atomically, so a bad edit cannot corrupt the existing config file. The Settings tab also protects unsaved edits while switching tabs.
+
+The WebUI script is intentionally shipped as a single static file because the npm package has to run locally without a frontend build step. `npm run smoke` compiles the Python modules and checks the CLI; release validation also parses the embedded dashboard script and verifies required dashboard hooks so tab navigation, chat, settings, and thought rendering cannot be broken by a syntax error.
+
 GitHub Pages cannot run the Python/FastAPI backend, so the public page includes a static export of the actual WebUI with mocked state:
 
 ```text

package/brain/default_mode.py

@@ -251,7 +251,8 @@ class DefaultModeProcessor:
         if data_path:
             self.data_path = data_path
         else:
-            self.data_path = Path(__file__).parent.parent / "data"
+            from core.paths import data_dir
+            self.data_path = data_dir()
 
         self.data_path.mkdir(parents=True, exist_ok=True)
 

package/cli/check_webui_static.js

@@ -0,0 +1,45 @@
+#!/usr/bin/env node
+const fs = require("fs");
+const path = require("path");
+
+const root = path.resolve(__dirname, "..");
+const htmlPath = path.join(root, "webui", "static", "index.html");
+const manifestPath = path.join(root, "webui", "static", "manifest.json");
+
+const html = fs.readFileSync(htmlPath, "utf8");
+const scriptRegex = /<script\b[^>]*>([\s\S]*?)<\/script>/gi;
+let count = 0;
+for (const match of html.matchAll(scriptRegex)) {
+  count += 1;
+  try {
+    new Function(match[1]);
+  } catch (error) {
+    console.error(`Invalid inline script #${count} in ${path.relative(root, htmlPath)}:`);
+    console.error(error.message);
+    process.exit(1);
+  }
+}
+
+if (count === 0) {
+  console.error(`No inline scripts found in ${path.relative(root, htmlPath)}`);
+  process.exit(1);
+}
+
+JSON.parse(fs.readFileSync(manifestPath, "utf8"));
+for (const page of ["home", "chat", "settings"]) {
+  if (!html.includes(`data-page="${page}"`)) {
+    console.error(`Missing bottom-nav data-page="${page}" hook.`);
+    process.exit(1);
+  }
+  if (!html.includes(`id="page-${page}"`)) {
+    console.error(`Missing page container #page-${page}.`);
+    process.exit(1);
+  }
+}
+for (const required of ["/static/manifest.json", "/static/icon.svg"]) {
+  if (!html.includes(required)) {
+    console.error(`Missing static asset reference: ${required}`);
+    process.exit(1);
+  }
+}
+console.log(`WebUI static check passed (${count} inline script parsed).`);

package/core/message_handler.py

@@ -264,11 +264,11 @@ def _get_or_create_user_memory(self, user_id: str):
     if cache_key in _user_memories:
         return _user_memories[cache_key]
 
-    # Create new memory instance for this user using INSTANCE-SPECIFIC data path
+    # Create new memory instance for this user using the canonical per-user path.
     from brain.memory import Memory
+    from core.user_manager import UserManager
 
-    # Use instance's data path (self.base / "data") for proper isolation
-    instance_data_path = self.base / "data"
+    instance_data_path = UserManager().get_user_paths(user_id)["base"]
 
     memory = Memory(
         nervous=self.nervous,
@@ -462,6 +462,7 @@ async def _process_single_message(self, data: dict):
         if self._subconscious: self._subconscious.register_interaction()
         if chat_id: self._default_chat_id = chat_id
         text = data.get("text", "")
+        message_id = data.get("message_id")
 
         circadian_interaction = {}
         if CIRCADIAN_AVAILABLE:
@@ -786,7 +787,7 @@ async def _process_single_message(self, data: dict):
         # Track if we asked a question (for follow-ups)
         _follow_up.record_message_sent(response)
 
-        await _send_response(self, response, emotion, chat_id, text, user_id)
+        await _send_response(self, response, emotion, chat_id, text, user_id, message_id=message_id)
         if self._subconscious: _feed_learning(self._subconscious, text)
 
         # Actually send the media (we already decided what to send)
@@ -1094,7 +1095,7 @@ IMPORTANT: You are sending this media ALONG with your message. Reference it natu
         return fallback_response(emotion, msg)
 
 
-async def _send_response(self, response, emotion, chat_id, text, user_id="default"):
+async def _send_response(self, response, emotion, chat_id, text, user_id="default", message_id=None):
     mood = emotion.get("mood", "neutral")
 
     # Process any action tags in the response (pass instance config path)
@@ -1123,9 +1124,19 @@ async def _send_response(self, response, emotion, chat_id, text, user_id="defaul
                 "chat_id": chat_id,
                 "fallback_text": response,
                 "mood": mood,
+                "user_id": user_id,
+                "reply_to_message_id": message_id,
+                "source": "runtime",
             })
             return
-    await self.nervous.emit("send_text", {"text": response, "mood": mood, "chat_id": chat_id})
+    await self.nervous.emit("send_text", {
+        "text": response,
+        "mood": mood,
+        "chat_id": chat_id,
+        "user_id": user_id,
+        "reply_to_message_id": message_id,
+        "source": "runtime",
+    })
 
 
 def _process_self_authorship_actions(response: str, user_id: str = "default", self_path: Path = None) -> tuple:

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "alive-ai",
-  "version": "0.1.12",
+  "version": "0.1.14",
   "description": "Local-first emotional AI runtime with memory, impulses, and a live dashboard.",
   "license": "MIT",
   "homepage": "https://vindepemarte.github.io/alive-ai/",
@@ -57,6 +57,6 @@
     "node": ">=18"
   },
   "scripts": {
-    "smoke": "node cli/index.js --help && python3 -m compileall -q alive_ai brain core heart input output skills webui"
+    "smoke": "node cli/index.js --help && node cli/check_webui_static.js && python3 -m compileall -q alive_ai brain core heart input output skills webui"
   }
 }

package/pyproject.toml

@@ -1,6 +1,6 @@
 [project]
 name = "alive-ai-runtime"
-version = "0.1.11"
+version = "0.1.14"
 description = "Local-first emotional AI runtime with memory, impulses, and a live dashboard."
 readme = "README.md"
 requires-python = ">=3.11"

package/webui/app.py

@@ -13,6 +13,12 @@ from fastapi import FastAPI, Request, BackgroundTasks
 from fastapi.responses import HTMLResponse, StreamingResponse, FileResponse, JSONResponse
 from fastapi.staticfiles import StaticFiles
 from core.paths import data_dir, media_dir
+from .persistence import (
+    append_chat_message,
+    load_chat_messages,
+    new_message_id,
+    resolve_active_user_id,
+)
 
 
 app = FastAPI(title="Alive-AI Dashboard")
@@ -245,6 +251,75 @@ aliveness_state = {
 }
 
 
+def _active_user_id(explicit=None) -> str:
+    return resolve_active_user_id(explicit, self_ref=_self_ref, dashboard_state=alive_ai_state)
+
+
+def _runtime_state_dict() -> dict:
+    runtime_state = getattr(_self_ref, "state", None)
+    if runtime_state and hasattr(runtime_state, "to_dict"):
+        try:
+            return runtime_state.to_dict()
+        except Exception:
+            return {}
+    return {}
+
+
+def _runtime_chat_ready() -> bool:
+    nervous = getattr(_self_ref, "nervous", None)
+    listeners = getattr(nervous, "listeners", {}) if nervous else {}
+    # Bridge registers one listener; the runtime handler is attached during Self.start().
+    return len(listeners.get("message_received", [])) > 1
+
+
+def _subconscious_thoughts(limit: int = 10) -> list:
+    thoughts = []
+    sub = getattr(_self_ref, "_subconscious", None)
+    wm = getattr(sub, "working_memory", None)
+    if wm and hasattr(wm, "get_recent_thoughts"):
+        try:
+            for thought in wm.get_recent_thoughts(limit):
+                thoughts.append({
+                    "thought": getattr(thought, "content", ""),
+                    "type": getattr(thought, "type", "reflection"),
+                    "emotion": getattr(thought, "emotion", {}) or {},
+                    "time": _format_time(getattr(thought, "created_at", None)),
+                })
+        except Exception:
+            thoughts = []
+    if thoughts:
+        return thoughts[-limit:]
+    return alive_ai_state.get("recent_thoughts", [])[-limit:]
+
+
+def _format_time(value) -> str:
+    if not value:
+        return datetime.now().strftime("%H:%M:%S")
+    try:
+        if isinstance(value, datetime):
+            return value.strftime("%H:%M:%S")
+        return datetime.fromisoformat(str(value)).strftime("%H:%M:%S")
+    except Exception:
+        text = str(value)
+        return text[11:19] if len(text) >= 19 else text
+
+
+def build_snapshot(user_id: str = None) -> dict:
+    """Compose the dashboard state from live and durable runtime stores."""
+    active_user = _active_user_id(user_id)
+    snapshot = dict(alive_ai_state)
+    snapshot["active_user"] = active_user
+    snapshot["runtime"] = _runtime_state_dict()
+    snapshot["soul"] = soul_state
+    snapshot["aliveness"] = aliveness_state
+    snapshot["conversation"] = load_chat_messages(active_user)
+    thoughts = _subconscious_thoughts()
+    snapshot["recent_thoughts"] = thoughts
+    snapshot["current_thought"] = thoughts[-1]["thought"] if thoughts else alive_ai_state.get("current_thought")
+    snapshot["updated_at"] = datetime.now().isoformat()
+    return snapshot
+
+
 def update_state(data: dict):
     """Called by nervous system to update state"""
     global alive_ai_state
@@ -255,15 +330,24 @@ def update_state(data: dict):
         client.set()
 
 
-def add_conversation(role: str, content: str):
+def add_conversation(role: str, content: str, message_id: str = None,
+                     status: str = "sent", user_id: str = None,
+                     source: str = "runtime"):
     """Add a message to conversation history"""
+    if message_id and any(m.get("message_id") == message_id for m in alive_ai_state["conversation"]):
+        return
     alive_ai_state["conversation"].append({
+        "message_id": message_id or new_message_id(role),
         "role": role,
         "content": content,
-        "time": datetime.now().strftime("%H:%M:%S")
+        "time": datetime.now().strftime("%H:%M:%S"),
+        "status": status,
+        "source": source,
     })
     # Keep last 20 messages
     alive_ai_state["conversation"] = alive_ai_state["conversation"][-20:]
+    if user_id:
+        alive_ai_state["active_user"] = user_id
     if role == "user":
         alive_ai_state["last_user_message"] = content
     else:
@@ -316,7 +400,7 @@ async def event_generator(request: Request):
 
     try:
         # Send initial state
-        yield f"event: state\ndata: {json.dumps(alive_ai_state)}\n\n"
+        yield f"event: state\ndata: {json.dumps(build_snapshot())}\n\n"
 
         while True:
             if await request.is_disconnected():
@@ -331,7 +415,7 @@ async def event_generator(request: Request):
                 continue
 
             # Send updated state
-            yield f"event: state\ndata: {json.dumps(alive_ai_state)}\n\n"
+            yield f"event: state\ndata: {json.dumps(build_snapshot())}\n\n"
     except asyncio.CancelledError:
         pass  # Client disconnected normally
     except Exception as e:
@@ -348,6 +432,13 @@ async def dashboard():
     return HTMLResponse(content=html_path.read_text())
 
 
+@app.get("/favicon.ico")
+async def favicon():
+    """Serve the dashboard icon for browsers that still request /favicon.ico."""
+    icon_path = Path(__file__).parent / "static" / "icon.svg"
+    return FileResponse(icon_path, media_type="image/svg+xml")
+
+
 @app.get("/events")
 async def sse_events(request: Request):
     """SSE endpoint for real-time updates"""
@@ -365,7 +456,7 @@ async def sse_events(request: Request):
 @app.get("/state")
 async def get_state():
     """Get current state (for polling fallback)"""
-    return alive_ai_state
+    return build_snapshot()
 
 
 @app.get("/avatar")
@@ -449,9 +540,10 @@ async def get_memory_status():
 @app.get("/thoughts")
 async def get_thoughts():
     """Get recent thoughts from subconscious"""
+    thoughts = _subconscious_thoughts()
     return {
-        "current_thought": alive_ai_state.get("current_thought"),
-        "recent_thoughts": alive_ai_state.get("recent_thoughts", [])
+        "current_thought": thoughts[-1]["thought"] if thoughts else alive_ai_state.get("current_thought"),
+        "recent_thoughts": thoughts
     }
 
 
@@ -719,7 +811,7 @@ async def get_memory_state():
     # Try to get fresh data from emotional memory system
     try:
         from brain.emotional_memory import get_emotional_memory_system
-        system = get_emotional_memory_system()
+        system = get_emotional_memory_system(_active_user_id())
         stats = system.get_stats()
         recent_high = system.get_recent_high_emotion(hours=24, limit=1)
 
@@ -959,22 +1051,35 @@ async def get_new_aliveness():
 async def chat_endpoint(request: Request, background_tasks: BackgroundTasks):
     data = await request.json()
     text = data.get("text", "").strip()
-    if not text or not _self_ref:
+    if not text or not _self_ref or not _runtime_chat_ready():
         return JSONResponse({"status": "error", "message": "No text or AI not ready"}, 400)
-    # Add user message immediately to conversation
-    add_conversation("user", text)
+    user_id = _active_user_id(data.get("user_id"))
+    message_id = data.get("message_id") or new_message_id("webui_user")
+    append_chat_message(user_id, "user", text, message_id=message_id, status="pending", source="webui")
+    add_conversation("user", text, message_id=message_id, status="pending", user_id=user_id, source="webui")
     update_state({})
-    # Fire message handler in background
+
     async def _send():
-        from core.message_handler import handle_message
-        await handle_message(_self_ref, {
-            "user_id": "webui",
-            "text": text,
-            "chat_id": "webui",
-            "source": "webui"
-        })
+        try:
+            await _self_ref.nervous.emit("message_received", {
+                "message_id": message_id,
+                "user_id": user_id,
+                "webui_user_id": user_id,
+                "text": text,
+                "chat_id": "webui",
+                "source": "webui"
+            })
+        except Exception as e:
+            append_chat_message(
+                user_id,
+                "alive_ai",
+                f"Something went wrong while processing that message: {e}",
+                status="error",
+                source="webui",
+            )
+            update_state({"thinking": False})
     background_tasks.add_task(_send)
-    return JSONResponse({"status": "sent"})
+    return JSONResponse({"status": "sent", "message_id": message_id, "user_id": user_id})
 
 
 @app.get("/api/settings")
@@ -1006,13 +1111,18 @@ async def save_settings(request: Request):
     if fname not in allowed:
         return JSONResponse({"status": "error", "message": "Invalid file"}, 400)
     config_dir = Path(os.environ.get("ALIVE_AI_ROOT", ".")) / "config"
+    config_dir.mkdir(parents=True, exist_ok=True)
     p = config_dir / fname
     content = data.get("content")
     try:
         if fname.endswith(".json"):
-            p.write_text(json.dumps(content, indent=2, ensure_ascii=False))
+            text = json.dumps(content, indent=2, ensure_ascii=False) + "\n"
+            json.loads(text)
         else:
-            p.write_text(content)
+            text = str(content or "")
+        tmp = p.with_suffix(p.suffix + ".tmp")
+        tmp.write_text(text)
+        tmp.replace(p)
         return {"status": "saved"}
     except Exception as e:
         return JSONResponse({"status": "error", "message": str(e)}, 500)

package/webui/bridge.py

@@ -10,6 +10,7 @@ from .app import (
     update_interoceptive_state, update_idle_state, update_bids_state,
     update_memory_state, update_inconsistency_state
 )
+from .persistence import append_chat_message, new_message_id, resolve_active_user_id
 
 _webui_server = None
 
@@ -46,16 +47,25 @@ def init_bridge(nervous, ai=None):
 
     async def on_message_sent(data):
         """Track outgoing messages"""
-        text = data.get("text", "")
-        add_conversation("alive_ai", text)
+        text = data.get("text") or data.get("fallback_text", "")
+        user_id = resolve_active_user_id(data.get("user_id"), dashboard_state=alive_ai_state)
+        message_id = data.get("message_id") or new_message_id("alive_ai")
+        append_chat_message(user_id, "alive_ai", text, message_id=message_id,
+                            status="sent", source=data.get("source", "runtime"))
+        add_conversation("alive_ai", text, message_id=message_id, user_id=user_id,
+                         source=data.get("source", "runtime"))
         alive_ai_state["stats"]["messages"] = alive_ai_state["stats"].get("messages", 0) + 1
         update_state({})
 
     async def on_message_received(data):
         """Track incoming messages"""
         text = data.get("text", "")
-        user_id = data.get("user_id", "unknown")
-        add_conversation("user", text)
+        user_id = resolve_active_user_id(data.get("webui_user_id") or data.get("user_id"), dashboard_state=alive_ai_state)
+        message_id = data.get("message_id") or new_message_id("user")
+        append_chat_message(user_id, "user", text, message_id=message_id,
+                            status="sent", source=data.get("source", "runtime"))
+        add_conversation("user", text, message_id=message_id, user_id=user_id,
+                         source=data.get("source", "runtime"))
         # Track active user
         alive_ai_state["active_user"] = user_id
 

package/webui/persistence.py

@@ -0,0 +1,174 @@
+"""Durable WebUI projection helpers.
+
+The runtime has several durable stores. This module gives the dashboard one
+small journal for visible chat rows and a safe fallback into episodic memory.
+"""
+
+import json
+import os
+import re
+import uuid
+from datetime import datetime
+from pathlib import Path
+from typing import Any, Dict, List, Optional
+
+from core.paths import data_dir
+
+
+_SAFE_ID = re.compile(r"[^A-Za-z0-9_.@-]+")
+
+
+def normalize_user_id(user_id: Any) -> str:
+    raw = str(user_id or "").strip()
+    if not raw:
+        raw = "webui"
+    safe = _SAFE_ID.sub("_", raw).strip("._-")
+    return safe or "webui"
+
+
+def resolve_active_user_id(explicit: Any = None, self_ref: Any = None,
+                           dashboard_state: Optional[Dict[str, Any]] = None) -> str:
+    if explicit:
+        return normalize_user_id(explicit)
+
+    dashboard_state = dashboard_state or {}
+    if dashboard_state.get("active_user"):
+        return normalize_user_id(dashboard_state["active_user"])
+
+    runtime_state = getattr(self_ref, "state", None)
+    if runtime_state and getattr(runtime_state, "user_id", None):
+        return normalize_user_id(runtime_state.user_id)
+
+    owner = os.environ.get("TELEGRAM_OWNER_ID", "")
+    if owner:
+        return normalize_user_id(owner)
+
+    return "webui"
+
+
+def user_base(user_id: str) -> Path:
+    path = data_dir() / "users" / normalize_user_id(user_id)
+    path.mkdir(parents=True, exist_ok=True)
+    return path
+
+
+def chat_journal_path(user_id: str) -> Path:
+    return user_base(user_id) / "webui_chat.jsonl"
+
+
+def new_message_id(prefix: str = "msg") -> str:
+    return f"{prefix}_{uuid.uuid4().hex[:16]}"
+
+
+def _read_jsonl(path: Path) -> List[Dict[str, Any]]:
+    rows: List[Dict[str, Any]] = []
+    if not path.exists():
+        return rows
+    with path.open() as fh:
+        for line in fh:
+            try:
+                row = json.loads(line)
+                if isinstance(row, dict):
+                    rows.append(row)
+            except Exception:
+                continue
+    return rows
+
+
+def append_chat_message(user_id: str, role: str, content: str,
+                        message_id: Optional[str] = None,
+                        status: str = "sent", source: str = "runtime",
+                        metadata: Optional[Dict[str, Any]] = None) -> Dict[str, Any]:
+    message_id = message_id or new_message_id(role)
+    entry = {
+        "message_id": message_id,
+        "role": role,
+        "content": str(content or ""),
+        "status": status,
+        "source": source,
+        "timestamp": datetime.now().isoformat(),
+    }
+    if metadata:
+        entry["metadata"] = metadata
+
+    path = chat_journal_path(user_id)
+    existing = _read_jsonl(path)
+    for idx, row in enumerate(existing):
+        if row.get("message_id") == message_id:
+            merged = {**row, **{k: v for k, v in entry.items() if v not in (None, "")}}
+            existing[idx] = merged
+            tmp = path.with_suffix(path.suffix + ".tmp")
+            with tmp.open("w") as fh:
+                for item in existing:
+                    fh.write(json.dumps(item, ensure_ascii=False) + "\n")
+            tmp.replace(path)
+            return entry
+    with path.open("a") as fh:
+        fh.write(json.dumps(entry, ensure_ascii=False) + "\n")
+    return entry
+
+
+def _format_entry(row: Dict[str, Any]) -> Dict[str, Any]:
+    timestamp = row.get("timestamp") or row.get("created_at") or ""
+    time_label = ""
+    if timestamp:
+        try:
+            time_label = datetime.fromisoformat(timestamp).strftime("%H:%M:%S")
+        except Exception:
+            time_label = str(timestamp)[11:19] if len(str(timestamp)) >= 19 else ""
+    return {
+        "message_id": row.get("message_id") or new_message_id("legacy"),
+        "role": row.get("role", "assistant"),
+        "content": row.get("content", ""),
+        "time": time_label,
+        "timestamp": timestamp,
+        "status": row.get("status", "sent"),
+        "source": row.get("source", "runtime"),
+    }
+
+
+def _load_journal(user_id: str) -> List[Dict[str, Any]]:
+    return [_format_entry(row) for row in _read_jsonl(chat_journal_path(user_id))]
+
+
+def _load_episodic_fallback(user_id: str, limit_turns: int) -> List[Dict[str, Any]]:
+    base = user_base(user_id) / "conversations"
+    legacy = data_dir() / "conversations"
+    conv_dir = base if list(base.glob("*.jsonl")) else legacy
+    if not conv_dir.exists():
+        return []
+
+    turns: List[Dict[str, Any]] = []
+    for file in sorted(conv_dir.glob("*.jsonl"), reverse=True):
+        file_rows = _read_jsonl(file)
+        turns.extend(reversed(file_rows))
+        if len(turns) >= limit_turns:
+            break
+
+    messages: List[Dict[str, Any]] = []
+    for row in reversed(turns[:limit_turns]):
+        ts = row.get("timestamp", "")
+        if row.get("user"):
+            messages.append(_format_entry({
+                "message_id": f"legacy_user_{len(messages)}_{ts}",
+                "role": "user",
+                "content": row.get("user", ""),
+                "timestamp": ts,
+                "source": "episodic",
+            }))
+        if row.get("ai"):
+            messages.append(_format_entry({
+                "message_id": f"legacy_ai_{len(messages)}_{ts}",
+                "role": "alive_ai",
+                "content": row.get("ai", ""),
+                "timestamp": ts,
+                "source": "episodic",
+            }))
+    return messages
+
+
+def load_chat_messages(user_id: str, limit: int = 60) -> List[Dict[str, Any]]:
+    messages = _load_journal(user_id)
+    if not messages:
+        messages = _load_episodic_fallback(user_id, max(1, limit // 2))
+    return messages[-limit:]

package/webui/static/icon.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128">
+  <rect width="128" height="128" rx="28" fill="#10121f"/>
+  <circle cx="64" cy="64" r="42" fill="none" stroke="#00d4ff" stroke-width="8"/>
+  <path d="M39 72c9 14 41 14 50 0" fill="none" stroke="#ff4d9d" stroke-width="8" stroke-linecap="round"/>
+  <circle cx="49" cy="53" r="7" fill="#f7f7fb"/>
+  <circle cx="79" cy="53" r="7" fill="#f7f7fb"/>
+</svg>

package/webui/static/index.html

@@ -4,9 +4,11 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
     <meta name="theme-color" content="#0f0f1a">
+    <meta name="mobile-web-app-capable" content="yes">
     <meta name="apple-mobile-web-app-capable" content="yes">
     <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
     <title>Alive-AI</title>
+    <link rel="icon" href="/static/icon.svg" type="image/svg+xml">
     <link rel="manifest" href="/static/manifest.json">
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
     <style>
@@ -628,11 +630,11 @@
             right: 0;
             background: var(--bg-secondary);
             border-top: 1px solid rgba(255, 255, 255, 0.05);
-            padding: 8px 0;
+            padding: 8px 12px;
             padding-bottom: calc(8px + var(--safe-bottom));
-            display: flex;
-            justify-content: center;
-            gap: 40px;
+            display: grid;
+            grid-template-columns: repeat(3, minmax(0, 1fr));
+            gap: 8px;
             z-index: 100;
         }
 
@@ -645,6 +647,11 @@
             border-radius: 12px;
             transition: all 0.2s;
             cursor: pointer;
+            border: 0;
+            background: transparent;
+            color: var(--text-secondary);
+            font: inherit;
+            min-width: 0;
         }
 
         .nav-item.active {
@@ -1071,7 +1078,8 @@
             padding-bottom: 0;
             display: flex;
             flex-direction: column;
-            height: calc(100vh - 75px - var(--safe-top) - var(--safe-bottom) - 75px);
+            height: calc(100dvh - 75px - var(--safe-top) - var(--safe-bottom) - 75px);
+            min-height: 0;
         }
         
         .page-section {
@@ -1084,11 +1092,13 @@
             display: flex;
             flex-direction: column;
             height: 100%;
+            min-height: 0;
             position: relative;
         }
 
         .chat-messages {
             flex: 1;
+            min-height: 0;
             overflow-y: auto;
             padding: 10px 0;
             display: flex;
@@ -1864,7 +1874,7 @@
                     </div>
                 </div>
                 <div class="chat-input-container" style="display:flex; gap:10px; padding:10px 0; background:var(--bg-primary); border-top:1px solid rgba(255,255,255,0.05); align-items: flex-end;">
-                    <textarea id="chat-input" rows="1" placeholder="Type a message..." style="flex:1; background:var(--bg-card); border:1px solid rgba(255,255,255,0.1); border-radius:20px; padding:10px 16px; color:#fff; font-size:0.9rem; resize:none; font-family:inherit; outline:none; transition:border-color 0.2s;" oninput="this.style.height='auto';this.style.height=this.scrollHeight+'px';"></textarea>
+                    <textarea id="chat-input" rows="1" placeholder="Type a message..." style="flex:1; background:var(--bg-card); border:1px solid rgba(255,255,255,0.1); border-radius:20px; padding:10px 16px; color:#fff; font-size:0.9rem; resize:none; font-family:inherit; outline:none; transition:border-color 0.2s; max-height:120px; overflow-y:auto;"></textarea>
                     <button id="chat-send" class="btn-send" style="background:linear-gradient(135deg,var(--accent-pink),#a55eea); border:none; border-radius:50%; width:42px; height:42px; color:#fff; font-size:1.1rem; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:transform 0.2s, opacity 0.2s; outline:none;">↑</button>
                 </div>
             </div>
@@ -1879,18 +1889,18 @@
         <div id="toast-notification" class="toast-container">Settings saved successfully</div>
 
         <nav class="bottom-nav">
-            <div class="nav-item active">
+            <button type="button" class="nav-item active" data-page="home" aria-selected="true">
                 <span class="nav-icon">🏠</span>
                 <span class="nav-label">Home</span>
-            </div>
-            <div class="nav-item">
+            </button>
+            <button type="button" class="nav-item" data-page="chat" aria-selected="false">
                 <span class="nav-icon">💬</span>
                 <span class="nav-label">Chat</span>
-            </div>
-            <div class="nav-item">
+            </button>
+            <button type="button" class="nav-item" data-page="settings" aria-selected="false">
                 <span class="nav-icon">⚙️</span>
                 <span class="nav-label">Settings</span>
-            </div>
+            </button>
         </nav>
     </div>
 
@@ -1901,8 +1911,6 @@
             'angry': '😤', 'neutral': '😌', 'calm': '😌', 'loving': '💕'
         };
 
-        };
-
         const pages = {
             home: 'page-home',
             chat: 'page-chat',
@@ -1912,16 +1920,39 @@
         let conversationCache = [];
         let isSettingsLoaded = false;
         let isSendingMessage = false;
+        let settingsDirty = false;
+
+        function clampNumber(value, min = 0, max = 1) {
+            const num = Number(value);
+            if (!Number.isFinite(num)) return min;
+            return Math.min(max, Math.max(min, num));
+        }
+
+        function toPct(value, min = 0, max = 1) {
+            return Math.round(((clampNumber(value, min, max) - min) / (max - min)) * 100);
+        }
+
+        function resizeChatInput(inputEl) {
+            if (!inputEl) return;
+            inputEl.style.height = 'auto';
+            inputEl.style.height = Math.min(inputEl.scrollHeight, 120) + 'px';
+        }
 
         // Tab switching
         document.addEventListener('DOMContentLoaded', () => {
             const navItems = document.querySelectorAll('.nav-item');
             const mainEl = document.querySelector('.main');
             
-            navItems.forEach((el, index) => {
+            navItems.forEach((el) => {
                 el.addEventListener('click', () => {
-                    navItems.forEach(item => item.classList.remove('active'));
+                    const requestedPage = el.dataset.page;
+                    if (!requestedPage || !pages[requestedPage]) return;
+                    navItems.forEach(item => {
+                        item.classList.remove('active');
+                        item.setAttribute('aria-selected', 'false');
+                    });
                     el.classList.add('active');
+                    el.setAttribute('aria-selected', 'true');
                     
                     // Hide all pages
                     document.getElementById('page-home').style.display = 'none';
@@ -1929,8 +1960,7 @@
                     document.getElementById('page-settings').style.display = 'none';
                     
                     // Show current page
-                    const pageKeys = Object.keys(pages);
-                    activePage = pageKeys[index];
+                    activePage = requestedPage;
                     const activePageId = pages[activePage];
                     const activeEl = document.getElementById(activePageId);
                     
@@ -1938,12 +1968,15 @@
                         activeEl.style.display = 'flex';
                         mainEl.classList.add('chat-active');
                         scrollChatToBottom();
+                    } else if (activePage === 'settings') {
+                        activeEl.style.display = 'flex';
+                        mainEl.classList.remove('chat-active');
                     } else {
                         activeEl.style.display = 'block';
                         mainEl.classList.remove('chat-active');
                     }
                     
-                    if (activePage === 'settings') {
+                    if (activePage === 'settings' && (!isSettingsLoaded || !settingsDirty)) {
                         loadSettings();
                     }
                 });
@@ -1956,6 +1989,7 @@
                 sendBtn.addEventListener('click', sendMessage);
             }
             if (inputEl) {
+                inputEl.addEventListener('input', () => resizeChatInput(inputEl));
                 inputEl.addEventListener('keydown', (e) => {
                     if (e.key === 'Enter' && !e.shiftKey) {
                         e.preventDefault();
@@ -2044,7 +2078,7 @@
                 const resData = await response.json();
                 if (response.ok && resData.status === 'sent') {
                     inputEl.value = '';
-                    inputEl.style.height = 'auto'; // reset textarea height
+                    resizeChatInput(inputEl);
                 } else {
                     showToast('Failed to send: ' + (resData.message || 'Unknown error'));
                 }
@@ -2063,6 +2097,7 @@
         async function loadSettings() {
             const container = document.getElementById('settings-content');
             if (!container) return;
+            if (settingsDirty) return;
             
             try {
                 container.innerHTML = '<div style="text-align:center;color:var(--text-secondary);padding:20px;">Loading settings...</div>';
@@ -2081,8 +2116,7 @@
         function renderSettings(settingsData) {
             const container = document.getElementById('settings-content');
             if (!container) return;
-            
-            let html = '';
+            container.replaceChildren();
             Object.entries(settingsData).forEach(([filename, fileData]) => {
                 let contentStr = '';
                 if (fileData.type === 'json') {
@@ -2090,25 +2124,50 @@
                 } else {
                     contentStr = fileData.content;
                 }
-                
-                html += `
-                <div class="section settings-card">
-                    <div class="settings-header-btn-row">
-                        <div class="settings-file-title">⚙️ ${filename}</div>
-                        <button class="btn-save btn-action" data-file="${filename}" onclick="saveFileSettings('${filename}')">Save</button>
-                    </div>
-                    <div class="settings-grid">
-                        <textarea class="settings-textarea" data-file="${filename}" oninput="validateJSONInput(this, '${filename}')" spellcheck="false">${escapeHtml(contentStr)}</textarea>
-                    </div>
-                </div>
-                `;
+
+                const card = document.createElement('div');
+                card.className = 'section settings-card';
+
+                const header = document.createElement('div');
+                header.className = 'settings-header-btn-row';
+
+                const title = document.createElement('div');
+                title.className = 'settings-file-title';
+                title.textContent = `⚙️ ${filename}`;
+
+                const saveBtn = document.createElement('button');
+                saveBtn.className = 'btn-save btn-action';
+                saveBtn.type = 'button';
+                saveBtn.dataset.file = filename;
+                saveBtn.textContent = 'Save';
+
+                const grid = document.createElement('div');
+                grid.className = 'settings-grid';
+
+                const textarea = document.createElement('textarea');
+                textarea.className = 'settings-textarea';
+                textarea.dataset.file = filename;
+                textarea.spellcheck = false;
+                textarea.value = contentStr || '';
+                textarea.addEventListener('input', () => {
+                    settingsDirty = true;
+                    validateJSONInput(textarea, filename);
+                });
+                saveBtn.addEventListener('click', () => saveFileSettings(filename));
+
+                header.append(title, saveBtn);
+                grid.appendChild(textarea);
+                card.append(header, grid);
+                container.appendChild(card);
+                validateJSONInput(textarea, filename);
             });
-            container.innerHTML = html;
+            settingsDirty = false;
         }
 
         // Real-time JSON validation
         function validateJSONInput(textarea, filename) {
-            const btn = document.querySelector(`.btn-save[data-file="${filename}"]`);
+            const btn = Array.from(document.querySelectorAll('.btn-save'))
+                .find(el => el.dataset.file === filename);
             let errorEl = textarea.parentNode.querySelector('.json-error-msg');
             
             if (!errorEl) {
@@ -2141,7 +2200,8 @@
 
         // Settings saving
         async function saveFileSettings(filename) {
-            const textarea = document.querySelector(`.settings-textarea[data-file="${filename}"]`);
+            const textarea = Array.from(document.querySelectorAll('.settings-textarea'))
+                .find(el => el.dataset.file === filename);
             if (!textarea) return;
             
             let parsedContent;
@@ -2156,7 +2216,8 @@
                 parsedContent = textarea.value;
             }
             
-            const btn = document.querySelector(`.btn-save[data-file="${filename}"]`);
+            const btn = Array.from(document.querySelectorAll('.btn-save'))
+                .find(el => el.dataset.file === filename);
             if (btn) {
                 btn.disabled = true;
                 btn.textContent = 'Saving...';
@@ -2173,6 +2234,7 @@
                 });
                 const resData = await response.json();
                 if (response.ok && resData.status === 'saved') {
+                    settingsDirty = false;
                     showToast(`${filename} saved successfully!`);
                 } else {
                     showToast(`Failed to save: ${resData.message || 'Unknown error'}`);
@@ -2223,7 +2285,7 @@
 
             // Emotions - all 17 emotions
             ['arousal', 'desire', 'love', 'joy', 'sadness', 'trust', 'fear', 'anger', 'boredom', 'guilt', 'pride', 'jealousy', 'embarrassment', 'anticipation', 'hope', 'dread'].forEach(em => {
-                const val = Math.round((data[em] || 0) * 100);
+                const val = toPct(data[em]);
                 const valEl = document.getElementById(`val-${em}`);
                 const barEl = document.getElementById(`bar-${em}`);
                 if (valEl) valEl.textContent = `${val}%`;
@@ -2254,22 +2316,26 @@
             }
 
             // Recent thoughts (subconscious impulses)
-            if (data.recent_thoughts && data.recent_thoughts.length > 0) {
-                const historyEl = document.getElementById('thought-history');
-                if (historyEl) {
+            const historyEl = document.getElementById('thought-history');
+            if (historyEl) {
+                if (data.recent_thoughts && data.recent_thoughts.length > 0) {
                     historyEl.innerHTML = data.recent_thoughts.slice(-5).reverse().map(t =>
-                        `<div class="thought-entry"><span class="thought-time">${t.time || ''}</span> <span class="thought-type">${t.type || ''}</span> ${escapeHtml(t.thought || '')}</div>`
+                        `<div class="thought-entry"><span class="thought-time">${escapeHtml(t.time || '')}</span> <span class="thought-type">${escapeHtml(t.type || t.thought_type || '')}</span> ${escapeHtml(t.thought || t.content || '')}</div>`
                     ).join('');
+                } else {
+                    historyEl.innerHTML = '<div class="thought-entry empty">No recent thoughts yet</div>';
                 }
             }
 
             // Status flags
+            const flagEl = document.getElementById('status-flags');
             if (data.is_high_desire || data.is_in_love) {
                 let flags = [];
                 if (data.is_in_love) flags.push('In Love');
                 if (data.is_high_desire) flags.push('High desire');
-                const flagEl = document.getElementById('status-flags');
                 if (flagEl) flagEl.textContent = flags.join(' + ');
+            } else if (flagEl) {
+                flagEl.textContent = '';
             }
         }
 
@@ -2311,10 +2377,10 @@
         function updateHormone(name, value) {
             const chip = document.getElementById(`hormone-${name}`);
             const valEl = document.getElementById(`val-${name}`);
-            const pct = Math.round(value * 100);
+            const pct = toPct(value);
             if (valEl) valEl.textContent = `${pct}%`;
             if (chip) {
-                chip.classList.toggle('elevated', value > 0.6);
+                chip.classList.toggle('elevated', clampNumber(value) > 0.6);
             }
         }
 
@@ -2335,19 +2401,18 @@
                 const state = states[stateName];
                 if (!state) continue;
 
-                const value = state.current_value;
+	                const value = clampNumber(state.current_value, config.min, config.max);
                 const valEl = document.getElementById(`val-${stateName.replace(/_/g, '-')}`);
                 const barEl = document.getElementById(`bar-${stateName.replace(/_/g, '-')}`);
 
                 if (valEl && barEl) {
                     if (config.min < 0) {
-                        const displayVal = value >= 0 ? `+${Math.round(value * 100)}%` : `${Math.round(value * 100)}%`;
-                        valEl.textContent = displayVal;
-                        const barWidth = ((value - config.min) / (config.max - config.min)) * 100;
-                        barEl.style.width = `${barWidth}%`;
-                    } else {
-                        valEl.textContent = `${Math.round(value * 100)}%`;
-                        barEl.style.width = `${value * 100}%`;
+	                        const displayVal = value >= 0 ? `+${Math.round(value * 100)}%` : `${Math.round(value * 100)}%`;
+	                        valEl.textContent = displayVal;
+	                        barEl.style.width = `${toPct(value, config.min, config.max)}%`;
+	                    } else {
+	                        valEl.textContent = `${toPct(value)}%`;
+	                        barEl.style.width = `${toPct(value)}%`;
                     }
                 }
             }
@@ -2364,13 +2429,13 @@
             if (!data) return;
 
             const thoughtsEl = document.getElementById('idle-thoughts');
-            if (thoughtsEl && data.recent_thoughts && data.recent_thoughts.length > 0) {
-                thoughtsEl.innerHTML = data.recent_thoughts.slice(0, 5).map(t => `
-                    <div class="idle-thought">
-                        <div class="thought-type">${t.thought_type || 'thought'}</div>
-                        ${escapeHtml(t.content || t.thought || '')}
-                    </div>
-                `).join('');
+	            if (thoughtsEl && data.recent_thoughts && data.recent_thoughts.length > 0) {
+	                thoughtsEl.innerHTML = data.recent_thoughts.slice(0, 5).map(t => `
+	                    <div class="idle-thought">
+	                        <div class="thought-type">${escapeHtml(t.thought_type || t.type || 'thought')}</div>
+	                        ${escapeHtml(t.content || t.thought || '')}
+	                    </div>
+	                `).join('');
             } else if (thoughtsEl) {
                 thoughtsEl.innerHTML = '<div class="idle-empty">No recent background thoughts...</div>';
             }
@@ -2387,9 +2452,16 @@
             const conflicts = data.active_conflicts || data.conflicts || [];
             const count = data.count || conflicts.length;
 
-            if (badgeEl) {
-                badgeEl.textContent = count;
-            }
+	            if (badgeEl) {
+	                badgeEl.textContent = count;
+	            }
+
+	            const tendencyEl = document.getElementById('tendency-badge');
+	            if (tendencyEl) {
+	                const tendency = String(data.behavioral_tendency || 'neutral').toLowerCase();
+	                tendencyEl.textContent = tendency.replace(/_/g, ' ');
+	                tendencyEl.className = 'tendency-badge ' + tendency;
+	            }
 
             if (conflictsEl && conflicts.length > 0) {
                 conflictsEl.innerHTML = conflicts.slice(0, 5).map(c => {
@@ -2399,7 +2471,7 @@
                     const fear = c.fear || c.side_b || '';
                     // Support both 'tension' (inconsistency API) and 'tension_level' (soul API)
                     const rawTension = c.tension_level !== undefined ? c.tension_level : (c.tension !== undefined ? c.tension : c.intensity || 0);
-                    const tension = Math.round(rawTension * 100);
+	                    const tension = toPct(rawTension);
 
                     return `
                     <div class="conflict-item">
@@ -2505,15 +2577,15 @@
             badge.className = 'circadian-sleep-badge ' + (sleeping ? 'sleeping' : 'awake');
             document.getElementById('circadian-sleep-text').textContent = sleeping ? 'Sleeping' : 'Awake';
 
-            const debt = Math.round((c.sleep_debt || 0) * 100);
+	            const debt = toPct(c.sleep_debt, 0, 2);
             document.getElementById('circadian-debt-val').textContent = debt + '%';
             document.getElementById('circadian-debt-bar').style.width = debt + '%';
 
-            const mods = c.modifiers || {};
-            ['energy', 'inhibition', 'warmth', 'verbosity'].forEach(m => {
-                const el = document.getElementById('circadian-mod-' + m);
-                if (el) el.textContent = Math.round((mods[m] || 0) * 100) + '%';
-            });
+	            const mods = c.modifiers || {};
+	            ['energy', 'inhibition', 'warmth', 'verbosity'].forEach(m => {
+	                const el = document.getElementById('circadian-mod-' + m);
+	                if (el) el.textContent = toPct(mods[m]) + '%';
+	            });
         }
 
         function updateAttachmentUI(a) {
@@ -2527,7 +2599,7 @@
             badge.className = 'attachment-style-badge ' + style;
 
             // Fix: API returns 'security', not 'security_score'
-            const score = Math.round((a.security || a.security_score || 0) * 100);
+	            const score = toPct(a.security || a.security_score);
             document.getElementById('attachment-security-val').textContent = score + '%';
             document.getElementById('attachment-security-bar').style.width = score + '%';
 
@@ -2567,7 +2639,7 @@
                 html += '<div class="body-memory-list">';
                 afterglowList.forEach(a => {
                     const icon = afterglowIcons[a.type] || '✨';
-                    const intensity = Math.round((a.intensity || 0) * 100);
+	                    const intensity = toPct(a.intensity);
                     const ago = a.hours_ago ? a.hours_ago.toFixed(1) + 'h ago' : '';
                     html += `<div class="body-memory-item">
                         <span class="body-memory-icon">${icon}</span>
@@ -2584,7 +2656,7 @@
             if (hasPhantom) {
                 html += '<div class="body-memory-sub-header">Phantom Sensations</div><div class="body-memory-list">';
                 phantomList.forEach(p => {
-                    const intensity = Math.round((p.intensity || 0) * 100);
+	                    const intensity = toPct(p.intensity);
                     html += `<div class="body-memory-item">
                         <span class="body-memory-icon">👻</span>
                         <div class="body-memory-content">
@@ -2643,7 +2715,7 @@
             topicsArray.sort((a, b) => a.level - b.level);
 
             grid.innerHTML = topicsArray.map(t => {
-                const knowledge = Math.round((t.level || 0) * 100);
+	                const knowledge = toPct(t.level);
                 const curiosityLevel = 100 - knowledge;  // Invert: less knowledge = more curious
                 const emoji = curiosityLevel > 80 ? '🤔' : curiosityLevel > 50 ? '💭' : '✓';
                 return `<div class="curiosity-chip">

package/webui/static/manifest.json

@@ -0,0 +1,18 @@
+{
+  "name": "Alive-AI WebUI",
+  "short_name": "Alive-AI",
+  "description": "Local dashboard for Alive-AI runtime state, chat, thoughts, emotions, and settings.",
+  "start_url": "/",
+  "scope": "/",
+  "display": "standalone",
+  "background_color": "#10121f",
+  "theme_color": "#00d4ff",
+  "icons": [
+    {
+      "src": "/static/icon.svg",
+      "sizes": "any",
+      "type": "image/svg+xml",
+      "purpose": "any maskable"
+    }
+  ]
+}