ui: GitHub-Actions-style detail page, sub-steps, mini-tile run-view

Reshapes the detail page into a run-view: hybrid horizontal pipeline
+ expanded active-step pane with sub-steps, a per-step log pane with
line-numbered permalinks and client-side search, and a runs-history
sidebar that navigates via ?run=N. Default step is server-picked
(running → failed → Reporting) so the operator lands on the thing
that's moving.

Adds a sub_steps table + SSE topic (substep-{run}-{stage}-{ordinal})
so per-disk and per-pass work (SMART, CPUStress CPU/RAM, Storage,
GPU) is visible in the UI instead of buried in stage summary JSON.
Agent emits sub-step reports from existing per-iteration loops.

Dashboard tiles become a mini run-view with a 9-dot step strip so
the operator reads run health across the whole grid at a glance.
Register page gets the same card shell + button styling.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

internal/web/templates/active_step.templ

@@ -0,0 +1,96 @@
+package templates
+
+import (
+	"fmt"
+	"time"
+
+	"vetting/internal/model"
+)
+
+// ActiveStepData is the per-stage payload for the expanded step panel.
+// The handler builds one per stage in DefaultStageOrder and hands it to
+// ActiveStep so the template stays free of any slicing logic.
+type ActiveStepData struct {
+	RunID     int64
+	Stage     model.Stage
+	SubSteps  []model.SubStep
+	LogReplay string
+	Open      bool
+}
+
+// ActiveStep renders one stage's expanded panel: the header summary
+// (state badge, stage name, duration), any sub-step rows, a per-step
+// search box, and a live log pane scoped to that stage's SSE topic.
+// Uses <details open?={ d.Open }> so the server-picked default stage
+// opens automatically on page load; app.js takes over after that for
+// SSE-driven auto-advance.
+templ ActiveStep(d ActiveStepData) {
+	<details class={ "step", "step-" + string(d.Stage.State) } open?={ d.Open } data-stage={ d.Stage.Name }>
+		<summary class="step-summary">
+			<span class={ "stage-dot", "stage-dot-" + string(d.Stage.State) }>{ stageMarker(string(d.Stage.State)) }</span>
+			<span class="step-name">{ d.Stage.Name }</span>
+			<span class="step-duration">{ stageDurationFromStage(d.Stage) }</span>
+		</summary>
+		<div class="step-body">
+			if len(d.SubSteps) > 0 {
+				<ol class="substep-list">
+					for _, ss := range d.SubSteps {
+						@SubStepRow(ss)
+					}
+				</ol>
+			}
+			<div class="log-search-wrap">
+				<input class="log-search" type="search" placeholder="Search this step" data-step={ d.Stage.Name }/>
+			</div>
+			<div
+				class="log-pane"
+				id={ fmt.Sprintf("log-%d-%s", d.RunID, d.Stage.Name) }
+				sse-swap={ fmt.Sprintf("log-%d-%s", d.RunID, d.Stage.Name) }
+				hx-swap="beforeend show:bottom"
+			>
+				@templ.Raw(d.LogReplay)
+			</div>
+		</div>
+	</details>
+}
+
+// SubStepsForStage filters a flat []SubStep to just the entries for one
+// stage. Used by host_detail when wiring ActiveStepData — keeps the
+// filtering logic testable and off the template surface.
+func SubStepsForStage(all []model.SubStep, stageName string) []model.SubStep {
+	out := make([]model.SubStep, 0, len(all))
+	for _, ss := range all {
+		if ss.StageName == stageName {
+			out = append(out, ss)
+		}
+	}
+	return out
+}
+
+// stageDurationFromStage is stageDuration adapted to a model.Stage — same
+// formatting rules, different input shape.
+func stageDurationFromStage(s model.Stage) string {
+	if s.StartedAt == nil {
+		return ""
+	}
+	end := time.Now()
+	if s.CompletedAt != nil {
+		end = *s.CompletedAt
+	}
+	d := end.Sub(*s.StartedAt)
+	if d < 0 {
+		d = 0
+	}
+	switch {
+	case d < time.Second:
+		return fmt.Sprintf("%dms", int(d/time.Millisecond))
+	case d < 10*time.Second:
+		return fmt.Sprintf("%.1fs", d.Seconds())
+	case d < time.Minute:
+		return fmt.Sprintf("%ds", int(d/time.Second))
+	case d < time.Hour:
+		return fmt.Sprintf("%dm", int(d/time.Minute))
+	default:
+		return fmt.Sprintf("%dh", int(d/time.Hour))
+	}
+}