feat(webui): replace TUI with full web UI + local openbox desktop

- Remove audit/internal/tui/ (~3000 LOC, bubbletea/lipgloss/reanimator deps) - Add /api/* REST+SSE endpoints: audit, SAT (nvidia/memory/storage/cpu), services, network, export, tools, live metrics stream - Add async job manager with SSE streaming for long-running operations - Add platform.SampleLiveMetrics() for live fan/temp/power/GPU polling - Add multi-page web UI (vanilla JS): Dashboard, Metrics charts, Tests, Burn-in, Network, Services, Export, Tools - Add bee-desktop.service: openbox + Xorg + Chromium opening http://localhost/ - Add openbox/tint2/xorg/xinit/xterm/chromium to ISO package list - Update .profile, bee.sh, and bible-local docs Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-03-27 19:21:14 +03:00
parent ed1cceed8c
commit 004cc4910d
34 changed files with 1568 additions and 3431 deletions
--- a/audit/internal/webui/api.go
+++ b/audit/internal/webui/api.go
@@ -0,0 +1,433 @@
+package webui
+
+import (
+	"bufio"
+	"context"
+	"encoding/json"
+	"fmt"
+	"io"
+	"net/http"
+	"os/exec"
+	"path/filepath"
+	"strings"
+	"sync/atomic"
+	"time"
+
+	"bee/audit/internal/app"
+	"bee/audit/internal/platform"
+)
+
+// ── Job ID counter ────────────────────────────────────────────────────────────
+
+var jobCounter atomic.Uint64
+
+func newJobID(prefix string) string {
+	return fmt.Sprintf("%s-%d", prefix, jobCounter.Add(1))
+}
+
+// ── SSE helpers ───────────────────────────────────────────────────────────────
+
+func sseWrite(w http.ResponseWriter, event, data string) bool {
+	f, ok := w.(http.Flusher)
+	if !ok {
+		return false
+	}
+	if event != "" {
+		fmt.Fprintf(w, "event: %s\n", event)
+	}
+	fmt.Fprintf(w, "data: %s\n\n", data)
+	f.Flush()
+	return true
+}
+
+func sseStart(w http.ResponseWriter) bool {
+	_, ok := w.(http.Flusher)
+	if !ok {
+		http.Error(w, "streaming not supported", http.StatusInternalServerError)
+		return false
+	}
+	w.Header().Set("Content-Type", "text/event-stream")
+	w.Header().Set("Cache-Control", "no-cache")
+	w.Header().Set("Connection", "keep-alive")
+	w.Header().Set("Access-Control-Allow-Origin", "*")
+	return true
+}
+
+// streamJob streams lines from a jobState to a SSE response.
+func streamJob(w http.ResponseWriter, r *http.Request, j *jobState) {
+	if !sseStart(w) {
+		return
+	}
+	existing, ch := j.subscribe()
+	for _, line := range existing {
+		sseWrite(w, "", line)
+	}
+	if ch == nil {
+		// Job already finished
+		sseWrite(w, "done", j.err)
+		return
+	}
+	for {
+		select {
+		case line, ok := <-ch:
+			if !ok {
+				sseWrite(w, "done", j.err)
+				return
+			}
+			sseWrite(w, "", line)
+		case <-r.Context().Done():
+			return
+		}
+	}
+}
+
+// runCmdJob runs an exec.Cmd as a background job, streaming stdout+stderr lines.
+func runCmdJob(j *jobState, cmd *exec.Cmd) {
+	pr, pw := io.Pipe()
+	cmd.Stdout = pw
+	cmd.Stderr = pw
+
+	if err := cmd.Start(); err != nil {
+		j.finish(err.Error())
+		return
+	}
+
+	go func() {
+		scanner := bufio.NewScanner(pr)
+		for scanner.Scan() {
+			j.append(scanner.Text())
+		}
+	}()
+
+	err := cmd.Wait()
+	_ = pw.Close()
+	if err != nil {
+		j.finish(err.Error())
+	} else {
+		j.finish("")
+	}
+}
+
+// ── Audit ─────────────────────────────────────────────────────────────────────
+
+func (h *handler) handleAPIAuditRun(w http.ResponseWriter, r *http.Request) {
+	if h.opts.App == nil {
+		writeError(w, http.StatusServiceUnavailable, "app not configured")
+		return
+	}
+	id := newJobID("audit")
+	j := globalJobs.create(id)
+	go func() {
+		j.append("Running audit...")
+		result, err := h.opts.App.RunAuditNow(h.opts.RuntimeMode)
+		if err != nil {
+			j.append("ERROR: " + err.Error())
+			j.finish(err.Error())
+			return
+		}
+		for _, line := range strings.Split(result.Body, "\n") {
+			if line != "" {
+				j.append(line)
+			}
+		}
+		j.finish("")
+	}()
+	writeJSON(w, map[string]string{"job_id": id})
+}
+
+func (h *handler) handleAPIAuditStream(w http.ResponseWriter, r *http.Request) {
+	id := r.URL.Query().Get("job_id")
+	j, ok := globalJobs.get(id)
+	if !ok {
+		http.Error(w, "job not found", http.StatusNotFound)
+		return
+	}
+	streamJob(w, r, j)
+}
+
+// ── SAT ───────────────────────────────────────────────────────────────────────
+
+func (h *handler) handleAPISATRun(target string) http.HandlerFunc {
+	return func(w http.ResponseWriter, r *http.Request) {
+		if h.opts.App == nil {
+			writeError(w, http.StatusServiceUnavailable, "app not configured")
+			return
+		}
+		id := newJobID("sat-" + target)
+		j := globalJobs.create(id)
+
+		go func() {
+			j.append(fmt.Sprintf("Starting %s acceptance test...", target))
+			var (
+				archive string
+				err     error
+			)
+
+			// Parse optional parameters
+			var body struct {
+				Duration   int   `json:"duration"`
+				DiagLevel  int   `json:"diag_level"`
+				GPUIndices []int `json:"gpu_indices"`
+			}
+			body.DiagLevel = 1
+			if r.ContentLength > 0 {
+				_ = json.NewDecoder(r.Body).Decode(&body)
+			}
+
+			switch target {
+			case "nvidia":
+				if len(body.GPUIndices) > 0 || body.DiagLevel > 0 {
+					result, e := h.opts.App.RunNvidiaAcceptancePackWithOptions(
+						context.Background(), "", body.DiagLevel, body.GPUIndices,
+					)
+					if e != nil {
+						err = e
+					} else {
+						archive = result.Body
+					}
+				} else {
+					archive, err = h.opts.App.RunNvidiaAcceptancePack("")
+				}
+			case "memory":
+				archive, err = h.opts.App.RunMemoryAcceptancePack("")
+			case "storage":
+				archive, err = h.opts.App.RunStorageAcceptancePack("")
+			case "cpu":
+				dur := body.Duration
+				if dur <= 0 {
+					dur = 60
+				}
+				archive, err = h.opts.App.RunCPUAcceptancePack("", dur)
+			}
+
+			if err != nil {
+				j.append("ERROR: " + err.Error())
+				j.finish(err.Error())
+				return
+			}
+			j.append(fmt.Sprintf("Archive written: %s", archive))
+			j.finish("")
+		}()
+
+		writeJSON(w, map[string]string{"job_id": id})
+	}
+}
+
+func (h *handler) handleAPISATStream(w http.ResponseWriter, r *http.Request) {
+	id := r.URL.Query().Get("job_id")
+	j, ok := globalJobs.get(id)
+	if !ok {
+		http.Error(w, "job not found", http.StatusNotFound)
+		return
+	}
+	streamJob(w, r, j)
+}
+
+// ── Services ──────────────────────────────────────────────────────────────────
+
+func (h *handler) handleAPIServicesList(w http.ResponseWriter, r *http.Request) {
+	if h.opts.App == nil {
+		writeError(w, http.StatusServiceUnavailable, "app not configured")
+		return
+	}
+	names, err := h.opts.App.ListBeeServices()
+	if err != nil {
+		writeError(w, http.StatusInternalServerError, err.Error())
+		return
+	}
+	type serviceInfo struct {
+		Name   string `json:"name"`
+		Status string `json:"status"`
+	}
+	result := make([]serviceInfo, 0, len(names))
+	for _, name := range names {
+		status, _ := h.opts.App.ServiceStatus(name)
+		result = append(result, serviceInfo{Name: name, Status: status})
+	}
+	writeJSON(w, result)
+}
+
+func (h *handler) handleAPIServicesAction(w http.ResponseWriter, r *http.Request) {
+	if h.opts.App == nil {
+		writeError(w, http.StatusServiceUnavailable, "app not configured")
+		return
+	}
+	var req struct {
+		Name   string `json:"name"`
+		Action string `json:"action"`
+	}
+	if err := json.NewDecoder(r.Body).Decode(&req); err != nil {
+		writeError(w, http.StatusBadRequest, "invalid request body")
+		return
+	}
+	var action platform.ServiceAction
+	switch req.Action {
+	case "start":
+		action = platform.ServiceStart
+	case "stop":
+		action = platform.ServiceStop
+	case "restart":
+		action = platform.ServiceRestart
+	default:
+		writeError(w, http.StatusBadRequest, "action must be start|stop|restart")
+		return
+	}
+	result, err := h.opts.App.ServiceActionResult(req.Name, action)
+	if err != nil {
+		writeError(w, http.StatusInternalServerError, err.Error())
+		return
+	}
+	writeJSON(w, map[string]string{"status": "ok", "output": result.Body})
+}
+
+// ── Network ───────────────────────────────────────────────────────────────────
+
+func (h *handler) handleAPINetworkStatus(w http.ResponseWriter, r *http.Request) {
+	if h.opts.App == nil {
+		writeError(w, http.StatusServiceUnavailable, "app not configured")
+		return
+	}
+	ifaces, err := h.opts.App.ListInterfaces()
+	if err != nil {
+		writeError(w, http.StatusInternalServerError, err.Error())
+		return
+	}
+	writeJSON(w, map[string]any{
+		"interfaces":    ifaces,
+		"default_route": h.opts.App.DefaultRoute(),
+	})
+}
+
+func (h *handler) handleAPINetworkDHCP(w http.ResponseWriter, r *http.Request) {
+	if h.opts.App == nil {
+		writeError(w, http.StatusServiceUnavailable, "app not configured")
+		return
+	}
+	var req struct {
+		Interface string `json:"interface"`
+	}
+	_ = json.NewDecoder(r.Body).Decode(&req)
+
+	var result app.ActionResult
+	var err error
+	if req.Interface == "" || req.Interface == "all" {
+		result, err = h.opts.App.DHCPAllResult()
+	} else {
+		result, err = h.opts.App.DHCPOneResult(req.Interface)
+	}
+	if err != nil {
+		writeError(w, http.StatusInternalServerError, err.Error())
+		return
+	}
+	writeJSON(w, map[string]string{"status": "ok", "output": result.Body})
+}
+
+func (h *handler) handleAPINetworkStatic(w http.ResponseWriter, r *http.Request) {
+	if h.opts.App == nil {
+		writeError(w, http.StatusServiceUnavailable, "app not configured")
+		return
+	}
+	var req struct {
+		Interface string   `json:"interface"`
+		Address   string   `json:"address"`
+		Prefix    string   `json:"prefix"`
+		Gateway   string   `json:"gateway"`
+		DNS       []string `json:"dns"`
+	}
+	if err := json.NewDecoder(r.Body).Decode(&req); err != nil {
+		writeError(w, http.StatusBadRequest, "invalid request body")
+		return
+	}
+	cfg := platform.StaticIPv4Config{
+		Interface: req.Interface,
+		Address:   req.Address,
+		Prefix:    req.Prefix,
+		Gateway:   req.Gateway,
+		DNS:       req.DNS,
+	}
+	result, err := h.opts.App.SetStaticIPv4Result(cfg)
+	if err != nil {
+		writeError(w, http.StatusInternalServerError, err.Error())
+		return
+	}
+	writeJSON(w, map[string]string{"status": "ok", "output": result.Body})
+}
+
+// ── Export ────────────────────────────────────────────────────────────────────
+
+func (h *handler) handleAPIExportList(w http.ResponseWriter, r *http.Request) {
+	entries, err := listExportFiles(h.opts.ExportDir)
+	if err != nil {
+		writeError(w, http.StatusInternalServerError, err.Error())
+		return
+	}
+	writeJSON(w, entries)
+}
+
+func (h *handler) handleAPIExportBundle(w http.ResponseWriter, r *http.Request) {
+	archive, err := app.BuildSupportBundle(h.opts.ExportDir)
+	if err != nil {
+		writeError(w, http.StatusInternalServerError, err.Error())
+		return
+	}
+	writeJSON(w, map[string]string{
+		"status": "ok",
+		"path":   archive,
+		"url":    "/export/support.tar.gz",
+	})
+}
+
+// ── Tools ─────────────────────────────────────────────────────────────────────
+
+var standardTools = []string{
+	"dmidecode", "smartctl", "nvme", "lspci", "ipmitool",
+	"nvidia-smi", "memtester", "stress-ng", "nvtop",
+	"mstflint", "qrencode",
+}
+
+func (h *handler) handleAPIToolsCheck(w http.ResponseWriter, r *http.Request) {
+	if h.opts.App == nil {
+		writeError(w, http.StatusServiceUnavailable, "app not configured")
+		return
+	}
+	statuses := h.opts.App.CheckTools(standardTools)
+	writeJSON(w, statuses)
+}
+
+// ── Preflight ─────────────────────────────────────────────────────────────────
+
+func (h *handler) handleAPIPreflight(w http.ResponseWriter, r *http.Request) {
+	data, err := loadSnapshot(filepath.Join(h.opts.ExportDir, "runtime-health.json"))
+	if err != nil {
+		writeError(w, http.StatusNotFound, "runtime health not found")
+		return
+	}
+	w.Header().Set("Content-Type", "application/json; charset=utf-8")
+	w.Header().Set("Cache-Control", "no-store")
+	_, _ = w.Write(data)
+}
+
+// ── Metrics SSE ───────────────────────────────────────────────────────────────
+
+func (h *handler) handleAPIMetricsStream(w http.ResponseWriter, r *http.Request) {
+	if !sseStart(w) {
+		return
+	}
+	ticker := time.NewTicker(time.Second)
+	defer ticker.Stop()
+	for {
+		select {
+		case <-r.Context().Done():
+			return
+		case <-ticker.C:
+			sample := platform.SampleLiveMetrics()
+			b, err := json.Marshal(sample)
+			if err != nil {
+				continue
+			}
+			if !sseWrite(w, "metrics", string(b)) {
+				return
+			}
+		}
+	}
+}
--- a/audit/internal/webui/jobs.go
+++ b/audit/internal/webui/jobs.go
@@ -0,0 +1,84 @@
+package webui
+
+import (
+	"sync"
+	"time"
+)
+
+// jobState holds the output lines and completion status of an async job.
+type jobState struct {
+	lines []string
+	done  bool
+	err   string
+	mu    sync.Mutex
+	// subs is a list of channels that receive new lines as they arrive.
+	subs []chan string
+}
+
+func (j *jobState) append(line string) {
+	j.mu.Lock()
+	defer j.mu.Unlock()
+	j.lines = append(j.lines, line)
+	for _, ch := range j.subs {
+		select {
+		case ch <- line:
+		default:
+		}
+	}
+}
+
+func (j *jobState) finish(errMsg string) {
+	j.mu.Lock()
+	defer j.mu.Unlock()
+	j.done = true
+	j.err = errMsg
+	for _, ch := range j.subs {
+		close(ch)
+	}
+	j.subs = nil
+}
+
+// subscribe returns a channel that receives all future lines.
+// Existing lines are returned first, then the channel streams new ones.
+func (j *jobState) subscribe() ([]string, <-chan string) {
+	j.mu.Lock()
+	defer j.mu.Unlock()
+	existing := make([]string, len(j.lines))
+	copy(existing, j.lines)
+	if j.done {
+		return existing, nil
+	}
+	ch := make(chan string, 256)
+	j.subs = append(j.subs, ch)
+	return existing, ch
+}
+
+// jobManager manages async jobs identified by string IDs.
+type jobManager struct {
+	mu   sync.Mutex
+	jobs map[string]*jobState
+}
+
+var globalJobs = &jobManager{jobs: make(map[string]*jobState)}
+
+func (m *jobManager) create(id string) *jobState {
+	m.mu.Lock()
+	defer m.mu.Unlock()
+	j := &jobState{}
+	m.jobs[id] = j
+	// Schedule cleanup after 30 minutes
+	go func() {
+		time.Sleep(30 * time.Minute)
+		m.mu.Lock()
+		delete(m.jobs, id)
+		m.mu.Unlock()
+	}()
+	return j
+}
+
+func (m *jobManager) get(id string) (*jobState, bool) {
+	m.mu.Lock()
+	defer m.mu.Unlock()
+	j, ok := m.jobs[id]
+	return j, ok
+}
--- a/audit/internal/webui/pages.go
+++ b/audit/internal/webui/pages.go
@@ -0,0 +1,719 @@
+package webui
+
+import (
+	"encoding/json"
+	"fmt"
+	"html"
+	"net/url"
+	"os"
+	"path/filepath"
+	"sort"
+	"strings"
+)
+
+// ── Layout ────────────────────────────────────────────────────────────────────
+
+func layoutHead(title string) string {
+	return `<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width,initial-scale=1">
+<title>` + html.EscapeString(title) + `</title>
+<style>
+*{box-sizing:border-box;margin:0;padding:0}
+body{font-family:system-ui,-apple-system,sans-serif;background:#0f1117;color:#e2e8f0;display:flex;min-height:100vh}
+a{color:inherit;text-decoration:none}
+/* Sidebar */
+.sidebar{width:200px;min-height:100vh;background:#161b25;border-right:1px solid #252d3d;flex-shrink:0;display:flex;flex-direction:column}
+.sidebar-logo{padding:20px 16px 12px;font-size:20px;font-weight:700;color:#60a5fa;letter-spacing:-0.5px}
+.sidebar-logo span{color:#94a3b8;font-weight:400;font-size:13px;display:block;margin-top:2px}
+.nav{flex:1}
+.nav-item{display:block;padding:10px 16px;color:#94a3b8;font-size:14px;border-left:3px solid transparent;transition:all .15s}
+.nav-item:hover,.nav-item.active{background:#1e2535;color:#e2e8f0;border-left-color:#3b82f6}
+.nav-icon{margin-right:8px;opacity:.7}
+/* Content */
+.main{flex:1;display:flex;flex-direction:column;overflow:auto}
+.topbar{padding:16px 24px;border-bottom:1px solid #1e2535;display:flex;align-items:center;gap:12px}
+.topbar h1{font-size:18px;font-weight:600}
+.content{padding:24px;flex:1}
+/* Cards */
+.card{background:#161b25;border:1px solid #1e2535;border-radius:10px;margin-bottom:16px}
+.card-head{padding:14px 18px;border-bottom:1px solid #1e2535;font-weight:600;font-size:14px;display:flex;align-items:center;gap:8px}
+.card-body{padding:18px}
+/* Buttons */
+.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;border:none;transition:background .15s}
+.btn-primary{background:#3b82f6;color:#fff}.btn-primary:hover{background:#2563eb}
+.btn-danger{background:#ef4444;color:#fff}.btn-danger:hover{background:#dc2626}
+.btn-secondary{background:#1e2535;color:#94a3b8;border:1px solid #252d3d}.btn-secondary:hover{background:#252d3d;color:#e2e8f0}
+.btn-sm{padding:5px 10px;font-size:12px}
+/* Tables */
+table{width:100%;border-collapse:collapse;font-size:13px}
+th{text-align:left;padding:8px 12px;color:#64748b;font-weight:600;border-bottom:1px solid #1e2535}
+td{padding:8px 12px;border-bottom:1px solid #1a2030}
+tr:last-child td{border:none}
+tr:hover td{background:#1a2030}
+/* Status badges */
+.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600}
+.badge-ok{background:#166534;color:#86efac}
+.badge-warn{background:#713f12;color:#fde68a}
+.badge-err{background:#7f1d1d;color:#fca5a5}
+.badge-unknown{background:#1e293b;color:#64748b}
+/* Output terminal */
+.terminal{background:#0a0d14;border:1px solid #1e2535;border-radius:8px;padding:14px;font-family:monospace;font-size:12px;color:#86efac;max-height:400px;overflow-y:auto;white-space:pre-wrap;word-break:break-all}
+/* Forms */
+.form-row{margin-bottom:14px}
+.form-row label{display:block;font-size:12px;color:#64748b;margin-bottom:5px}
+.form-row input,.form-row select{width:100%;padding:8px 10px;background:#0f1117;border:1px solid #252d3d;border-radius:6px;color:#e2e8f0;font-size:13px;outline:none}
+.form-row input:focus,.form-row select:focus{border-color:#3b82f6}
+/* Metrics chart */
+.chart-wrap{position:relative;height:140px;background:#0a0d14;border-radius:8px;overflow:hidden;margin-bottom:8px}
+canvas.chart{width:100%;height:100%}
+.chart-legend{font-size:11px;color:#64748b;padding:4px 0}
+/* Grid */
+.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
+.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
+@media(max-width:900px){.grid2,.grid3{grid-template-columns:1fr}}
+/* iframe viewer */
+.viewer-frame{width:100%;height:calc(100vh - 160px);border:0;border-radius:8px;background:#1a1f2e}
+/* Alerts */
+.alert{padding:10px 14px;border-radius:8px;font-size:13px;margin-bottom:14px}
+.alert-info{background:#1e3a5f;border:1px solid #2563eb;color:#93c5fd}
+.alert-warn{background:#451a03;border:1px solid #d97706;color:#fde68a}
+</style>
+</head>
+<body>
+`
+}
+
+func layoutNav(active string) string {
+	items := []struct{ id, icon, label string }{
+		{"dashboard", "📊", "Dashboard"},
+		{"metrics", "📈", "Metrics"},
+		{"tests", "🧪", "Acceptance Tests"},
+		{"burn-in", "🔥", "Burn-in"},
+		{"network", "🌐", "Network"},
+		{"services", "⚙️", "Services"},
+		{"export", "📦", "Export"},
+		{"tools", "🔧", "Tools"},
+	}
+	var b strings.Builder
+	b.WriteString(`<aside class="sidebar">`)
+	b.WriteString(`<div class="sidebar-logo">🐝 bee<span>hardware audit</span></div>`)
+	b.WriteString(`<nav class="nav">`)
+	for _, item := range items {
+		cls := "nav-item"
+		if item.id == active {
+			cls += " active"
+		}
+		href := "/"
+		if item.id != "dashboard" {
+			href = "/" + item.id
+		}
+		b.WriteString(fmt.Sprintf(`<a class="%s" href="%s"><span class="nav-icon">%s</span>%s</a>`,
+			cls, href, item.icon, item.label))
+	}
+	b.WriteString(`</nav></aside>`)
+	return b.String()
+}
+
+// renderPage dispatches to the appropriate page renderer.
+func renderPage(page string, opts HandlerOptions) string {
+	var pageID, title, body string
+	switch page {
+	case "dashboard", "":
+		pageID = "dashboard"
+		title = "Dashboard"
+		body = renderDashboard(opts)
+	case "metrics":
+		pageID = "metrics"
+		title = "Live Metrics"
+		body = renderMetrics()
+	case "tests":
+		pageID = "tests"
+		title = "Acceptance Tests"
+		body = renderTests()
+	case "burn-in":
+		pageID = "burn-in"
+		title = "Burn-in Tests"
+		body = renderBurnIn()
+	case "network":
+		pageID = "network"
+		title = "Network"
+		body = renderNetwork()
+	case "services":
+		pageID = "services"
+		title = "Services"
+		body = renderServices()
+	case "export":
+		pageID = "export"
+		title = "Export"
+		body = renderExport(opts.ExportDir)
+	case "tools":
+		pageID = "tools"
+		title = "Tools"
+		body = renderTools()
+	default:
+		pageID = "dashboard"
+		title = "Not Found"
+		body = `<div class="alert alert-warn">Page not found.</div>`
+	}
+
+	return layoutHead(opts.Title+" — "+title) +
+		layoutNav(pageID) +
+		`<div class="main"><div class="topbar"><h1>` + html.EscapeString(title) + `</h1></div><div class="content">` +
+		body +
+		`</div></div></body></html>`
+}
+
+// ── Dashboard ─────────────────────────────────────────────────────────────────
+
+func renderDashboard(opts HandlerOptions) string {
+	var b strings.Builder
+	b.WriteString(`<div class="grid2">`)
+	// Left: health summary
+	b.WriteString(`<div>`)
+	b.WriteString(renderHealthCard(opts))
+	b.WriteString(`</div>`)
+	// Right: quick actions
+	b.WriteString(`<div>`)
+	b.WriteString(`<div class="card"><div class="card-head">Quick Actions</div><div class="card-body">`)
+	b.WriteString(`<a class="btn btn-primary" href="/export/support.tar.gz" style="display:block;margin-bottom:10px">⬇ Download Support Bundle</a>`)
+	b.WriteString(`<a class="btn btn-secondary" href="/audit.json" style="display:block;margin-bottom:10px" target="_blank">📄 Open audit.json</a>`)
+	b.WriteString(`<a class="btn btn-secondary" href="/export/" style="display:block">📁 Browse Export Files</a>`)
+	b.WriteString(`<div style="margin-top:14px"><button class="btn btn-secondary" onclick="runAudit()">▶ Re-run Audit</button></div>`)
+	b.WriteString(`</div></div>`)
+	b.WriteString(`</div>`)
+	b.WriteString(`</div>`)
+	// Audit viewer iframe
+	b.WriteString(`<div class="card"><div class="card-head">Audit Snapshot</div><div class="card-body" style="padding:0">`)
+	b.WriteString(`<iframe class="viewer-frame" src="/viewer" loading="eager" referrerpolicy="same-origin"></iframe>`)
+	b.WriteString(`</div></div>`)
+
+	// Audit run output div
+	b.WriteString(`<div id="audit-output" style="display:none" class="card"><div class="card-head">Audit Output</div><div class="card-body"><div id="audit-terminal" class="terminal"></div></div></div>`)
+
+	b.WriteString(`<script>
+function runAudit() {
+  document.getElementById('audit-output').style.display='block';
+  const term = document.getElementById('audit-terminal');
+  term.textContent = 'Starting audit...\n';
+  fetch('/api/audit/run', {method:'POST'})
+    .then(r => r.json())
+    .then(d => {
+      const es = new EventSource('/api/audit/stream?job_id=' + d.job_id);
+      es.onmessage = e => { term.textContent += e.data + '\n'; term.scrollTop = term.scrollHeight; };
+      es.addEventListener('done', e => { es.close(); term.textContent += (e.data ? '\\nERROR: ' + e.data : '\\nDone.') + '\n'; location.reload(); });
+    });
+}
+</script>`)
+	return b.String()
+}
+
+func renderHealthCard(opts HandlerOptions) string {
+	data, err := loadSnapshot(filepath.Join(opts.ExportDir, "runtime-health.json"))
+	if err != nil {
+		return `<div class="card"><div class="card-head">Runtime Health</div><div class="card-body"><span class="badge badge-unknown">No data</span></div></div>`
+	}
+	var health map[string]any
+	if err := json.Unmarshal(data, &health); err != nil {
+		return `<div class="card"><div class="card-head">Runtime Health</div><div class="card-body"><span class="badge badge-err">Parse error</span></div></div>`
+	}
+	status := fmt.Sprintf("%v", health["status"])
+	badge := "badge-ok"
+	if status == "PARTIAL" {
+		badge = "badge-warn"
+	} else if status == "FAIL" || status == "FAILED" {
+		badge = "badge-err"
+	}
+	var b strings.Builder
+	b.WriteString(`<div class="card"><div class="card-head">Runtime Health</div><div class="card-body">`)
+	b.WriteString(fmt.Sprintf(`<div style="margin-bottom:10px"><span class="badge %s">%s</span></div>`, badge, html.EscapeString(status)))
+	if issues, ok := health["issues"].([]any); ok && len(issues) > 0 {
+		b.WriteString(`<div style="font-size:12px;color:#f87171">Issues:<br>`)
+		for _, issue := range issues {
+			if m, ok := issue.(map[string]any); ok {
+				b.WriteString(html.EscapeString(fmt.Sprintf("%v: %v", m["code"], m["message"])) + "<br>")
+			}
+		}
+		b.WriteString(`</div>`)
+	}
+	b.WriteString(`</div></div>`)
+	return b.String()
+}
+
+// ── Metrics ───────────────────────────────────────────────────────────────────
+
+func renderMetrics() string {
+	return `<p style="color:#64748b;font-size:13px;margin-bottom:16px">Live server metrics updated every second.</p>
+<div class="grid2">
+  <div class="card">
+    <div class="card-head">GPU Metrics</div>
+    <div class="card-body">
+      <div class="chart-wrap"><canvas id="chart-gpu-temp" class="chart"></canvas></div>
+      <div class="chart-legend">Temperature °C</div>
+      <div class="chart-wrap"><canvas id="chart-gpu-usage" class="chart"></canvas></div>
+      <div class="chart-legend">Usage %</div>
+      <div class="chart-wrap"><canvas id="chart-gpu-power" class="chart"></canvas></div>
+      <div class="chart-legend">Power W</div>
+      <div id="gpu-table"></div>
+    </div>
+  </div>
+  <div class="card">
+    <div class="card-head">System Metrics</div>
+    <div class="card-body">
+      <div class="chart-wrap"><canvas id="chart-cpu-temp" class="chart"></canvas></div>
+      <div class="chart-legend">CPU Temperature °C</div>
+      <div class="chart-wrap"><canvas id="chart-fans" class="chart"></canvas></div>
+      <div class="chart-legend">Fan Speed RPM</div>
+      <div class="chart-wrap"><canvas id="chart-power" class="chart"></canvas></div>
+      <div class="chart-legend">System Power W</div>
+      <div id="sys-table"></div>
+    </div>
+  </div>
+</div>
+<script>
+const WINDOW = 120;
+const history = {gpuTemp:[],gpuUsage:[],gpuPower:[],cpuTemp:[],fans:[],power:[]};
+const colors = ['#60a5fa','#34d399','#f87171','#fbbf24','#a78bfa','#fb7185'];
+
+function push(arr, val) { arr.push(val); if (arr.length > WINDOW) arr.shift(); }
+
+function drawChart(canvasId, datasets, maxY) {
+  const c = document.getElementById(canvasId);
+  if (!c) return;
+  const W = c.offsetWidth, H = c.offsetHeight;
+  c.width = W; c.height = H;
+  const ctx = c.getContext('2d');
+  ctx.clearRect(0,0,W,H);
+  ctx.fillStyle = '#0a0d14';
+  ctx.fillRect(0,0,W,H);
+  // grid
+  ctx.strokeStyle = '#1e2535';
+  ctx.lineWidth = 1;
+  for (let y = 0; y <= 4; y++) {
+    const py = H * y / 4;
+    ctx.beginPath(); ctx.moveTo(0,py); ctx.lineTo(W,py); ctx.stroke();
+  }
+  const max = maxY || datasets.reduce((m,d) => Math.max(m,...d.map(v=>v||0)), 1) || 1;
+  datasets.forEach((data, i) => {
+    if (!data.length) return;
+    ctx.strokeStyle = colors[i % colors.length];
+    ctx.lineWidth = 1.5;
+    ctx.beginPath();
+    data.forEach((v, j) => {
+      const x = W * j / Math.max(data.length - 1, 1);
+      const y = H - H * (v || 0) / max;
+      j === 0 ? ctx.moveTo(x,y) : ctx.lineTo(x,y);
+    });
+    ctx.stroke();
+  });
+}
+
+const es = new EventSource('/api/metrics/stream');
+es.addEventListener('metrics', e => {
+  const d = JSON.parse(e.data);
+
+  // GPU
+  const gpuTemps = (d.gpus||[]).map(g => g.temp_c||0);
+  const gpuUsages = (d.gpus||[]).map(g => g.usage_pct||0);
+  const gpuPowers = (d.gpus||[]).map(g => g.power_w||0);
+  if (!history.gpuTemp.length && gpuTemps.length) {
+    history.gpuTemp = gpuTemps.map(() => []);
+    history.gpuUsage = gpuUsages.map(() => []);
+    history.gpuPower = gpuPowers.map(() => []);
+  }
+  gpuTemps.forEach((v,i) => push(history.gpuTemp[i]||[], v));
+  gpuUsages.forEach((v,i) => push(history.gpuUsage[i]||[], v));
+  gpuPowers.forEach((v,i) => push(history.gpuPower[i]||[], v));
+  drawChart('chart-gpu-temp', history.gpuTemp.length ? history.gpuTemp : [history.cpuTemp]);
+  drawChart('chart-gpu-usage', history.gpuUsage, 100);
+  drawChart('chart-gpu-power', history.gpuPower);
+
+  // GPU table
+  const gpuRows = (d.gpus||[]).map(g =>
+    '<tr><td>GPU '+g.index+'</td><td>'+g.temp_c+'°C</td><td>'+g.usage_pct+'%</td><td>'+g.power_w+'W</td><td>'+g.clock_mhz+'MHz</td></tr>'
+  ).join('');
+  document.getElementById('gpu-table').innerHTML = gpuRows ?
+    '<table><tr><th>GPU</th><th>Temp</th><th>Usage</th><th>Power</th><th>Clock</th></tr>'+gpuRows+'</table>' :
+    '<p style="color:#64748b;font-size:12px">No NVIDIA GPU detected</p>';
+
+  // System
+  const cpuTemp = (d.temps||[]).find(t => t.name==='CPU');
+  push(history.cpuTemp, cpuTemp ? cpuTemp.celsius : 0);
+  const fanRPMs = (d.fans||[]).map(f => f.rpm||0);
+  if (!history.fans.length && fanRPMs.length) history.fans = fanRPMs.map(() => []);
+  fanRPMs.forEach((v,i) => push(history.fans[i]||[], v));
+  push(history.power, d.power_w||0);
+  drawChart('chart-cpu-temp', [history.cpuTemp]);
+  drawChart('chart-fans', history.fans.length ? history.fans : [[]]);
+  drawChart('chart-power', [history.power]);
+
+  // Sys table
+  let sysHTML = '';
+  if (cpuTemp) sysHTML += '<tr><td>CPU Temp</td><td>'+cpuTemp.celsius.toFixed(1)+'°C</td></tr>';
+  (d.fans||[]).forEach(f => sysHTML += '<tr><td>'+f.name+'</td><td>'+f.rpm+' RPM</td></tr>');
+  if (d.power_w) sysHTML += '<tr><td>System Power</td><td>'+d.power_w.toFixed(0)+'W</td></tr>';
+  document.getElementById('sys-table').innerHTML = sysHTML ?
+    '<table style="margin-top:8px">'+sysHTML+'</table>' :
+    '<p style="color:#64748b;font-size:12px">No sensor data (requires ipmitool/sensors)</p>';
+});
+es.onerror = () => { /* reconnect automatically */ };
+</script>`
+}
+
+// ── Acceptance Tests ──────────────────────────────────────────────────────────
+
+func renderTests() string {
+	return `<p style="color:#64748b;font-size:13px;margin-bottom:16px">Run hardware acceptance tests and view results.</p>
+<div class="grid2">
+` + renderSATCard("nvidia", "NVIDIA GPU", `<div class="form-row"><label>Diag Level</label><select id="sat-nvidia-level"><option value="1">Level 1 — Quick</option><option value="2">Level 2 — Standard</option><option value="3">Level 3 — Extended</option><option value="4">Level 4 — Full</option></select></div>`) +
+		renderSATCard("memory", "Memory", "") +
+		renderSATCard("storage", "Storage", "") +
+		renderSATCard("cpu", "CPU", `<div class="form-row"><label>Duration (seconds)</label><input type="number" id="sat-cpu-dur" value="60" min="10"></div>`) +
+		`</div>
+<div id="sat-output" style="display:none;margin-top:16px" class="card">
+  <div class="card-head">Test Output <span id="sat-title"></span></div>
+  <div class="card-body"><div id="sat-terminal" class="terminal"></div></div>
+</div>
+<script>
+let satES = null;
+function runSAT(target) {
+  if (satES) satES.close();
+  const body = {};
+  if (target === 'nvidia') body.diag_level = parseInt(document.getElementById('sat-nvidia-level').value)||1;
+  if (target === 'cpu') body.duration = parseInt(document.getElementById('sat-cpu-dur').value)||60;
+  document.getElementById('sat-output').style.display='block';
+  document.getElementById('sat-title').textContent = '— ' + target;
+  const term = document.getElementById('sat-terminal');
+  term.textContent = 'Starting ' + target + ' test...\n';
+  fetch('/api/sat/'+target+'/run', {method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify(body)})
+    .then(r => r.json())
+    .then(d => {
+      satES = new EventSource('/api/sat/stream?job_id='+d.job_id);
+      satES.onmessage = e => { term.textContent += e.data+'\n'; term.scrollTop=term.scrollHeight; };
+      satES.addEventListener('done', e => { satES.close(); term.textContent += (e.data ? '\nERROR: '+e.data : '\nCompleted.')+'\n'; });
+    });
+}
+</script>`
+}
+
+func renderSATCard(id, label, extra string) string {
+	return fmt.Sprintf(`<div class="card"><div class="card-head">%s</div><div class="card-body">%s<button class="btn btn-primary" onclick="runSAT('%s')">▶ Run Test</button></div></div>`,
+		label, extra, id)
+}
+
+// ── Burn-in ───────────────────────────────────────────────────────────────────
+
+func renderBurnIn() string {
+	return `<p style="color:#64748b;font-size:13px;margin-bottom:16px">Long-running GPU and system stress tests. Check <a href="/metrics" style="color:#60a5fa">Metrics</a> page for live telemetry.</p>
+<div class="grid2">
+<div class="card"><div class="card-head">GPU Platform Stress</div><div class="card-body">
+<div class="form-row"><label>Duration</label><select id="bi-dur"><option value="600">10 minutes</option><option value="3600">1 hour</option><option value="28800">8 hours</option><option value="86400">24 hours</option></select></div>
+<button class="btn btn-primary" onclick="runBurnIn('nvidia')">▶ Start GPU Stress</button>
+</div></div>
+<div class="card"><div class="card-head">CPU Stress</div><div class="card-body">
+<div class="form-row"><label>Duration (seconds)</label><input type="number" id="bi-cpu-dur" value="300" min="60"></div>
+<button class="btn btn-primary" onclick="runBurnIn('cpu')">▶ Start CPU Stress</button>
+</div></div>
+</div>
+<div id="bi-output" style="display:none;margin-top:16px" class="card">
+  <div class="card-head">Output</div>
+  <div class="card-body"><div id="bi-terminal" class="terminal"></div></div>
+</div>
+<script>
+let biES = null;
+function runBurnIn(target) {
+  if (biES) biES.close();
+  const body = {};
+  if (target === 'nvidia') body.duration = parseInt(document.getElementById('bi-dur').value)||600;
+  if (target === 'cpu') body.duration = parseInt(document.getElementById('bi-cpu-dur').value)||300;
+  document.getElementById('bi-output').style.display='block';
+  const term = document.getElementById('bi-terminal');
+  term.textContent = 'Starting ' + target + ' burn-in...\n';
+  fetch('/api/sat/'+target+'/run', {method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify(body)})
+    .then(r => r.json())
+    .then(d => {
+      biES = new EventSource('/api/sat/stream?job_id='+d.job_id);
+      biES.onmessage = e => { term.textContent += e.data+'\n'; term.scrollTop=term.scrollHeight; };
+      biES.addEventListener('done', e => { biES.close(); term.textContent += (e.data ? '\nERROR: '+e.data : '\nCompleted.')+'\n'; });
+    });
+}
+</script>`
+}
+
+// ── Network ───────────────────────────────────────────────────────────────────
+
+func renderNetwork() string {
+	return `<div class="card"><div class="card-head">Network Interfaces</div><div class="card-body">
+<div id="iface-table"><p style="color:#64748b;font-size:13px">Loading...</p></div>
+</div></div>
+<div class="grid2">
+<div class="card"><div class="card-head">DHCP</div><div class="card-body">
+<div class="form-row"><label>Interface (leave empty for all)</label><input type="text" id="dhcp-iface" placeholder="eth0"></div>
+<button class="btn btn-primary" onclick="runDHCP()">▶ Run DHCP</button>
+<div id="dhcp-out" style="margin-top:10px;font-size:12px;color:#86efac"></div>
+</div></div>
+<div class="card"><div class="card-head">Static IPv4</div><div class="card-body">
+<div class="form-row"><label>Interface</label><input type="text" id="st-iface" placeholder="eth0"></div>
+<div class="form-row"><label>Address</label><input type="text" id="st-addr" placeholder="192.168.1.100"></div>
+<div class="form-row"><label>Prefix length</label><input type="text" id="st-prefix" placeholder="24"></div>
+<div class="form-row"><label>Gateway</label><input type="text" id="st-gw" placeholder="192.168.1.1"></div>
+<div class="form-row"><label>DNS (comma-separated)</label><input type="text" id="st-dns" placeholder="8.8.8.8,8.8.4.4"></div>
+<button class="btn btn-primary" onclick="setStatic()">Apply Static IP</button>
+<div id="static-out" style="margin-top:10px;font-size:12px;color:#86efac"></div>
+</div></div>
+</div>
+<script>
+function loadNetwork() {
+  fetch('/api/network').then(r=>r.json()).then(d => {
+    const rows = (d.interfaces||[]).map(i =>
+      '<tr><td>'+i.Name+'</td><td><span class="badge '+(i.State==='up'?'badge-ok':'badge-warn')+'">'+i.State+'</span></td><td>'+(i.IPv4||[]).join(', ')+'</td></tr>'
+    ).join('');
+    document.getElementById('iface-table').innerHTML =
+      '<table><tr><th>Interface</th><th>State</th><th>Addresses</th></tr>'+rows+'</table>' +
+      (d.default_route ? '<p style="font-size:12px;color:#64748b;margin-top:8px">Default route: '+d.default_route+'</p>' : '');
+  });
+}
+function runDHCP() {
+  const iface = document.getElementById('dhcp-iface').value.trim();
+  fetch('/api/network/dhcp',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({interface:iface||'all'})})
+    .then(r=>r.json()).then(d => {
+      document.getElementById('dhcp-out').textContent = d.output || d.error || 'Done.';
+      loadNetwork();
+    });
+}
+function setStatic() {
+  const dns = document.getElementById('st-dns').value.split(',').map(s=>s.trim()).filter(Boolean);
+  fetch('/api/network/static',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({
+    interface: document.getElementById('st-iface').value,
+    address: document.getElementById('st-addr').value,
+    prefix: document.getElementById('st-prefix').value,
+    gateway: document.getElementById('st-gw').value,
+    dns: dns,
+  })}).then(r=>r.json()).then(d => {
+    document.getElementById('static-out').textContent = d.output || d.error || 'Done.';
+    loadNetwork();
+  });
+}
+loadNetwork();
+</script>`
+}
+
+// ── Services ──────────────────────────────────────────────────────────────────
+
+func renderServices() string {
+	return `<div class="card"><div class="card-head">Bee Services <button class="btn btn-sm btn-secondary" onclick="loadServices()" style="margin-left:auto">↻ Refresh</button></div>
+<div class="card-body">
+<div id="svc-table"><p style="color:#64748b;font-size:13px">Loading...</p></div>
+</div></div>
+<div id="svc-out" style="display:none;margin-top:8px" class="card">
+  <div class="card-head">Output</div>
+  <div class="card-body" style="padding:10px"><div id="svc-terminal" class="terminal" style="max-height:150px"></div></div>
+</div>
+<script>
+function loadServices() {
+  fetch('/api/services').then(r=>r.json()).then(svcs => {
+    const rows = svcs.map(s => {
+      const st = s.status||'unknown';
+      const badge = st.includes('active') ? 'badge-ok' : st.includes('failed') ? 'badge-err' : 'badge-warn';
+      return '<tr><td>'+s.name+'</td><td><span class="badge '+badge+'">'+st+'</span></td><td>' +
+        '<button class="btn btn-sm btn-secondary" onclick="svcAction(\''+s.name+'\',\'start\')">Start</button> ' +
+        '<button class="btn btn-sm btn-secondary" onclick="svcAction(\''+s.name+'\',\'stop\')">Stop</button> ' +
+        '<button class="btn btn-sm btn-secondary" onclick="svcAction(\''+s.name+'\',\'restart\')">Restart</button>' +
+        '</td></tr>';
+    }).join('');
+    document.getElementById('svc-table').innerHTML =
+      '<table><tr><th>Service</th><th>Status</th><th>Actions</th></tr>'+rows+'</table>';
+  });
+}
+function svcAction(name, action) {
+  fetch('/api/services/action',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({name,action})})
+    .then(r=>r.json()).then(d => {
+      document.getElementById('svc-out').style.display='block';
+      document.getElementById('svc-terminal').textContent = d.output || d.error || action+' '+name;
+      setTimeout(loadServices, 1000);
+    });
+}
+loadServices();
+</script>`
+}
+
+// ── Export ────────────────────────────────────────────────────────────────────
+
+func renderExport(exportDir string) string {
+	entries, _ := listExportFiles(exportDir)
+	var rows strings.Builder
+	for _, e := range entries {
+		rows.WriteString(fmt.Sprintf(`<tr><td><a href="/export/file?path=%s" target="_blank">%s</a></td></tr>`,
+			url.QueryEscape(e), html.EscapeString(e)))
+	}
+	if len(entries) == 0 {
+		rows.WriteString(`<tr><td style="color:#64748b">No export files found.</td></tr>`)
+	}
+	return `<div class="grid2">
+<div class="card"><div class="card-head">Support Bundle</div><div class="card-body">
+<p style="font-size:13px;color:#94a3b8;margin-bottom:12px">Creates a tar.gz archive of all audit files, SAT results, and logs.</p>
+<a class="btn btn-primary" href="/export/support.tar.gz">⬇ Download Support Bundle</a>
+</div></div>
+<div class="card"><div class="card-head">Export Files</div><div class="card-body">
+<table><tr><th>File</th></tr>` + rows.String() + `</table>
+</div></div>
+</div>`
+}
+
+func listExportFiles(exportDir string) ([]string, error) {
+	var entries []string
+	err := filepath.Walk(strings.TrimSpace(exportDir), func(path string, info os.FileInfo, err error) error {
+		if err != nil {
+			return err
+		}
+		if info.IsDir() {
+			return nil
+		}
+		rel, err := filepath.Rel(exportDir, path)
+		if err != nil {
+			return err
+		}
+		entries = append(entries, rel)
+		return nil
+	})
+	if err != nil && !os.IsNotExist(err) {
+		return nil, err
+	}
+	sort.Strings(entries)
+	return entries, nil
+}
+
+// ── Tools ─────────────────────────────────────────────────────────────────────
+
+func renderTools() string {
+	return `<div class="card"><div class="card-head">Tool Check <button class="btn btn-sm btn-secondary" onclick="checkTools()" style="margin-left:auto">↻ Check</button></div>
+<div class="card-body"><div id="tools-table"><p style="color:#64748b;font-size:13px">Click Check to verify installed tools.</p></div></div></div>
+<script>
+function checkTools() {
+  document.getElementById('tools-table').innerHTML = '<p style="color:#64748b;font-size:13px">Checking...</p>';
+  fetch('/api/tools/check').then(r=>r.json()).then(tools => {
+    const rows = tools.map(t =>
+      '<tr><td>'+t.Name+'</td><td><span class="badge '+(t.OK ? 'badge-ok' : 'badge-err')+'">'+(t.OK ? '✓ '+t.Path : '✗ missing')+'</span></td></tr>'
+    ).join('');
+    document.getElementById('tools-table').innerHTML =
+      '<table><tr><th>Tool</th><th>Status</th></tr>'+rows+'</table>';
+  });
+}
+checkTools();
+</script>`
+}
+
+// ── Viewer (compatibility) ────────────────────────────────────────────────────
+
+// renderViewerPage renders the audit snapshot as a styled HTML page.
+// This endpoint is embedded as an iframe on the Dashboard page.
+func renderViewerPage(title string, snapshot []byte) string {
+	var b strings.Builder
+	b.WriteString(`<!DOCTYPE html><html><head><meta charset="utf-8">`)
+	b.WriteString(`<title>` + html.EscapeString(title) + `</title>`)
+	b.WriteString(`<style>
+*{box-sizing:border-box;margin:0;padding:0}
+body{font-family:system-ui,sans-serif;background:#0f1117;color:#e2e8f0;padding:20px}
+h2{font-size:14px;color:#64748b;margin-bottom:8px;margin-top:16px;text-transform:uppercase;letter-spacing:.05em}
+.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
+.card{background:#161b25;border:1px solid #1e2535;border-radius:8px;padding:14px}
+.card-title{font-size:12px;color:#64748b;margin-bottom:6px}
+.card-value{font-size:15px;font-weight:600}
+.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600}
+.ok{background:#166534;color:#86efac}.warn{background:#713f12;color:#fde68a}.err{background:#7f1d1d;color:#fca5a5}
+pre{background:#0a0d14;border:1px solid #1e2535;border-radius:6px;padding:12px;font-size:11px;overflow-x:auto;color:#94a3b8;white-space:pre-wrap;word-break:break-word;max-height:400px;overflow-y:auto}
+</style></head><body>
+`)
+	if len(snapshot) == 0 {
+		b.WriteString(`<p style="color:#64748b">No audit snapshot available yet. Re-run audit from the Dashboard.</p>`)
+		b.WriteString(`</body></html>`)
+		return b.String()
+	}
+
+	var data map[string]any
+	if err := json.Unmarshal(snapshot, &data); err != nil {
+		// Fallback: render raw JSON
+		b.WriteString(`<pre>` + html.EscapeString(string(snapshot)) + `</pre>`)
+		b.WriteString(`</body></html>`)
+		return b.String()
+	}
+
+	// Collected at
+	if t, ok := data["collected_at"].(string); ok {
+		b.WriteString(`<p style="font-size:12px;color:#64748b;margin-bottom:16px">Collected: ` + html.EscapeString(t) + `</p>`)
+	}
+
+	// Hardware section
+	hw, _ := data["hardware"].(map[string]any)
+	if hw == nil {
+		hw = data
+	}
+
+	renderHWCards(&b, hw)
+
+	// Full JSON below
+	b.WriteString(`<h2>Raw JSON</h2>`)
+	pretty, _ := json.MarshalIndent(data, "", "  ")
+	b.WriteString(`<pre>` + html.EscapeString(string(pretty)) + `</pre>`)
+	b.WriteString(`</body></html>`)
+	return b.String()
+}
+
+func renderHWCards(b *strings.Builder, hw map[string]any) {
+	sections := []struct{ key, label string }{
+		{"board", "Board"},
+		{"cpus", "CPUs"},
+		{"memory", "Memory"},
+		{"storage", "Storage"},
+		{"gpus", "GPUs"},
+		{"nics", "NICs"},
+		{"psus", "Power Supplies"},
+	}
+	for _, s := range sections {
+		v, ok := hw[s.key]
+		if !ok {
+			continue
+		}
+		b.WriteString(`<h2>` + s.label + `</h2><div class="grid">`)
+		renderValue(b, v)
+		b.WriteString(`</div>`)
+	}
+}
+
+func renderValue(b *strings.Builder, v any) {
+	switch val := v.(type) {
+	case []any:
+		for _, item := range val {
+			renderValue(b, item)
+		}
+	case map[string]any:
+		b.WriteString(`<div class="card">`)
+		for k, vv := range val {
+			b.WriteString(fmt.Sprintf(`<div class="card-title">%s</div><div class="card-value">%s</div>`,
+				html.EscapeString(k), html.EscapeString(fmt.Sprintf("%v", vv))))
+		}
+		b.WriteString(`</div>`)
+	}
+}
+
+// ── Export index (compatibility) ──────────────────────────────────────────────
+
+func renderExportIndex(exportDir string) (string, error) {
+	entries, err := listExportFiles(exportDir)
+	if err != nil {
+		return "", err
+	}
+	var body strings.Builder
+	body.WriteString(`<!DOCTYPE html><html><head><meta charset="utf-8"><title>Bee Export Files</title></head><body>`)
+	body.WriteString(`<h1>Bee Export Files</h1><ul>`)
+	for _, entry := range entries {
+		body.WriteString(`<li><a href="/export/file?path=` + url.QueryEscape(entry) + `">` + html.EscapeString(entry) + `</a></li>`)
+	}
+	if len(entries) == 0 {
+		body.WriteString(`<li>No export files found.</li>`)
+	}
+	body.WriteString(`</ul></body></html>`)
+	return body.String(), nil
+}
--- a/audit/internal/webui/server.go
+++ b/audit/internal/webui/server.go
@@ -1,138 +1,207 @@
 package webui

 import (
+	"encoding/json"
 	"errors"
 	"fmt"
-	"html"
 	"net/http"
-	"net/url"
 	"os"
 	"path/filepath"
-	"sort"
 	"strings"

 	"bee/audit/internal/app"
-	"reanimator/chart/viewer"
-	chartweb "reanimator/chart/web"
+	"bee/audit/internal/runtimeenv"
 )

 const defaultTitle = "Bee Hardware Audit"

+// HandlerOptions configures the web UI handler.
 type HandlerOptions struct {
-	Title     string
-	AuditPath string
-	ExportDir string
+	Title       string
+	AuditPath   string
+	ExportDir   string
+	App         *app.App
+	RuntimeMode runtimeenv.Mode
 }

+// handler is the HTTP handler for the web UI.
+type handler struct {
+	opts HandlerOptions
+	mux  *http.ServeMux
+}
+
+// NewHandler creates the HTTP mux with all routes.
 func NewHandler(opts HandlerOptions) http.Handler {
-	title := strings.TrimSpace(opts.Title)
-	if title == "" {
-		title = defaultTitle
+	if strings.TrimSpace(opts.Title) == "" {
+		opts.Title = defaultTitle
+	}
+	if strings.TrimSpace(opts.ExportDir) == "" {
+		opts.ExportDir = app.DefaultExportDir
+	}
+	if opts.RuntimeMode == "" {
+		opts.RuntimeMode = runtimeenv.ModeAuto
 	}

-	auditPath := strings.TrimSpace(opts.AuditPath)
-	exportDir := strings.TrimSpace(opts.ExportDir)
-	if exportDir == "" {
-		exportDir = app.DefaultExportDir
-	}
+	h := &handler{opts: opts}
 	mux := http.NewServeMux()
-	mux.Handle("GET /static/", http.StripPrefix("/static/", chartweb.Static()))
-	mux.HandleFunc("GET /healthz", func(w http.ResponseWriter, r *http.Request) {
-		w.Header().Set("Cache-Control", "no-store")
-		w.WriteHeader(http.StatusOK)
-		_, _ = w.Write([]byte("ok"))
-	})
-	mux.HandleFunc("GET /audit.json", func(w http.ResponseWriter, r *http.Request) {
-		data, err := loadSnapshot(auditPath)
-		if err != nil {
-			if errors.Is(err, os.ErrNotExist) {
-				http.Error(w, "audit snapshot not found", http.StatusNotFound)
-				return
-			}
-			http.Error(w, fmt.Sprintf("read audit snapshot: %v", err), http.StatusInternalServerError)
-			return
-		}
-		w.Header().Set("Cache-Control", "no-store")
-		w.Header().Set("Content-Type", "application/json; charset=utf-8")
-		_, _ = w.Write(data)
-	})
-	mux.HandleFunc("GET /export/support.tar.gz", func(w http.ResponseWriter, r *http.Request) {
-		archive, err := app.BuildSupportBundle(exportDir)
-		if err != nil {
-			http.Error(w, fmt.Sprintf("build support bundle: %v", err), http.StatusInternalServerError)
-			return
-		}
-		w.Header().Set("Cache-Control", "no-store")
-		w.Header().Set("Content-Type", "application/gzip")
-		w.Header().Set("Content-Disposition", fmt.Sprintf("attachment; filename=%q", filepath.Base(archive)))
-		http.ServeFile(w, r, archive)
-	})
-	mux.HandleFunc("GET /runtime-health.json", func(w http.ResponseWriter, r *http.Request) {
-		data, err := loadSnapshot(filepath.Join(exportDir, "runtime-health.json"))
-		if err != nil {
-			if errors.Is(err, os.ErrNotExist) {
-				http.Error(w, "runtime health not found", http.StatusNotFound)
-				return
-			}
-			http.Error(w, fmt.Sprintf("read runtime health: %v", err), http.StatusInternalServerError)
-			return
-		}
-		w.Header().Set("Cache-Control", "no-store")
-		w.Header().Set("Content-Type", "application/json; charset=utf-8")
-		_, _ = w.Write(data)
-	})
-	mux.HandleFunc("GET /export/", func(w http.ResponseWriter, r *http.Request) {
-		body, err := renderExportIndex(exportDir)
-		if err != nil {
-			http.Error(w, fmt.Sprintf("render export index: %v", err), http.StatusInternalServerError)
-			return
-		}
-		w.Header().Set("Cache-Control", "no-store")
-		w.Header().Set("Content-Type", "text/html; charset=utf-8")
-		_, _ = w.Write([]byte(body))
-	})
-	mux.HandleFunc("GET /export/file", func(w http.ResponseWriter, r *http.Request) {
-		rel := strings.TrimSpace(r.URL.Query().Get("path"))
-		if rel == "" {
-			http.Error(w, "path is required", http.StatusBadRequest)
-			return
-		}
-		clean := filepath.Clean(rel)
-		if clean == "." || strings.HasPrefix(clean, "..") {
-			http.Error(w, "invalid path", http.StatusBadRequest)
-			return
-		}
-		http.ServeFile(w, r, filepath.Join(exportDir, clean))
-	})
-	mux.HandleFunc("GET /viewer", func(w http.ResponseWriter, r *http.Request) {
-		snapshot, err := loadSnapshot(auditPath)
-		if err != nil && !errors.Is(err, os.ErrNotExist) {
-			http.Error(w, fmt.Sprintf("read audit snapshot: %v", err), http.StatusInternalServerError)
-			return
-		}
-		html, err := viewer.RenderHTML(snapshot, title)
-		if err != nil {
-			http.Error(w, fmt.Sprintf("render snapshot: %v", err), http.StatusInternalServerError)
-			return
-		}
-		w.Header().Set("Cache-Control", "no-store")
-		w.Header().Set("Content-Type", "text/html; charset=utf-8")
-		_, _ = w.Write(html)
-	})
-	mux.HandleFunc("GET /", func(w http.ResponseWriter, r *http.Request) {
-		noticeTitle, noticeBody := runtimeNotice(filepath.Join(exportDir, "runtime-health.json"))
-		body := renderShellPage(title, noticeTitle, noticeBody)
-		w.Header().Set("Cache-Control", "no-store")
-		w.Header().Set("Content-Type", "text/html; charset=utf-8")
-		_, _ = w.Write([]byte(body))
-	})
+
+	// ── Infrastructure ──────────────────────────────────────────────────────
+	mux.HandleFunc("GET /healthz", h.handleHealthz)
+
+	// ── Existing read-only endpoints (preserved for compatibility) ──────────
+	mux.HandleFunc("GET /audit.json", h.handleAuditJSON)
+	mux.HandleFunc("GET /runtime-health.json", h.handleRuntimeHealthJSON)
+	mux.HandleFunc("GET /export/support.tar.gz", h.handleSupportBundleDownload)
+	mux.HandleFunc("GET /export/file", h.handleExportFile)
+	mux.HandleFunc("GET /export/", h.handleExportIndex)
+	mux.HandleFunc("GET /viewer", h.handleViewer)
+
+	// ── API ──────────────────────────────────────────────────────────────────
+	// Audit
+	mux.HandleFunc("POST /api/audit/run", h.handleAPIAuditRun)
+	mux.HandleFunc("GET /api/audit/stream", h.handleAPIAuditStream)
+
+	// SAT
+	mux.HandleFunc("POST /api/sat/nvidia/run", h.handleAPISATRun("nvidia"))
+	mux.HandleFunc("POST /api/sat/memory/run", h.handleAPISATRun("memory"))
+	mux.HandleFunc("POST /api/sat/storage/run", h.handleAPISATRun("storage"))
+	mux.HandleFunc("POST /api/sat/cpu/run", h.handleAPISATRun("cpu"))
+	mux.HandleFunc("GET /api/sat/stream", h.handleAPISATStream)
+
+	// Services
+	mux.HandleFunc("GET /api/services", h.handleAPIServicesList)
+	mux.HandleFunc("POST /api/services/action", h.handleAPIServicesAction)
+
+	// Network
+	mux.HandleFunc("GET /api/network", h.handleAPINetworkStatus)
+	mux.HandleFunc("POST /api/network/dhcp", h.handleAPINetworkDHCP)
+	mux.HandleFunc("POST /api/network/static", h.handleAPINetworkStatic)
+
+	// Export
+	mux.HandleFunc("GET /api/export/list", h.handleAPIExportList)
+	mux.HandleFunc("POST /api/export/bundle", h.handleAPIExportBundle)
+
+	// Tools
+	mux.HandleFunc("GET /api/tools/check", h.handleAPIToolsCheck)
+
+	// Preflight
+	mux.HandleFunc("GET /api/preflight", h.handleAPIPreflight)
+
+	// Metrics — SSE stream of live sensor data
+	mux.HandleFunc("GET /api/metrics/stream", h.handleAPIMetricsStream)
+
+	// ── Pages ────────────────────────────────────────────────────────────────
+	mux.HandleFunc("GET /", h.handlePage)
+
+	h.mux = mux
 	return mux
 }

+// ListenAndServe starts the HTTP server.
 func ListenAndServe(addr string, opts HandlerOptions) error {
 	return http.ListenAndServe(addr, NewHandler(opts))
 }

+// ── Infrastructure handlers ──────────────────────────────────────────────────
+
+func (h *handler) handleHealthz(w http.ResponseWriter, r *http.Request) {
+	w.Header().Set("Cache-Control", "no-store")
+	w.WriteHeader(http.StatusOK)
+	_, _ = w.Write([]byte("ok"))
+}
+
+// ── Compatibility endpoints ──────────────────────────────────────────────────
+
+func (h *handler) handleAuditJSON(w http.ResponseWriter, r *http.Request) {
+	data, err := loadSnapshot(h.opts.AuditPath)
+	if err != nil {
+		if errors.Is(err, os.ErrNotExist) {
+			http.Error(w, "audit snapshot not found", http.StatusNotFound)
+			return
+		}
+		http.Error(w, fmt.Sprintf("read audit snapshot: %v", err), http.StatusInternalServerError)
+		return
+	}
+	w.Header().Set("Cache-Control", "no-store")
+	w.Header().Set("Content-Type", "application/json; charset=utf-8")
+	_, _ = w.Write(data)
+}
+
+func (h *handler) handleRuntimeHealthJSON(w http.ResponseWriter, r *http.Request) {
+	data, err := loadSnapshot(filepath.Join(h.opts.ExportDir, "runtime-health.json"))
+	if err != nil {
+		if errors.Is(err, os.ErrNotExist) {
+			http.Error(w, "runtime health not found", http.StatusNotFound)
+			return
+		}
+		http.Error(w, fmt.Sprintf("read runtime health: %v", err), http.StatusInternalServerError)
+		return
+	}
+	w.Header().Set("Cache-Control", "no-store")
+	w.Header().Set("Content-Type", "application/json; charset=utf-8")
+	_, _ = w.Write(data)
+}
+
+func (h *handler) handleSupportBundleDownload(w http.ResponseWriter, r *http.Request) {
+	archive, err := app.BuildSupportBundle(h.opts.ExportDir)
+	if err != nil {
+		http.Error(w, fmt.Sprintf("build support bundle: %v", err), http.StatusInternalServerError)
+		return
+	}
+	w.Header().Set("Cache-Control", "no-store")
+	w.Header().Set("Content-Type", "application/gzip")
+	w.Header().Set("Content-Disposition", fmt.Sprintf("attachment; filename=%q", filepath.Base(archive)))
+	http.ServeFile(w, r, archive)
+}
+
+func (h *handler) handleExportFile(w http.ResponseWriter, r *http.Request) {
+	rel := strings.TrimSpace(r.URL.Query().Get("path"))
+	if rel == "" {
+		http.Error(w, "path is required", http.StatusBadRequest)
+		return
+	}
+	clean := filepath.Clean(rel)
+	if clean == "." || strings.HasPrefix(clean, "..") {
+		http.Error(w, "invalid path", http.StatusBadRequest)
+		return
+	}
+	http.ServeFile(w, r, filepath.Join(h.opts.ExportDir, clean))
+}
+
+func (h *handler) handleExportIndex(w http.ResponseWriter, r *http.Request) {
+	body, err := renderExportIndex(h.opts.ExportDir)
+	if err != nil {
+		http.Error(w, fmt.Sprintf("render export index: %v", err), http.StatusInternalServerError)
+		return
+	}
+	w.Header().Set("Cache-Control", "no-store")
+	w.Header().Set("Content-Type", "text/html; charset=utf-8")
+	_, _ = w.Write([]byte(body))
+}
+
+func (h *handler) handleViewer(w http.ResponseWriter, r *http.Request) {
+	snapshot, _ := loadSnapshot(h.opts.AuditPath)
+	body := renderViewerPage(h.opts.Title, snapshot)
+	w.Header().Set("Cache-Control", "no-store")
+	w.Header().Set("Content-Type", "text/html; charset=utf-8")
+	_, _ = w.Write([]byte(body))
+}
+
+// ── Page handler ─────────────────────────────────────────────────────────────
+
+func (h *handler) handlePage(w http.ResponseWriter, r *http.Request) {
+	page := strings.TrimPrefix(r.URL.Path, "/")
+	if page == "" {
+		page = "dashboard"
+	}
+	body := renderPage(page, h.opts)
+	w.Header().Set("Cache-Control", "no-store")
+	w.Header().Set("Content-Type", "text/html; charset=utf-8")
+	_, _ = w.Write([]byte(body))
+}
+
+// ── Helpers ──────────────────────────────────────────────────────────────────
+
 func loadSnapshot(path string) ([]byte, error) {
 	if strings.TrimSpace(path) == "" {
 		return nil, os.ErrNotExist
@@ -140,101 +209,17 @@ func loadSnapshot(path string) ([]byte, error) {
 	return os.ReadFile(path)
 }

-func runtimeNotice(path string) (string, string) {
-	health, err := app.ReadRuntimeHealth(path)
-	if err != nil {
-		return "Runtime Health", "No runtime health snapshot found yet."
-	}
-	body := fmt.Sprintf("Status: %s. Export dir: %s. Driver ready: %t. CUDA ready: %t. Network: %s. Export files: /export/",
-		firstNonEmpty(health.Status, "UNKNOWN"),
-		firstNonEmpty(health.ExportDir, app.DefaultExportDir),
-		health.DriverReady,
-		health.CUDAReady,
-		firstNonEmpty(health.NetworkStatus, "UNKNOWN"),
-	)
-	if len(health.Issues) > 0 {
-		body += " Issues: "
-		parts := make([]string, 0, len(health.Issues))
-		for _, issue := range health.Issues {
-			parts = append(parts, issue.Code)
-		}
-		body += strings.Join(parts, ", ")
-	}
-	return "Runtime Health", body
+// writeJSON sends v as JSON with status 200.
+func writeJSON(w http.ResponseWriter, v any) {
+	w.Header().Set("Content-Type", "application/json; charset=utf-8")
+	w.Header().Set("Cache-Control", "no-store")
+	_ = json.NewEncoder(w).Encode(v)
 }

-func renderExportIndex(exportDir string) (string, error) {
-	var entries []string
-	err := filepath.Walk(strings.TrimSpace(exportDir), func(path string, info os.FileInfo, err error) error {
-		if err != nil {
-			return err
-		}
-		if info.IsDir() {
-			return nil
-		}
-		rel, err := filepath.Rel(exportDir, path)
-		if err != nil {
-			return err
-		}
-		entries = append(entries, rel)
-		return nil
-	})
-	if err != nil && !errors.Is(err, os.ErrNotExist) {
-		return "", err
-	}
-	sort.Strings(entries)
-	var body strings.Builder
-	body.WriteString("<!DOCTYPE html><html><head><meta charset=\"utf-8\"><title>Bee Export Files</title></head><body>")
-	body.WriteString("<h1>Bee Export Files</h1><ul>")
-	for _, entry := range entries {
-		body.WriteString("<li><a href=\"/export/file?path=" + url.QueryEscape(entry) + "\">" + html.EscapeString(entry) + "</a></li>")
-	}
-	if len(entries) == 0 {
-		body.WriteString("<li>No export files found.</li>")
-	}
-	body.WriteString("</ul></body></html>")
-	return body.String(), nil
-}
-
-func renderShellPage(title, noticeTitle, noticeBody string) string {
-	var body strings.Builder
-	body.WriteString("<!DOCTYPE html><html><head><meta charset=\"utf-8\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">")
-	body.WriteString("<title>" + html.EscapeString(title) + "</title>")
-	body.WriteString(`<style>
-body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#f4f1ea;color:#1b1b18}
-.shell{min-height:100vh;display:grid;grid-template-rows:auto auto 1fr}
-.header{padding:18px 20px 12px;border-bottom:1px solid rgba(0,0,0,.08);background:#fbf8f2}
-.header h1{margin:0;font-size:24px}
-.header p{margin:6px 0 0;color:#5a5a52}
-.actions{display:flex;flex-wrap:wrap;gap:10px;padding:12px 20px;background:#fbf8f2}
-.actions a{display:inline-block;text-decoration:none;padding:10px 14px;border-radius:999px;background:#1f5f4a;color:#fff;font-weight:600}
-.actions a.secondary{background:#d8e5dd;color:#17372b}
-.notice{margin:16px 20px 0;padding:14px 16px;border-radius:14px;background:#fff7df;border:1px solid #ead9a4}
-.notice h2{margin:0 0 6px;font-size:16px}
-.notice p{margin:0;color:#4f4a37}
-.viewer-wrap{padding:16px 20px 20px}
-.viewer{width:100%;height:calc(100vh - 170px);border:0;border-radius:18px;background:#fff;box-shadow:0 12px 40px rgba(0,0,0,.08)}
-@media (max-width:720px){.viewer{height:calc(100vh - 240px)}}
-</style></head><body><div class="shell">`)
-	body.WriteString("<header class=\"header\"><h1>" + html.EscapeString(title) + "</h1><p>Audit viewer with support bundle and raw export access.</p></header>")
-	body.WriteString("<nav class=\"actions\">")
-	body.WriteString("<a href=\"/export/support.tar.gz\">Download support bundle</a>")
-	body.WriteString("<a class=\"secondary\" href=\"/audit.json\">Open audit.json</a>")
-	body.WriteString("<a class=\"secondary\" href=\"/runtime-health.json\">Open runtime-health.json</a>")
-	body.WriteString("<a class=\"secondary\" href=\"/export/\">Browse export files</a>")
-	body.WriteString("</nav>")
-	if strings.TrimSpace(noticeTitle) != "" {
-		body.WriteString("<section class=\"notice\"><h2>" + html.EscapeString(noticeTitle) + "</h2><p>" + html.EscapeString(noticeBody) + "</p></section>")
-	}
-	body.WriteString("<main class=\"viewer-wrap\"><iframe class=\"viewer\" src=\"/viewer\" loading=\"eager\" referrerpolicy=\"same-origin\"></iframe></main>")
-	body.WriteString("</div></body></html>")
-	return body.String()
-}
-
-func firstNonEmpty(value, fallback string) string {
-	value = strings.TrimSpace(value)
-	if value == "" {
-		return fallback
-	}
-	return value
+// writeError sends a JSON error response.
+func writeError(w http.ResponseWriter, status int, msg string) {
+	w.Header().Set("Content-Type", "application/json; charset=utf-8")
+	w.Header().Set("Cache-Control", "no-store")
+	w.WriteHeader(status)
+	_ = json.NewEncoder(w).Encode(map[string]string{"error": msg})
 }