Fix GRPO correctness + scale config for L40S

- Reward function now restores per-prompt env snapshot before scoring,
so each completion is judged against the state its prompt described
(not whatever env._state happened to be). Fixes silent learning-signal
decoupling that was wrecking previous runs.
- Add independent format-quality reward as second reward_func, per
hackathon guide's "use multiple independent reward signals" advice.
- Trim state_to_prompt from ~700-1000 to ~150-200 tokens (~4x faster
generation, no info loss).
- Scale defaults for L40S (was T4): Qwen2.5-1.5B, num_generations=8,
per_device_batch=2, max_steps=60, max_completion_length=192, bf16=True,
prompt_budget=200. All env-var overridable.
- Add preflight reward-variance check before training (aborts loudly
if all rewards identical = no learning signal).
- Wire real LLM into /api/compare so 'VERGIL-Trained' arm actually runs
the trained model when loaded; falls back to heuristic with clear label.
- _validate_action: only enforce target-node existence for actions that
use a target. Fixes the DO_NOTHING-with-stale-target infinite warning loop.
- parse_llm_output: coerces target to a valid pending node_id; falls back
to DO_NOTHING when LLM hallucinates a stakeholder id as target.
- Save + push model BEFORE post-training eval so a sleeping Space can't
cost us the trained adapter. Eval is now strictly optional with
SKIP_EVAL/EVAL_EPISODES/EVAL_TIMEOUT_SEC env knobs.
- Promote GPU Dockerfile to repo root (was vergil-training-space-fix/);
keep CPU Dockerfile as Dockerfile.demo for later demo Space.
- Add .dockerignore + extend .gitignore (.env, *.log) so secrets and
noise never reach the Space build.

Made-with: Cursor

.dockerignore

@@ -0,0 +1,19 @@
+.env
+.env.*
+*.pem
+*.key
+.git
+.gitignore
+__pycache__/
+*.pyc
+*.pyo
+.pytest_cache/
+.DS_Store
+training_results/
+backend.log
+*.log
+node_modules/
+.cursor/
+.vscode/
+Dockerfile.demo
+test_reset.py

.gitignore

@@ -5,4 +5,7 @@ __pycache__/
 training_results/
 /tmp/
 .DS_Store
-.env
+.env
+.env.*
+*.log
+node_modules/

Dockerfile

@@ -1,13 +1,23 @@
-FROM python:3.11-slim
+FROM pytorch/pytorch:2.3.0-cuda12.1-cudnn8-devel
 
-WORKDIR /app
+RUN useradd -m -u 1000 user
+USER user
+ENV HOME=/home/user \
+    PATH=/home/user/.local/bin:$PATH \
+    CUDA_HOME=/usr/local/cuda
 
-COPY requirements.txt .
-RUN pip install --no-cache-dir -r requirements.txt
-RUN pip install --no-cache-dir fastapi uvicorn
+WORKDIR $HOME/app
 
-COPY . .
+USER root
+RUN apt-get update && apt-get install -y git curl build-essential && rm -rf /var/lib/apt/lists/*
+USER user
 
-EXPOSE 7860
+COPY --chown=user . $HOME/app
 
-CMD ["python", "-m", "uvicorn", "vergil.api.server:app", "--host", "0.0.0.0", "--port", "7860"]
+RUN pip install --upgrade pip
+# Force strict synchronization of PyTorch and Torchvision directly from NVIDIA's servers
+RUN pip install "torch==2.3.1" "torchvision==0.18.1" --index-url https://download.pytorch.org/whl/cu121
+# Install all required modules in one robust resolution block
+RUN pip install "unsloth" "xformers==0.0.27" "trl" "peft" "accelerate" "bitsandbytes" "gymnasium" "networkx" "scipy" "datasets" "gradio" "huggingface_hub"
+
+CMD ["python", "app.py"]

Dockerfile.demo

@@ -0,0 +1,13 @@
+FROM python:3.11-slim
+
+WORKDIR /app
+
+COPY requirements.txt .
+RUN pip install --no-cache-dir -r requirements.txt
+RUN pip install --no-cache-dir fastapi uvicorn
+
+COPY . .
+
+EXPOSE 7860
+
+CMD ["python", "-m", "uvicorn", "vergil.api.server:app", "--host", "0.0.0.0", "--port", "7860"]

frontend/app.js

@@ -1,16 +1,19 @@
 /* ═══════════════════════════════════════════════════════════
-   VERGIL — App Logic v4 (Theater Layout)
+   VERGIL — App Logic v5 (Matching Design System v5)
    ═══════════════════════════════════════════════════════════ */
 
 const API = '';
 
 // ── State ────────────────────────────────────────────────
-let currentState = null;
-let selectedNode = null;
-let totalReward  = 0;
-let autoTimer    = null;
-let d3Sim        = null;
-let episodeHistory = [];      // [{action,target,reward,step}]
+let currentState   = null;
+let selectedNode   = null;
+let totalReward    = 0;
+let autoTimer      = null;
+let d3Sim          = null;
+let episodeHistory = [];
+let cascadeCount   = 0;
+let prevTrustAvg   = null;
+let prevHealth     = null;
 
 // ── DOM shortcuts ────────────────────────────────────────
 const $ = id => document.getElementById(id);
@@ -44,12 +47,12 @@ async function loadScenarios() {
     try {
         const data = await fetchJSON(`${API}/api/scenarios`);
         data.scenarios.forEach(s => {
-            const o = document.createElement('option');
-            o.value = s.scenario_id;
-            o.textContent = `${s.scenario_id.replace('scenario_','').replace(/_/g,' ')}`;
+            const label = s.scenario_id.replace('scenario_','').replace(/_/g,' ');
+            const o  = document.createElement('option');
+            o.value  = s.scenario_id;
+            o.textContent = label;
             $('scenario-select').appendChild(o);
-            const o2 = o.cloneNode(true);
-            $('cmp-scenario-select').appendChild(o2);
+            $('cmp-scenario-select').appendChild(o.cloneNode(true));
         });
     } catch(e) { /* no scenarios endpoint — fine */ }
 }
@@ -59,17 +62,20 @@ async function loadScenarios() {
 // ═══════════════════════════════════════════════════════════
 async function resetEpisode() {
     stopAutoplay();
-    totalReward = 0;
+    totalReward    = 0;
     episodeHistory = [];
-    selectedNode = null;
+    selectedNode   = null;
+    cascadeCount   = 0;
+    prevTrustAvg   = null;
+    prevHealth     = null;
 
     const body = {};
-    const sel = $('scenario-select').value;
+    const sel  = $('scenario-select').value;
     if (sel) body.scenario_id = sel;
 
     setLoading(true);
     try {
-        const data = await fetchJSON(`${API}/api/reset`, { method: 'POST', body });
+        const data   = await fetchJSON(`${API}/api/reset`, { method: 'POST', body });
         currentState = data.state;
 
         clearFeed();
@@ -122,14 +128,13 @@ async function takeAction(actionType) {
 }
 
 // ═══════════════════════════════════════════════════════════
-//  AGENT AUTO-STEP (uses /api/agent-step — LLM or heuristic)
+//  AGENT AUTO-STEP
 // ═══════════════════════════════════════════════════════════
 async function agentStep() {
     if (!currentState) return;
     try {
         const data = await fetchJSON(`${API}/api/agent-step`, { method: 'POST', body: {} });
-        // Action/reasoning live inside step_record
-        const sr = data.step_record || {};
+        const sr   = data.step_record || {};
         handleStepResponse(data, sr.action || 'do_nothing', sr.agent_reasoning || null);
     } catch(e) {
         feedSystem(`Agent step failed: ${e.message}`, true);
@@ -140,38 +145,30 @@ async function agentStep() {
 function handleStepResponse(data, actionType, reasoning) {
     if (data.detail) { feedSystem(`Error: ${data.detail}`, true); return; }
 
-    currentState = data.state;
-    const reward = data.reward || 0;
-    totalReward += reward;
+    currentState  = data.state;
+    const reward  = data.reward || 0;
+    totalReward  += reward;
 
-    const sr = data.step_record || {};
+    const sr       = data.step_record || {};
     const targetId = sr.target || data.target_node_id || data.target;
     const nodes    = currentState.graph?.nodes || [];
     const node     = nodes.find(n => n.id === targetId);
 
-    // Show agent reasoning block if available
     if (reasoning) feedThink(reasoning);
-
-    // Show decision card
     feedDecision(actionType, node, reward, data.info?.stakeholder_responses);
-
-    // Timeline entry
     pushTimeline(actionType, node?.label || targetId || '—', reward);
-
-    // Log brief summary
     logAdd('agent', `${actionIcon(actionType)} ${node?.label || actionType}  (${reward >= 0 ? '+' : ''}${reward.toFixed(3)})`);
 
-    // Cascade events
     const cascades = data.info?.cascade_events || [];
     if (cascades.length) {
+        const affected = cascades.filter(e => e.cascaded).length;
+        if (affected) { cascadeCount += affected; }
         feedCascade(cascades);
         logAdd('danger', `⚠ Cascade: ${cascades.length} node(s) affected`);
     }
 
-    // New pending from stakeholder responses
     const newPending = nodes.filter(n =>
-        n.status === 'pending' &&
-        !episodeHistory.some(h => h.nodeId === n.id)
+        n.status === 'pending' && !episodeHistory.some(h => h.nodeId === n.id)
     );
     newPending.forEach(n => feedStakeholder(n));
 
@@ -179,7 +176,6 @@ function handleStepResponse(data, actionType, reasoning) {
 
     renderAll(currentState, data);
 
-    // Auto-select next pending
     const pending = nodes.filter(n => n.status === 'pending');
     if (pending.length && !pending.find(n => n.id === selectedNode)) selectNode(pending[0].id);
 
@@ -225,6 +221,7 @@ function stopAutoplay() {
 // ═══════════════════════════════════════════════════════════
 function renderAll(state, stepData) {
     renderTopbar(state);
+    renderKPI(state);
     renderGraph(state);
     renderNodePicker(state);
     renderTrust(state);
@@ -237,17 +234,17 @@ function renderAll(state, stepData) {
 function renderTopbar(state) {
     $('stat-step').textContent = state.step_number || 0;
 
-    const r = totalReward;
+    const r   = totalReward;
     const rEl = $('stat-reward');
     rEl.textContent = (r >= 0 ? '+' : '') + r.toFixed(2);
-    rEl.style.color = r >= 0 ? 'var(--green)' : 'var(--red)';
+    rEl.style.color = r >= 0 ? 'var(--s-completed)' : 'var(--s-failed)';
 
-    const sat = state.satisfiability_score;
+    const sat   = state.satisfiability_score;
     const satEl = $('stat-sat');
     if (sat != null) {
         const pct = Math.round(sat * 100);
         satEl.textContent = pct + '%';
-        satEl.style.color = pct >= 70 ? 'var(--green)' : pct >= 40 ? 'var(--yellow)' : 'var(--red)';
+        satEl.style.color = pct >= 70 ? 'var(--s-completed)' : pct >= 40 ? 'var(--s-at-risk)' : 'var(--s-failed)';
     } else {
         satEl.textContent = '—'; satEl.style.color = '';
     }
@@ -257,43 +254,83 @@ function renderTopbar(state) {
     if (load != null) {
         const pct = Math.round(load * 100);
         ldEl.textContent = pct + '%';
-        ldEl.style.color = pct > 80 ? 'var(--red)' : pct > 50 ? 'var(--yellow)' : 'var(--green)';
+        ldEl.style.color = pct > 80 ? 'var(--s-failed)' : pct > 50 ? 'var(--s-at-risk)' : 'var(--s-completed)';
     }
 
     $('badge-stage').textContent = `Stage ${state.curriculum_stage || 1}`;
 }
 
 function renderScenarioHeader(state) {
-    const nodes = state.graph?.nodes || [];
-    const n = nodes.length;
+    const nodes  = state.graph?.nodes || [];
+    const n      = nodes.length;
     const stakes = new Set(nodes.map(nd => nd.stakeholder_id).filter(Boolean));
     $('sh-title').textContent = `${n} commitment${n !== 1 ? 's' : ''} — ${stakes.size} stakeholder${stakes.size !== 1 ? 's' : ''}`;
     $('sh-sub').textContent   = `${state.available_hours_next_48h?.toFixed(1) || '—'}h available in 48h window`;
-    $('sh-icon').textContent  = n > 3 ? '🌪' : n > 1 ? '⚡' : '💡';
+}
+
+// ── KPI Strip ────────────────────────────────────────────
+function renderKPI(state) {
+    const nodes   = state.graph?.nodes || [];
+    const total   = nodes.length;
+    const done    = nodes.filter(n => n.status === 'completed').length;
+    const failed  = nodes.filter(n => n.status === 'failed').length;
+    const active  = nodes.filter(n => ['accepted','in_progress','completed'].includes(n.status)).length;
+
+    // Fulfillment rate
+    const fulfillPct = active > 0 ? Math.round((done / active) * 100) : null;
+    setKPI('kpi-fulfill', fulfillPct != null ? fulfillPct + '%' : '—', null);
+
+    // Trust avg
+    const scores  = state.trust_scores || {};
+    const vals    = Object.values(scores).map(v => typeof v === 'number' ? v : (v?.trust_score || 0));
+    const trustAvg = vals.length ? vals.reduce((a,b)=>a+b,0)/vals.length : null;
+    const trustPct = trustAvg != null ? Math.round(trustAvg * 100) : null;
+    const trustDelta = (trustAvg != null && prevTrustAvg != null)
+        ? Math.round((trustAvg - prevTrustAvg) * 100) : null;
+    setKPI('kpi-trust', trustPct != null ? trustPct + '%' : '—', trustDelta);
+    prevTrustAvg = trustAvg;
+
+    // Cascade count
+    setKPI('kpi-cascade', String(cascadeCount), null);
+
+    // CDG health
+    const health = state.satisfiability_score;
+    const healthPct = health != null ? Math.round(health * 100) : null;
+    const healthDelta = (health != null && prevHealth != null)
+        ? Math.round((health - prevHealth) * 100) : null;
+    setKPI('kpi-health', healthPct != null ? healthPct + '%' : '—', healthDelta);
+    prevHealth = health;
+}
+
+function setKPI(valId, val, delta) {
+    const el = $(valId);
+    if (el) el.textContent = val;
+    const dEl = $(valId + '-delta');
+    if (dEl) {
+        if (delta == null || delta === 0) {
+            dEl.textContent = ''; dEl.className = 'kpi-delta';
+        } else {
+            dEl.textContent = (delta > 0 ? '+' : '') + delta + '%';
+            dEl.className   = 'kpi-delta ' + (delta > 0 ? 'up' : 'down');
+        }
+    }
 }
 
 function renderGraphIndicators(state) {
-    const nodes = state.graph?.nodes || [];
+    const nodes     = state.graph?.nodes || [];
     const pending   = nodes.filter(n => n.status === 'pending').length;
     const active    = nodes.filter(n => n.status === 'accepted').length;
+    const completed = nodes.filter(n => n.status === 'completed').length;
     const failed    = nodes.filter(n => n.status === 'failed').length;
 
-    const pEl = $('ghb-pending');
-    const aEl = $('ghb-active');
-    const fEl = $('ghb-failed');
-
-    pEl.textContent = `${pending} pending`;
-    pEl.style.color = pending > 0 ? 'var(--yellow)' : 'var(--text-3)';
-
-    aEl.textContent = `${active} active`;
-    aEl.style.color = active > 0 ? 'var(--blue)' : 'var(--text-3)';
-
-    fEl.textContent = `${failed} failed`;
-    fEl.style.color = failed > 0 ? 'var(--red)' : 'var(--text-3)';
+    $('ghb-pending').textContent   = `${pending} pending`;
+    $('ghb-active').textContent    = `${active} active`;
+    $('ghb-completed').textContent = `${completed} done`;
+    $('ghb-failed').textContent    = `${failed} failed`;
 }
 
 // ═══════════════════════════════════════════════════════════
-//  D3 GRAPH
+//  D3 GRAPH — v5 Node Anatomy
 // ═══════════════════════════════════════════════════════════
 function renderGraph(state) {
     const graphData = state.graph;
@@ -306,7 +343,6 @@ function renderGraph(state) {
     const svg = d3.select('#graph-svg');
     svg.selectAll('*').remove();
 
-    // Build maps for current positions (preserve layout on re-render)
     const prevPos = {};
     if (d3Sim) {
         d3Sim.stop();
@@ -314,91 +350,120 @@ function renderGraph(state) {
     }
 
     const defs = svg.append('defs');
-    // Arrow marker
-    defs.append('marker')
-        .attr('id', 'arrow')
-        .attr('viewBox', '0 -4 8 8').attr('refX', 22).attr('refY', 0)
-        .attr('markerWidth', 5).attr('markerHeight', 5).attr('orient', 'auto')
-        .append('path').attr('d', 'M0,-4L8,0L0,4').attr('fill', '#5b6b82');
-
-    defs.append('marker')
-        .attr('id', 'arrow-red')
-        .attr('viewBox', '0 -4 8 8').attr('refX', 22).attr('refY', 0)
-        .attr('markerWidth', 5).attr('markerHeight', 5).attr('orient', 'auto')
-        .append('path').attr('d', 'M0,-4L8,0L0,4').attr('fill', 'var(--red)');
+
+    // Arrow markers per edge type
+    const markerDefs = [
+        { id: 'arrow-dep',      color: '#475569' },
+        { id: 'arrow-conflict', color: '#fb7185' },
+        { id: 'arrow-trust',    color: '#8b5cf6' },
+    ];
+    markerDefs.forEach(({ id, color }) => {
+        defs.append('marker')
+            .attr('id', id)
+            .attr('viewBox', '0 -4 8 8').attr('refX', 28).attr('refY', 0)
+            .attr('markerWidth', 5).attr('markerHeight', 5).attr('orient', 'auto')
+            .append('path').attr('d', 'M0,-4L8,0L0,4').attr('fill', color);
+    });
+
+    // Glow filter for selected
+    const filt = defs.append('filter').attr('id', 'glow').attr('x', '-30%').attr('y', '-30%').attr('width', '160%').attr('height', '160%');
+    filt.append('feGaussianBlur').attr('in', 'SourceGraphic').attr('stdDeviation', '4').attr('result', 'blur');
+    filt.append('feMerge').selectAll('feMergeNode').data(['blur','SourceGraphic']).join('feMergeNode').attr('in', d => d);
 
     const g = svg.append('g');
+    svg.call(d3.zoom().scaleExtent([0.35, 3]).on('zoom', e => g.attr('transform', e.transform)));
 
-    // Zoom
-    svg.call(d3.zoom()
-        .scaleExtent([0.4, 3])
-        .on('zoom', e => g.attr('transform', e.transform))
-    );
+    // Assign letter labels A, B, C…
+    const letterMap = {};
+    graphData.nodes.forEach((n, i) => { letterMap[n.id] = String.fromCharCode(65 + (i % 26)); });
 
     const nodes = graphData.nodes.map(n => ({
         ...n,
-        x: prevPos[n.id]?.x || W/2 + (Math.random()-0.5)*200,
-        y: prevPos[n.id]?.y || H/2 + (Math.random()-0.5)*200,
+        letter: letterMap[n.id],
+        x: prevPos[n.id]?.x ?? (W/2 + (Math.random()-0.5)*200),
+        y: prevPos[n.id]?.y ?? (H/2 + (Math.random()-0.5)*160),
     }));
     const links = (graphData.edges || []).map(e => ({...e}));
 
-    // Links
-    const link = g.append('g').attr('class', 'links')
-        .selectAll('line').data(links).join('line')
-        .attr('class', d => `link ${d.edge_type || 'dependency'}`)
-        .attr('marker-end', d => d.edge_type === 'conflict' ? 'url(#arrow-red)' : 'url(#arrow)');
+    // Edges (curved paths for clarity)
+    const edgeGroup = g.append('g').attr('class', 'edges');
+    const link = edgeGroup.selectAll('path').data(links).join('path')
+        .attr('class', d => {
+            const t = d.edge_type || 'dependency';
+            if (t === 'conflict')     return 'edge conflict';
+            if (t === 'trust_impact') return 'edge trust-impact';
+            return 'edge dependency';
+        })
+        .attr('fill', 'none')
+        .attr('marker-end', d => {
+            const t = d.edge_type || 'dependency';
+            if (t === 'conflict')     return 'url(#arrow-conflict)';
+            if (t === 'trust_impact') return 'url(#arrow-trust)';
+            return 'url(#arrow-dep)';
+        });
+
+    const R = d => 20 + (d.urgency || 0.4) * 7;
 
     // Node groups
-    const node = g.append('g').attr('class', 'nodes')
-        .selectAll('g').data(nodes).join('g')
-        .attr('class', d => `node status-${d.status}${d.id === selectedNode ? ' selected' : ''}`)
+    const nodeGroup = g.append('g').attr('class', 'nodes');
+    const node = nodeGroup.selectAll('g').data(nodes).join('g')
+        .attr('class', d => `node ${d.status || 'pending'}${d.id === selectedNode ? ' selected' : ''}`)
         .call(d3.drag()
-            .on('start', (e,d) => { if (!e.active) d3Sim.alphaTarget(0.3).restart(); d.fx=d.x; d.fy=d.y; })
-            .on('drag',  (e,d) => { d.fx=e.x; d.fy=e.y; })
-            .on('end',   (e,d) => { if (!e.active) d3Sim.alphaTarget(0); d.fx=null; d.fy=null; })
+            .on('start', (e, d) => { if (!e.active) d3Sim.alphaTarget(0.3).restart(); d.fx = d.x; d.fy = d.y; })
+            .on('drag',  (e, d) => { d.fx = e.x; d.fy = e.y; })
+            .on('end',   (e, d) => { if (!e.active) d3Sim.alphaTarget(0); d.fx = null; d.fy = null; })
         )
         .on('click', (e, d) => { e.stopPropagation(); selectNode(d.id); });
 
-    const radius = d => 14 + (d.urgency || 0.5) * 8;
+    // Pulse ring (CSS animates only .pending)
+    node.append('circle').attr('class', 'node-pulse').attr('r', d => R(d) + 10);
 
-    node.append('circle').attr('r', radius);
+    // Background fill
+    node.append('circle').attr('class', 'node-bg').attr('r', d => R(d));
 
-    // Urgency ring
-    node.append('circle')
-        .attr('class', 'urgency-ring')
-        .attr('r', d => radius(d) + 5)
-        .attr('stroke', d => {
-            const u = d.urgency || 0;
-            return u > 0.7 ? 'var(--red)' : u > 0.4 ? 'var(--yellow)' : 'var(--green)';
-        })
-        .attr('stroke-opacity', d => (d.urgency || 0) * 0.6)
-        .attr('fill', 'none')
-        .attr('stroke-width', 1.5)
-        .attr('stroke-dasharray', '3,3');
+    // Status ring stroke
+    node.append('circle').attr('class', 'node-ring').attr('r', d => R(d));
 
-    // Labels
+    // Letter label (center)
     node.append('text')
-        .attr('dy', '-1px')
-        .text(d => d.label?.length > 12 ? d.label.slice(0, 10) + '…' : (d.label || d.id));
+        .attr('class', 'node-letter')
+        .attr('dominant-baseline', 'central')
+        .text(d => d.letter);
 
+    // Commitment label below node
     node.append('text')
-        .attr('class', 'node-sublabel')
-        .attr('dy', '14px')
+        .attr('class', 'node-label')
+        .attr('dy', d => R(d) + 14)
         .text(d => {
-            const hrs = d.estimated_duration_hours;
-            return hrs ? `${hrs}h` : '';
+            const lbl = d.label || d.id;
+            return lbl.length > 16 ? lbl.slice(0, 14) + '…' : lbl;
         });
 
+    // Hours hint (small, below label)
+    node.append('text')
+        .attr('class', 'node-deadline')
+        .attr('dy', d => R(d) + 26)
+        .text(d => d.estimated_duration_hours ? `${d.estimated_duration_hours}h` : '');
+
     // Force simulation
     d3Sim = d3.forceSimulation(nodes)
-        .force('link', d3.forceLink(links).id(d => d.id).distance(100).strength(0.5))
-        .force('charge', d3.forceManyBody().strength(-280))
-        .force('center', d3.forceCenter(W/2, H/2))
-        .force('collide', d3.forceCollide(d => radius(d) + 18))
+        .force('link',    d3.forceLink(links).id(d => d.id).distance(130).strength(0.45))
+        .force('charge',  d3.forceManyBody().strength(-380))
+        .force('center',  d3.forceCenter(W/2, H/2))
+        .force('collide', d3.forceCollide(d => R(d) + 32))
         .on('tick', () => {
-            link
-                .attr('x1', d => d.source.x).attr('y1', d => d.source.y)
-                .attr('x2', d => d.target.x).attr('y2', d => d.target.y);
+            link.attr('d', d => {
+                const src  = d.source, tgt = d.target;
+                const dx   = tgt.x - src.x, dy = tgt.y - src.y;
+                const dist = Math.sqrt(dx*dx + dy*dy) || 1;
+                const sr   = R(src) + 2, tr = R(tgt) + 2;
+                const sx   = src.x + (dx/dist)*sr, sy = src.y + (dy/dist)*sr;
+                const tx   = tgt.x - (dx/dist)*tr, ty = tgt.y - (dy/dist)*tr;
+                // Gentle curve to distinguish overlapping edges
+                const cx = (sx+tx)/2 - (dy/dist)*18;
+                const cy = (sy+ty)/2 + (dx/dist)*18;
+                return `M${sx},${sy} Q${cx},${cy} ${tx},${ty}`;
+            });
             node.attr('transform', d => `translate(${d.x},${d.y})`);
         });
 }
@@ -412,8 +477,8 @@ function renderNodePicker(state) {
     picker.innerHTML = '<option value="">— select commitment —</option>';
 
     (state.graph?.nodes || []).forEach(n => {
-        const o   = document.createElement('option');
-        o.value   = n.id;
+        const o  = document.createElement('option');
+        o.value  = n.id;
         const dur = n.estimated_duration_hours ? `${n.estimated_duration_hours}h` : '';
         o.textContent = `[${n.status}] ${n.label || n.id} ${dur}`;
         if (n.status !== 'pending') o.style.color = '#5b6b82';
@@ -425,30 +490,31 @@ function renderNodePicker(state) {
 function selectNode(nodeId) {
     selectedNode = nodeId;
     $('node-picker').value = nodeId;
-
-    // Highlight in graph
-    d3.selectAll('.node')
-        .classed('selected', d => d.id === nodeId);
-
+    d3.selectAll('.node').classed('selected', d => d.id === nodeId);
     renderTargetDetail(currentState);
 }
 
 function renderTargetDetail(state) {
     const el = $('target-detail');
-    if (!selectedNode || !state) { el.innerHTML = '<div class="td-empty">Click a graph node or select from dropdown</div>'; return; }
-
+    if (!selectedNode || !state) {
+        el.innerHTML = '<div class="td-empty">Click a graph node or select from dropdown</div>';
+        return;
+    }
     const node = (state.graph?.nodes || []).find(n => n.id === selectedNode);
     if (!node) { el.innerHTML = '<div class="td-empty">Node not found</div>'; return; }
 
-    const dl = node.deadline ? new Date(node.deadline).toLocaleString([], {month:'short',day:'numeric',hour:'2-digit',minute:'2-digit'}) : 'none';
+    const dl = node.deadline
+        ? new Date(node.deadline).toLocaleString([], {month:'short',day:'numeric',hour:'2-digit',minute:'2-digit'})
+        : 'flexible';
     const urgPct = Math.round((node.urgency || 0) * 100);
+    const urgColor = urgPct > 70 ? 'var(--s-failed)' : urgPct > 40 ? 'var(--s-at-risk)' : 'var(--s-completed)';
 
     el.innerHTML = `
         <div class="td-name">${node.label || node.id}</div>
-        <div class="td-row"><span class="td-k">Status</span><span class="td-v"><span class="td-status ${node.status}">${node.status}</span></span></div>
+        <div class="td-row"><span class="td-k">Status</span><span class="td-v"><span class="td-badge ${node.status}">${node.status}</span></span></div>
         <div class="td-row"><span class="td-k">Duration</span><span class="td-v">${node.estimated_duration_hours || '?'}h</span></div>
         <div class="td-row"><span class="td-k">Deadline</span><span class="td-v">${dl}</span></div>
-        <div class="td-row"><span class="td-k">Urgency</span><span class="td-v" style="color:${urgPct>70?'var(--red)':urgPct>40?'var(--yellow)':'var(--green)'}">${urgPct}%</span></div>
+        <div class="td-row"><span class="td-k">Urgency</span><span class="td-v" style="color:${urgColor}">${urgPct}%</span></div>
         <div class="td-row"><span class="td-k">Stakeholder</span><span class="td-v">${node.stakeholder_id || '—'}</span></div>
         ${node.type ? `<div class="td-row"><span class="td-k">Type</span><span class="td-v">${node.type}</span></div>` : ''}
     `;
@@ -458,54 +524,51 @@ function renderTargetDetail(state) {
 //  TRUST BARS
 // ═══════════════════════════════════════════════════════════
 function renderTrust(state) {
-    // API returns trust_scores: {sid: float} and optionally multidim_trust: {sid: {reliability,competence,benevolence}}
     const scores  = state.trust_scores  || state.trust_entries || {};
     const mdTrust = state.multidim_trust || {};
     const list    = $('trust-list');
     list.innerHTML = '';
 
-    const vals = Object.values(scores).map(v => typeof v === 'number' ? v : (v.trust_score || 0));
+    const vals = Object.values(scores).map(v => typeof v === 'number' ? v : (v?.trust_score || 0));
     const avg  = vals.length ? vals.reduce((a,b)=>a+b,0)/vals.length : null;
+
     const avgBadge = $('trust-avg-badge');
     if (avg !== null) {
-        avgBadge.textContent = `avg ${(avg*100).toFixed(0)}%`;
-        avgBadge.style.background = avg >= 0.6 ? 'hsla(142,50%,20%,0.3)' : avg >= 0.4 ? 'hsla(38,60%,20%,0.3)' : 'hsla(0,50%,20%,0.3)';
-        avgBadge.style.color = avg >= 0.6 ? 'var(--green)' : avg >= 0.4 ? 'var(--yellow)' : 'var(--red)';
+        avgBadge.textContent  = `avg ${(avg*100).toFixed(0)}%`;
+        avgBadge.className    = `mc-badge ${avg >= 0.6 ? 'green' : avg >= 0.4 ? 'blue' : 'red'}`;
+    }
+
+    if (!Object.keys(scores).length) {
+        list.innerHTML = '<div style="color:var(--t3);font-size:11px;padding:10px 14px">No stakeholders yet</div>';
+        return;
     }
 
     Object.entries(scores).forEach(([sid, raw]) => {
-        const score = typeof raw === 'number' ? raw : (raw.trust_score || 0);
+        const score = typeof raw === 'number' ? raw : (raw?.trust_score || 0);
         const pct   = Math.round(score * 100);
-        const cls   = score >= 0.65 ? 'high' : score >= 0.45 ? 'medium' : score >= 0.25 ? 'low' : 'critical';
+        const tier  = score >= 0.65 ? 'hi' : score >= 0.45 ? 'mid' : 'lo';
 
         const md = mdTrust[sid];
-        let dimsHtml = '';
-        if (md) {
-            dimsHtml = `
-                <div class="te-dims">
-                    <span class="te-dim">R:<span>${((md.reliability||0)*100).toFixed(0)}</span></span>
-                    <span class="te-dim">C:<span>${((md.competence||0)*100).toFixed(0)}</span></span>
-                    <span class="te-dim">B:<span>${((md.benevolence||0)*100).toFixed(0)}</span></span>
-                </div>`;
-        }
+        const dimsHtml = md ? `
+            <div class="te-dims">
+                <span class="te-dim">R:<span>${((md.reliability||0)*100).toFixed(0)}</span></span>
+                <span class="te-dim">C:<span>${((md.competence||0)*100).toFixed(0)}</span></span>
+                <span class="te-dim">B:<span>${((md.benevolence||0)*100).toFixed(0)}</span></span>
+            </div>` : '';
 
         list.insertAdjacentHTML('beforeend', `
-            <div class="trust-entry">
-                <div class="te-header">
+            <div class="te">
+                <div class="te-row1">
                     <span class="te-name">${sid}</span>
-                    <span class="te-score ${cls}">${pct}%</span>
-                </div>
-                <div class="te-bar-track">
-                    <div class="te-bar-fill ${cls}" style="width:${pct}%"></div>
+                    <div class="te-score-wrap">
+                        <span class="te-score ${tier}">${pct}%</span>
+                    </div>
                 </div>
+                <div class="te-track"><div class="te-fill ${tier}" style="width:${pct}%"></div></div>
                 ${dimsHtml}
             </div>
         `);
     });
-
-    if (!Object.keys(scores).length) {
-        list.innerHTML = '<div style="color:var(--text-3);font-size:11px;padding:4px 0">No stakeholders yet</div>';
-    }
 }
 
 // ═══════════════════════════════════════════════════════════
@@ -518,15 +581,25 @@ function renderCapacity(state) {
         .filter(n => ['accepted','in_progress'].includes(n.status))
         .reduce((s, n) => s + (n.estimated_duration_hours || 0), 0);
 
-    const pct  = Math.min(100, Math.round((committed / avail) * 100));
-    const cls  = pct >= 90 ? 'crit' : pct >= 70 ? 'warn' : '';
-
-    $('cap-committed').textContent = committed.toFixed(1) + 'h';
-    $('cap-available').textContent = avail.toFixed(1) + 'h';
+    const pct = Math.min(100, Math.round((committed / avail) * 100));
+    const cls = pct >= 90 ? 'crit' : pct >= 70 ? 'warn' : '';
 
-    const fill = $('cap-bar-fill');
-    fill.style.width = pct + '%';
-    fill.className   = 'cap-bar-fill' + (cls ? ' ' + cls : '');
+    $('capacity-display').innerHTML = `
+        <div class="cap-header">
+            <span class="cap-val">${committed.toFixed(1)}</span>
+            <span class="cap-sep">/</span>
+            <span class="cap-of">${avail.toFixed(1)}</span>
+            <span class="cap-unit">hours committed</span>
+        </div>
+        <div class="cap-track">
+            <div class="cap-fill${cls ? ' '+cls : ''}" style="width:${pct}%"></div>
+        </div>
+        <div class="cap-zones">
+            <span style="color:var(--s-completed)">Safe &lt;70%</span>
+            <span style="color:var(--s-at-risk)">⚠ 70–90%</span>
+            <span style="color:var(--s-failed)">Critical &gt;90%</span>
+        </div>
+    `;
 }
 
 // ═══════════════════════════════════════════════════════════
@@ -534,34 +607,31 @@ function renderCapacity(state) {
 // ═══════════════════════════════════════════════════════════
 function renderReward(stepData) {
     const el = $('reward-display');
-    if (!stepData?.reward_components && !stepData?.info?.reward_components) {
-        return;
-    }
+    if (!stepData?.reward_components && !stepData?.info?.reward_components) return;
 
-    const rc = stepData.info?.reward_components || stepData.reward_components;
-    const r  = stepData.reward || 0;
-
-    const rClass = r >= 0 ? 'pos' : 'neg';
-    const rSign  = r >= 0 ? '+' : '';
+    const rc    = stepData.info?.reward_components || stepData.reward_components;
+    const r     = stepData.reward || 0;
+    const rCls  = r >= 0 ? 'pos' : 'neg';
+    const rSign = r >= 0 ? '+' : '';
 
     const rows = [
-        { k: 'Fulfillment',     v: rc?.fulfillment     || 0 },
-        { k: 'Trust Δ',         v: rc?.trust_delta     || 0 },
-        { k: 'Proactive',       v: rc?.proactive       || 0 },
-        { k: 'Accuracy',        v: rc?.feasibility_acc || 0 },
-        { k: '— Broken',        v: -(rc?.broken_penalty || 0) },
-        { k: '— Over-refusal',  v: -(rc?.overrefusal_penalty || 0) },
-        { k: '— Silent drop',   v: -(rc?.silent_drop_penalty || 0) },
+        { k: 'Fulfillment',    v: rc?.fulfillment       || 0 },
+        { k: 'Trust Δ',        v: rc?.trust_delta        || 0 },
+        { k: 'Proactive',      v: rc?.proactive          || 0 },
+        { k: 'Accuracy',       v: rc?.feasibility_acc    || 0 },
+        { k: '— Broken',       v: -(rc?.broken_penalty    || 0) },
+        { k: '— Over-refusal', v: -(rc?.overrefusal_penalty || 0) },
+        { k: '— Silent drop',  v: -(rc?.silent_drop_penalty || 0) },
     ];
 
     el.innerHTML = `
-        <div class="rwd-total ${rClass}">${rSign}${r.toFixed(4)}</div>
+        <div class="rwd-total ${rCls}">${rSign}${r.toFixed(4)}</div>
         ${rows.map(row => {
-            const vCls = row.v > 0.001 ? 'pos' : row.v < -0.001 ? 'neg' : 'zero';
+            const vCls  = row.v > 0.001 ? 'pos' : row.v < -0.001 ? 'neg' : 'zero';
             const vSign = row.v >= 0 ? '+' : '';
             return `<div class="rwd-row">
-                <span class="rwd-key">${row.k}</span>
-                <span class="rwd-val ${vCls}">${vSign}${row.v.toFixed(4)}</span>
+                <span class="rwd-k">${row.k}</span>
+                <span class="rwd-v ${vCls}">${vSign}${row.v.toFixed(4)}</span>
             </div>`;
         }).join('')}
     `;
@@ -571,14 +641,13 @@ function renderReward(stepData) {
 //  CONVERSATION FEED
 // ═══════════════════════════════════════════════════════════
 function clearFeed() {
-    // Remove only .msg elements — leave #feed-empty intact
     document.querySelectorAll('#message-feed .msg').forEach(el => el.remove());
     $('feed-empty').classList.remove('hidden');
 }
 
 function feedMsg(html) {
-    const feed = $('message-feed');
     $('feed-empty').classList.add('hidden');
+    const feed = $('message-feed');
     feed.insertAdjacentHTML('beforeend', html);
     feed.scrollTop = feed.scrollHeight;
 }
@@ -603,32 +672,31 @@ function feedStakeholder(node) {
 }
 
 function feedThink(reasoning) {
-    // Parse structured reasoning into steps if it contains numbered lines
-    const lines = reasoning.split('\n').filter(l => l.trim());
-    const stepsHtml = lines.map(l => `<div class="think-step">${l.trim()}</div>`).join('');
+    const lines    = reasoning.split('\n').filter(l => l.trim());
+    const bodyHtml = lines.map(l => `<div>${l.trim()}</div>`).join('');
     feedMsg(`
         <div class="msg msg-think">
             <div class="think-header">🧠 Agent Reasoning</div>
-            <div class="think-body">${stepsHtml || reasoning}</div>
+            <div class="think-body">${bodyHtml || reasoning}</div>
         </div>
     `);
 }
 
 function feedDecision(actionType, node, reward, stakeholderResponses) {
-    const icons = { accept:'✅', decline:'❌', counter_propose:'🔄', do_nothing:'⏳', renegotiate:'🤝' };
-    const labels= { accept:'Accepted', decline:'Declined', counter_propose:'Counter-proposed', do_nothing:'Waited', renegotiate:'Renegotiated' };
-    const isPos = actionType === 'accept' || actionType === 'counter_propose';
-    const rSign = reward >= 0 ? '+' : '';
+    const icons  = { accept:'✅', decline:'❌', counter_propose:'🔄', do_nothing:'⏳', renegotiate:'🤝' };
+    const labels = { accept:'Accepted', decline:'Declined', counter_propose:'Counter-proposed', do_nothing:'Waited', renegotiate:'Renegotiated' };
+    const isPos  = ['accept','counter_propose','renegotiate'].includes(actionType);
+    const rSign  = reward >= 0 ? '+' : '';
 
     let responsesHtml = '';
     if (stakeholderResponses) {
         Object.entries(stakeholderResponses).forEach(([sid, msg]) => {
-            if (msg) responsesHtml += `<div style="margin-top:4px;font-size:11px;color:var(--text-3)"><em>${sid}: "${msg}"</em></div>`;
+            if (msg) responsesHtml += `<div style="margin-top:4px;font-size:11px;color:var(--t3)"><em>${sid}: "${msg}"</em></div>`;
         });
     }
 
     feedMsg(`
-        <div class="msg msg-decision ${isPos ? '' : 'negative'}">
+        <div class="msg msg-decision ${isPos ? '' : 'neg'}">
             <div class="md-action">${icons[actionType] || '•'} ${labels[actionType] || actionType}</div>
             <div class="md-target">${node ? `"${node.label || node.id}"` : '—'}</div>
             ${responsesHtml}
@@ -656,30 +724,28 @@ function pushTimeline(actionType, label, reward) {
     const rSign = reward >= 0 ? '+' : '';
 
     if (track.children.length > 0) {
-        track.insertAdjacentHTML('beforeend', '<div class="tl-connector"></div>');
+        track.insertAdjacentHTML('beforeend', '<div class="tl-conn"></div>');
     }
-
     track.insertAdjacentHTML('beforeend', `
         <div class="tl-step ${actionType}" title="Step ${step}: ${actionType} — ${label}">
             <div class="tl-icon">${icons[actionType] || '•'}</div>
-            <div class="tl-label2">s${step}</div>
-            <div class="tl-reward ${rCls}">${rSign}${reward.toFixed(2)}</div>
+            <div class="tl-num">s${step}</div>
+            <div class="tl-r ${rCls}">${rSign}${reward.toFixed(2)}</div>
         </div>
     `);
-
     track.scrollLeft = track.scrollWidth;
 }
 
 // ═══════════════════════════════════════════════════════════
-//  EVENT LOG (right panel)
+//  EVENT LOG
 // ═══════════════════════════════════════════════════════════
 function clearLog() { $('log-list').innerHTML = ''; }
 
 function logAdd(type, text) {
-    const el = document.createElement('div');
-    el.className = `log-item ${type}`;
+    const el       = document.createElement('div');
+    el.className   = `log-item ${type}`;
     el.textContent = text;
-    const list = $('log-list');
+    const list     = $('log-list');
     list.appendChild(el);
     while (list.children.length > 60) list.removeChild(list.firstChild);
     list.scrollTop = list.scrollHeight;
@@ -691,7 +757,7 @@ function logAdd(type, text) {
 async function fetchJSON(url, { method = 'GET', body } = {}) {
     const opts = { method, headers: { 'Content-Type': 'application/json' } };
     if (body) opts.body = JSON.stringify(body);
-    const res  = await fetch(url, opts);
+    const res = await fetch(url, opts);
     if (!res.ok) throw new Error(`HTTP ${res.status}`);
     return res.json();
 }
@@ -712,16 +778,16 @@ function actionIcon(type) {
 // ═══════════════════════════════════════════════════════════
 //  COMPARE MODE
 // ═══════════════════════════════════════════════════════════
-let compareData     = null;
-let compareStepIdx  = 0;
+let compareData      = null;
+let compareStepIdx   = 0;
 let compareAutoTimer = null;
 
 const SCENARIO_DESCS = {
-    scenario_04_deadline_crunch:             { icon:'⏰', name:'Deadline Crunch',          desc:'Back-to-back deadlines — agent must triage' },
-    scenario_07_simultaneous_infeasibility:  { icon:'💥', name:'Simultaneous Infeasibility',desc:'3 requests arrive at once — together impossible' },
-    scenario_10_deadline_cascade:            { icon:'🌊', name:'Deadline Cascade Chain',    desc:'A→B→C dependency chain — one slip cascades' },
-    scenario_11_impossible_math:             { icon:'🧮', name:'Impossible Math',           desc:'11.5h of work in 6h window — must decline' },
-    scenario_12_force_majeure_recovery:      { icon:'🚨', name:'Force Majeure Recovery',    desc:'P0 incident blocks 7h mid-episode — renegotiate everything' },
+    scenario_04_deadline_crunch:             { icon:'⏰', name:'Deadline Crunch',           desc:'Back-to-back deadlines — agent must triage' },
+    scenario_07_simultaneous_infeasibility:  { icon:'💥', name:'Simultaneous Infeasibility', desc:'3 requests arrive at once — together impossible' },
+    scenario_10_deadline_cascade:            { icon:'🌊', name:'Deadline Cascade Chain',     desc:'A→B→C dependency chain — one slip cascades' },
+    scenario_11_impossible_math:             { icon:'🧮', name:'Impossible Math',            desc:'11.5h of work in 6h window — must decline' },
+    scenario_12_force_majeure_recovery:      { icon:'🚨', name:'Force Majeure Recovery',     desc:'P0 incident blocks 7h mid-episode — renegotiate' },
 };
 
 function openCompare() {
@@ -752,10 +818,7 @@ async function runComparison() {
     $('cmp-body').classList.add('hidden');
 
     try {
-        const data = await fetchJSON(`${API}/api/compare`, {
-            method: 'POST',
-            body: { scenario_id: scenarioId },
-        });
+        const data     = await fetchJSON(`${API}/api/compare`, { method: 'POST', body: { scenario_id: scenarioId } });
         compareData    = data;
         compareStepIdx = 0;
 
@@ -766,7 +829,7 @@ async function runComparison() {
         renderCmpStep(0);
         $('cmp-step-label').textContent = `Step 1 / ${Math.max(data.naive.steps.length, data.vergil.steps.length)}`;
     } catch(e) {
-        $('cmp-loading').innerHTML = `<p style="color:var(--red)">Error: ${e.message}</p>`;
+        $('cmp-loading').innerHTML = `<p style="color:var(--s-failed)">Error: ${e.message}</p>`;
     }
 }
 
@@ -774,55 +837,48 @@ function renderCmpDeltas(data) {
     const n = data.naive.metrics;
     const v = data.vergil.metrics;
 
-    const rDelta    = (v.total_reward    || 0) - (n.total_reward    || 0);
-    const satDelta  = (v.final_sat       || 0) - (n.final_sat       || 0);
-    const failAvoid = (n.n_failed        || 0) - (v.n_failed        || 0);
-    const trustDelta= (v.avg_trust       || 0) - (n.avg_trust       || 0);
+    const rDelta    = (v.total_reward || 0) - (n.total_reward || 0);
+    const satDelta  = (v.final_sat    || 0) - (n.final_sat    || 0);
+    const failAvoid = (n.n_failed     || 0) - (v.n_failed     || 0);
+    const trustDelta= (v.avg_trust    || 0) - (n.avg_trust    || 0);
 
-    function fmt(val, isCount = false) {
-        const sign = val >= 0 ? '+' : '';
-        return isCount ? `${val >= 0 ? '+' : ''}${val}` : `${sign}${val.toFixed(2)}`;
-    }
-    function cls(val) { return val > 0 ? 'better' : val < 0 ? 'worse' : ''; }
+    const fmt = (val, isCount = false) =>
+        isCount ? `${val >= 0 ? '+' : ''}${val}` : `${val >= 0 ? '+' : ''}${val.toFixed(2)}`;
+    const cls = val => val > 0 ? 'better' : val < 0 ? 'worse' : '';
 
     $('dv-reward').textContent = fmt(rDelta);
-    $('dv-reward').className   = `dr-val ${cls(rDelta)}`;
-
+    $('dv-reward').className   = `dr-v ${cls(rDelta)}`;
     $('dv-sat').textContent    = fmt(satDelta * 100) + '%';
-    $('dv-sat').className      = `dr-val ${cls(satDelta)}`;
-
+    $('dv-sat').className      = `dr-v ${cls(satDelta)}`;
     $('dv-fail').textContent   = fmt(failAvoid, true);
-    $('dv-fail').className     = `dr-val ${cls(failAvoid)}`;
-
+    $('dv-fail').className     = `dr-v ${cls(failAvoid)}`;
     $('dv-trust').textContent  = fmt(trustDelta * 100) + '%';
-    $('dv-trust').className    = `dr-val ${cls(trustDelta)}`;
+    $('dv-trust').className    = `dr-v ${cls(trustDelta)}`;
 
-    // Verdict
     const improved = [rDelta > 0, satDelta > 0, failAvoid >= 0, trustDelta > 0].filter(Boolean).length;
     $('cmp-verdict').textContent =
         improved >= 3 ? '✅ VERGIL significantly outperforms naive agent' :
         improved >= 2 ? '↑ VERGIL shows clear improvement' :
         '~ Results comparable — try a harder scenario';
 
-    // Naive & VERGIL final stats
     renderSideStats('naive-stats',  n);
     renderSideStats('vergil-stats', v);
-
-    // Draw final CDG states
     renderMiniGraph('#cmp-svg-naive',  data.naive.final_graph,  'naive');
     renderMiniGraph('#cmp-svg-vergil', data.vergil.final_graph, 'vergil');
 }
 
 function renderSideStats(elId, metrics) {
-    $(`${elId}`).innerHTML = `
-        <div class="css-stat"><div class="css-label">Reward</div>
-            <div class="css-val" style="color:${(metrics.total_reward||0)>=0?'var(--green)':'var(--red)'}">${(metrics.total_reward||0) >= 0 ? '+' : ''}${(metrics.total_reward||0).toFixed(2)}</div></div>
-        <div class="css-stat"><div class="css-label">SAT</div>
-            <div class="css-val">${Math.round((metrics.final_sat||0)*100)}%</div></div>
-        <div class="css-stat"><div class="css-label">Failed</div>
-            <div class="css-val" style="color:${(metrics.n_failed||0)>0?'var(--red)':'var(--green)'}">${metrics.n_failed||0}</div></div>
-        <div class="css-stat"><div class="css-label">Trust</div>
-            <div class="css-val">${Math.round((metrics.avg_trust||0)*100)}%</div></div>
+    const rColor = (metrics.total_reward||0) >= 0 ? 'var(--s-completed)' : 'var(--s-failed)';
+    const fColor = (metrics.n_failed||0) > 0 ? 'var(--s-failed)' : 'var(--s-completed)';
+    $(elId).innerHTML = `
+        <div class="css-stat"><div class="css-lbl">Reward</div>
+            <div class="css-v" style="color:${rColor}">${(metrics.total_reward||0) >= 0 ? '+' : ''}${(metrics.total_reward||0).toFixed(2)}</div></div>
+        <div class="css-stat"><div class="css-lbl">SAT</div>
+            <div class="css-v">${Math.round((metrics.final_sat||0)*100)}%</div></div>
+        <div class="css-stat"><div class="css-lbl">Failed</div>
+            <div class="css-v" style="color:${fColor}">${metrics.n_failed||0}</div></div>
+        <div class="css-stat"><div class="css-lbl">Trust</div>
+            <div class="css-v">${Math.round((metrics.avg_trust||0)*100)}%</div></div>
     `;
 }
 
@@ -839,31 +895,28 @@ function renderCmpStep(idx) {
     const vStep = vSteps[compareStepIdx];
 
     function stepHtml(step, isVergil) {
-        if (!step) return '<em style="color:var(--text-3)">No action</em>';
+        if (!step) return '<em style="color:var(--t3)">No action</em>';
         const icon = actionIcon(step.action);
         const r    = step.reward || 0;
         const rS   = r >= 0 ? '+' : '';
         if (isVergil && step.reasoning) {
             return `${icon} <strong>${step.action}</strong> → ${step.target || '—'}<br>
                 <span style="color:#c084fc;margin-top:3px;display:block">🧠 ${step.reasoning}</span>
-                <span style="color:var(--text-3)">${rS}${r.toFixed(3)}</span>`;
+                <span style="color:var(--t3)">${rS}${r.toFixed(3)}</span>`;
         }
-        return `${icon} <strong>${step.action}</strong> → ${step.target || '—'}<span style="color:var(--text-3);margin-left:8px">${rS}${r.toFixed(3)}</span>`;
+        return `${icon} <strong>${step.action}</strong> → ${step.target || '—'}<span style="color:var(--t3);margin-left:8px">${rS}${r.toFixed(3)}</span>`;
     }
 
-    $('naive-step-display').innerHTML   = stepHtml(nStep, false);
-    $('vergil-step-display').innerHTML  = stepHtml(vStep, true);
+    $('naive-step-display').innerHTML  = stepHtml(nStep, false);
+    $('vergil-step-display').innerHTML = stepHtml(vStep, true);
 
-    // If any naive step caused a failure, animate cascade
     if (nStep?.caused_failure) {
         $('cmp-svg-naive').classList.add('cascade-active');
         setTimeout(() => $('cmp-svg-naive').classList.remove('cascade-active'), 800);
     }
 }
 
-function compareStep(delta) {
-    renderCmpStep(compareStepIdx + delta);
-}
+function compareStep(delta) { renderCmpStep(compareStepIdx + delta); }
 
 function toggleCompareAuto() {
     const btn = $('btn-cmp-auto');
@@ -890,41 +943,41 @@ function stopCompareAuto() {
 }
 
 function renderMiniGraph(svgSelector, graphData, side) {
-    if (!graphData || !graphData.nodes?.length) return;
-
-    const svgEl    = document.querySelector(svgSelector);
+    if (!graphData?.nodes?.length) return;
+    const svgEl = document.querySelector(svgSelector);
     if (!svgEl) return;
     const W = svgEl.clientWidth  || 500;
     const H = svgEl.clientHeight || 300;
 
-    const svg = d3.select(svgSelector);
+    const svg   = d3.select(svgSelector);
     svg.selectAll('*').remove();
 
+    const colorMap = {
+        pending:   '#818cf8', accepted:  '#38bdf8',
+        completed: '#34d399', failed:    '#fb7185',
+    };
+
     const g     = svg.append('g');
-    const nodes = graphData.nodes.map(n => ({...n, x: W/2 + (Math.random()-.5)*200, y: H/2 + (Math.random()-.5)*200 }));
+    const nodes = graphData.nodes.map(n => ({ ...n, x: W/2 + (Math.random()-.5)*200, y: H/2 + (Math.random()-.5)*200 }));
     const links = (graphData.edges || []).map(e => ({...e}));
 
-    const colorByStatus = s => ({
-        pending:   '#eab308', accepted: '#3b82f6',
-        completed: '#22c55e', failed:   '#ef4444',
-    }[s] || '#5b6b82');
-
     const link = g.append('g').selectAll('line').data(links).join('line')
-        .attr('stroke', '#334155').attr('stroke-width', 1.5).attr('stroke-opacity', 0.5);
+        .attr('stroke', '#2d3f58').attr('stroke-width', 1.5).attr('stroke-opacity', 0.6);
 
     const node = g.append('g').selectAll('g').data(nodes).join('g');
 
     node.append('circle')
-        .attr('r', d => 10 + (d.urgency||0.5)*6)
-        .attr('fill', d => `${colorByStatus(d.status)}22`)
-        .attr('stroke', d => colorByStatus(d.status))
-        .attr('stroke-width', d => d.status === 'failed' ? 3 : 1.5)
+        .attr('r', d => 10 + (d.urgency||0.5)*5)
+        .attr('fill', d => `${colorMap[d.status] || '#475569'}18`)
+        .attr('stroke', d => colorMap[d.status] || '#475569')
+        .attr('stroke-width', d => d.status === 'failed' ? 2.5 : 1.5)
         .style('filter', d => d.status === 'failed' && side === 'naive'
-            ? 'drop-shadow(0 0 8px rgba(239,68,68,0.8))' : 'none');
+            ? 'drop-shadow(0 0 8px rgba(251,113,133,0.8))' : 'none');
 
     node.append('text')
         .attr('text-anchor', 'middle').attr('dominant-baseline', 'central')
-        .attr('fill', '#94a3b8').attr('font-size', '9px').attr('pointer-events', 'none')
+        .attr('fill', '#94a3b8').attr('font-size', '9px').attr('font-weight', '600')
+        .attr('pointer-events', 'none')
         .text(d => d.label?.slice(0,8) || d.id?.slice(0,6));
 
     const sim = d3.forceSimulation(nodes)
@@ -938,6 +991,5 @@ function renderMiniGraph(svgSelector, graphData, side) {
             node.attr('transform', d=>`translate(${d.x},${d.y})`);
         });
 
-    // Stop after settling
     setTimeout(() => sim.stop(), 3000);
 }

frontend/index.html

@@ -18,25 +18,25 @@
             <span class="brand-glyph">⟁</span>
             <span class="brand-name">VERGIL</span>
         </div>
-        <div class="badge" id="badge-stage">Stage 1</div>
+        <span class="brand-version" id="badge-stage">Stage 1</span>
     </div>
 
-    <div class="topbar-stats">
-        <div class="stat-pill">
-            <span class="sp-label">STEP</span>
-            <span class="sp-val" id="stat-step">0</span>
+    <div class="topbar-center">
+        <div class="stat-chip">
+            <span class="sc-label">STEP</span>
+            <span class="sc-val" id="stat-step">0</span>
         </div>
-        <div class="stat-pill">
-            <span class="sp-label">REWARD</span>
-            <span class="sp-val" id="stat-reward">+0.00</span>
+        <div class="stat-chip">
+            <span class="sc-label">REWARD</span>
+            <span class="sc-val" id="stat-reward">+0.00</span>
         </div>
-        <div class="stat-pill">
-            <span class="sp-label">HEALTH</span>
-            <span class="sp-val" id="stat-sat">—</span>
+        <div class="stat-chip">
+            <span class="sc-label">HEALTH</span>
+            <span class="sc-val" id="stat-sat">—</span>
         </div>
-        <div class="stat-pill">
-            <span class="sp-label">LOAD</span>
-            <span class="sp-val" id="stat-load">—</span>
+        <div class="stat-chip">
+            <span class="sc-label">LOAD</span>
+            <span class="sc-val" id="stat-load">—</span>
         </div>
     </div>
 
@@ -49,6 +49,42 @@
     </div>
 </header>
 
+<!-- ══════════════════ KPI STRIP ══════════════════ -->
+<div id="kpi-strip">
+    <div class="kpi-card fulfill">
+        <div class="kpi-label">Fulfillment Rate</div>
+        <div class="kpi-row">
+            <div class="kpi-val" id="kpi-fulfill">—</div>
+            <div class="kpi-delta" id="kpi-fulfill-delta"></div>
+        </div>
+        <div class="kpi-sub">commitments completed</div>
+    </div>
+    <div class="kpi-card trust">
+        <div class="kpi-label">Avg Trust Score</div>
+        <div class="kpi-row">
+            <div class="kpi-val" id="kpi-trust">—</div>
+            <div class="kpi-delta" id="kpi-trust-delta"></div>
+        </div>
+        <div class="kpi-sub">across all stakeholders</div>
+    </div>
+    <div class="kpi-card cascade">
+        <div class="kpi-label">Cascade Events</div>
+        <div class="kpi-row">
+            <div class="kpi-val" id="kpi-cascade">0</div>
+            <div class="kpi-delta" id="kpi-cascade-delta"></div>
+        </div>
+        <div class="kpi-sub">dependency failures</div>
+    </div>
+    <div class="kpi-card health">
+        <div class="kpi-label">CDG Health</div>
+        <div class="kpi-row">
+            <div class="kpi-val" id="kpi-health">—</div>
+            <div class="kpi-delta" id="kpi-health-delta"></div>
+        </div>
+        <div class="kpi-sub">satisfiability score</div>
+    </div>
+</div>
+
 <!-- ══════════════════ THREE-COLUMN THEATER ══════════════════ -->
 <main id="theater">
 
@@ -56,17 +92,15 @@
     <section id="conv-panel">
 
         <div id="scenario-header">
-            <div class="sh-icon" id="sh-icon">💡</div>
-            <div class="sh-body">
-                <div class="sh-title" id="sh-title">Start an episode to begin</div>
-                <div class="sh-sub" id="sh-sub">Select a scenario and click New Episode</div>
-            </div>
+            <div class="sh-eyebrow">Current Scenario</div>
+            <div class="sh-title" id="sh-title">Start an episode to begin</div>
+            <div class="sh-sub" id="sh-sub">Select a scenario and click New Episode</div>
         </div>
 
         <div id="message-feed">
             <div class="feed-empty" id="feed-empty">
                 <div class="fe-icon">🧠</div>
-                <div>Agent reasoning will appear here as it makes decisions.</div>
+                <div class="fe-text">Agent reasoning will appear here as it makes decisions through the Commitment Dependency Graph.</div>
             </div>
         </div>
 
@@ -89,10 +123,11 @@
     <section id="graph-panel">
         <div id="graph-header-bar">
             <span class="ghb-title">Commitment Dependency Graph</span>
-            <div class="ghb-indicators">
-                <span class="ghb-dot" id="ghb-pending">0 pending</span>
-                <span class="ghb-dot" id="ghb-active">0 active</span>
-                <span class="ghb-dot" id="ghb-failed">0 failed</span>
+            <div class="ghb-chips">
+                <span class="ghb-chip pending" id="ghb-pending">0 pending</span>
+                <span class="ghb-chip active" id="ghb-active">0 active</span>
+                <span class="ghb-chip completed" id="ghb-completed">0 done</span>
+                <span class="ghb-chip failed" id="ghb-failed">0 failed</span>
             </div>
         </div>
 
@@ -111,6 +146,7 @@
             <span class="gl-item"><span class="gl-dot accepted"></span>Accepted</span>
             <span class="gl-item"><span class="gl-dot completed"></span>Completed</span>
             <span class="gl-item"><span class="gl-dot failed"></span>Failed</span>
+            <span class="gl-item"><span class="gl-dot at-risk"></span>At Risk</span>
             <span class="gl-item"><span class="gl-line dep"></span>Depends on</span>
             <span class="gl-item"><span class="gl-line conflict"></span>Conflicts</span>
         </div>
@@ -121,37 +157,22 @@
 
         <!-- Trust Network -->
         <div class="mc" id="mc-trust">
-            <div class="mc-title">
+            <div class="mc-hd">
                 <span>Trust Network</span>
-                <span class="mc-subtitle" id="trust-avg-badge">avg —</span>
+                <span class="mc-badge blue" id="trust-avg-badge">avg —</span>
             </div>
             <div id="trust-list"></div>
         </div>
 
         <!-- Schedule Capacity -->
         <div class="mc" id="mc-capacity">
-            <div class="mc-title">Schedule Capacity</div>
-            <div id="capacity-display">
-                <div class="cap-numbers">
-                    <span id="cap-committed">—h</span>
-                    <span class="cap-slash">/</span>
-                    <span id="cap-available">—h</span>
-                    <span class="cap-label">committed of available (48h window)</span>
-                </div>
-                <div class="cap-bar-track">
-                    <div class="cap-bar-fill" id="cap-bar-fill"></div>
-                </div>
-                <div class="cap-legend">
-                    <span class="cap-ok">Safe &lt;70%</span>
-                    <span class="cap-warn">Warning 70–90%</span>
-                    <span class="cap-crit">Critical &gt;90%</span>
-                </div>
-            </div>
+            <div class="mc-hd">Schedule Capacity</div>
+            <div id="capacity-display"></div>
         </div>
 
         <!-- Last Decision Score -->
         <div class="mc" id="mc-reward">
-            <div class="mc-title">Last Decision Score</div>
+            <div class="mc-hd">Last Decision Score</div>
             <div id="reward-display">
                 <div class="rwd-empty">Take an action to see reward breakdown</div>
             </div>
@@ -159,7 +180,7 @@
 
         <!-- Node Detail -->
         <div class="mc" id="mc-target">
-            <div class="mc-title">Selected Commitment</div>
+            <div class="mc-hd">Selected Commitment</div>
             <div id="target-detail">
                 <div class="td-empty">Click a graph node or select from the dropdown</div>
             </div>
@@ -167,7 +188,7 @@
 
         <!-- Event Log -->
         <div class="mc mc-log" id="mc-log">
-            <div class="mc-title">Event Log</div>
+            <div class="mc-hd">Event Log</div>
             <div id="log-list"></div>
         </div>
 
@@ -186,7 +207,7 @@
 
     <div class="cmp-topbar">
         <div class="cmp-scenario-info" id="cmp-scenario-info">
-            <span class="cmp-scenario-icon" id="cmp-scenario-icon">⚡</span>
+            <span class="cmp-icon" id="cmp-scenario-icon">⚡</span>
             <div>
                 <div class="cmp-scenario-name" id="cmp-scenario-name">Select a scenario</div>
                 <div class="cmp-scenario-desc" id="cmp-scenario-desc">Loading…</div>
@@ -218,46 +239,46 @@
 
         <!-- LEFT: Naive agent -->
         <div class="cmp-side naive-side">
-            <div class="cmp-side-header naive-header">
+            <div class="cmp-side-hd naive-hd">
                 <span class="csh-badge">❌ Naive Agent</span>
-                <span class="csh-desc">Accepts everything — cascade inevitable</span>
+                <span class="csh-sub">Accepts everything — cascade inevitable</span>
             </div>
             <svg id="cmp-svg-naive" class="cmp-svg"></svg>
             <div class="cmp-side-stats" id="naive-stats"></div>
-            <div class="cmp-side-step" id="naive-step-display"></div>
+            <div class="cmp-step-display" id="naive-step-display"></div>
         </div>
 
         <!-- CENTER: Delta column -->
         <div class="cmp-center">
             <div class="cmp-delta-title">IMPROVEMENT</div>
             <div class="delta-row" id="d-reward">
-                <div class="dr-label">Reward Δ</div>
-                <div class="dr-val" id="dv-reward">—</div>
+                <div class="dr-lbl">Reward Δ</div>
+                <div class="dr-v" id="dv-reward">—</div>
             </div>
             <div class="delta-row" id="d-sat">
-                <div class="dr-label">Health Δ</div>
-                <div class="dr-val" id="dv-sat">—</div>
+                <div class="dr-lbl">Health Δ</div>
+                <div class="dr-v" id="dv-sat">—</div>
             </div>
             <div class="delta-row" id="d-fail">
-                <div class="dr-label">Failures Avoided</div>
-                <div class="dr-val" id="dv-fail">—</div>
+                <div class="dr-lbl">Failures Avoided</div>
+                <div class="dr-v" id="dv-fail">—</div>
             </div>
             <div class="delta-row" id="d-trust">
-                <div class="dr-label">Trust Δ</div>
-                <div class="dr-val" id="dv-trust">—</div>
+                <div class="dr-lbl">Trust Δ</div>
+                <div class="dr-v" id="dv-trust">—</div>
             </div>
             <div class="cmp-verdict" id="cmp-verdict"></div>
         </div>
 
         <!-- RIGHT: VERGIL agent -->
         <div class="cmp-side vergil-side">
-            <div class="cmp-side-header vergil-header">
+            <div class="cmp-side-hd vergil-hd">
                 <span class="csh-badge">✅ VERGIL Agent</span>
-                <span class="csh-desc">Reasons through CDG before deciding</span>
+                <span class="csh-sub">Reasons through CDG before deciding</span>
             </div>
             <svg id="cmp-svg-vergil" class="cmp-svg"></svg>
             <div class="cmp-side-stats" id="vergil-stats"></div>
-            <div class="cmp-side-step cmp-think-block" id="vergil-step-display"></div>
+            <div class="cmp-step-display cmp-think-display" id="vergil-step-display"></div>
         </div>
 
     </div>

frontend/style.css

@@ -1,801 +1,773 @@
 /* ═══════════════════════════════════════════════════════════
-   VERGIL — Design System v4 (Theater Layout)
+   VERGIL — Design System v5 (Senior UX Rebuild)
    ═══════════════════════════════════════════════════════════ */
 
-/* ── Reset & Tokens ──────────────────────────────────────── */
 *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
 
 :root {
-    --bg:         #080c18;
-    --bg-panel:   #0d1322;
-    --bg-card:    #111827;
-    --bg-hover:   #1a2236;
-    --bg-input:   #0b1020;
-    --bg-topbar:  rgba(8, 12, 24, 0.95);
-
-    --border:     hsla(220, 30%, 26%, 0.45);
-    --border-hi:  hsla(210, 80%, 55%, 0.5);
-
-    --text-1:  #e8ecf4;
-    --text-2:  #94a3b8;
-    --text-3:  #5b6b82;
-
-    --blue:    #3b82f6;
-    --green:   #22c55e;
-    --red:     #ef4444;
-    --yellow:  #eab308;
-    --purple:  #a855f7;
-    --cyan:    #06b6d4;
-    --orange:  #f97316;
-
-    --r:    8px;
-    --r-sm: 5px;
-    --r-lg: 14px;
-
-    --font: 'Inter', -apple-system, system-ui, sans-serif;
-    --mono: 'JetBrains Mono', 'SF Mono', monospace;
-
-    --topbar-h: 52px;
-    --timeline-h: 56px;
-    --conv-w: 290px;
-    --metrics-w: 268px;
+  /* Slate-based dark — readable contrast, not pure black */
+  --bg:        #0f172a;
+  --bg-panel:  #1e293b;
+  --bg-card:   #1e293b;
+  --bg-card-hi:#253047;
+  --bg-topbar: rgba(15,23,42,0.96);
+  --bg-input:  #131f35;
+  --border:    #2d3f58;
+  --border-hi: #4c6078;
+
+  /* Text */
+  --t1: #f1f5f9;
+  --t2: #94a3b8;
+  --t3: #64748b;
+  --t4: #475569;
+
+  /* Status — semantic, not alarming */
+  --s-pending:   #818cf8;   /* indigo */
+  --s-accepted:  #38bdf8;   /* sky */
+  --s-completed: #34d399;   /* emerald */
+  --s-failed:    #fb7185;   /* rose */
+  --s-at-risk:   #fbbf24;   /* amber */
+
+  /* KPI accent strip */
+  --kpi-fulfill: #34d399;
+  --kpi-trust:   #60a5fa;
+  --kpi-cascade: #fb7185;
+  --kpi-health:  #a78bfa;
+
+  /* Brand */
+  --brand:  #6366f1;
+  --brand2: #8b5cf6;
+
+  --r:    10px;
+  --r-sm: 6px;
+  --r-lg: 16px;
+
+  --font: 'Inter', -apple-system, system-ui, sans-serif;
+  --mono: 'JetBrains Mono', 'SF Mono', monospace;
+
+  --topbar-h:  52px;
+  --kpi-h:     72px;
+  --timeline-h:60px;
+  --conv-w:    272px;
+  --metrics-w: 256px;
 }
 
 html, body {
-    height: 100%;
-    font-family: var(--font);
-    font-size: 13px;
-    background: var(--bg);
-    color: var(--text-1);
-    overflow: hidden;
-    -webkit-font-smoothing: antialiased;
+  height: 100%; overflow: hidden;
+  font-family: var(--font); font-size: 13px;
+  background: var(--bg); color: var(--t1);
+  -webkit-font-smoothing: antialiased;
 }
 .hidden { display: none !important; }
 
-/* ══════════════════════════════════════════════════════════
+/* ══════════════════════════════════════════════
    TOP BAR
-══════════════════════════════════════════════════════════ */
+══════════════════════════════════════════════ */
 #topbar {
-    position: fixed; top: 0; left: 0; right: 0; z-index: 200;
-    height: var(--topbar-h);
-    display: flex; align-items: center; justify-content: space-between;
-    padding: 0 16px;
-    background: var(--bg-topbar);
-    border-bottom: 1px solid var(--border);
-    backdrop-filter: blur(16px);
+  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
+  height: var(--topbar-h);
+  display: flex; align-items: center; justify-content: space-between;
+  padding: 0 20px;
+  background: var(--bg-topbar);
+  border-bottom: 1px solid var(--border);
+  backdrop-filter: blur(20px);
 }
 
-.topbar-left { display: flex; align-items: center; gap: 12px; }
-
-.brand { display: flex; align-items: center; gap: 7px; }
+.brand { display: flex; align-items: center; gap: 8px; }
 .brand-glyph {
-    font-size: 22px;
-    filter: drop-shadow(0 0 8px rgba(59,130,246,0.6));
+  width: 30px; height: 30px;
+  display: flex; align-items: center; justify-content: center;
+  background: linear-gradient(135deg, var(--brand), var(--brand2));
+  border-radius: 8px;
+  font-size: 17px; font-weight: 900; color: #fff;
+  box-shadow: 0 0 16px rgba(99,102,241,0.35);
 }
 .brand-name {
-    font-size: 16px; font-weight: 800; letter-spacing: 2px;
-    background: linear-gradient(135deg, #60a5fa, #a855f7);
-    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
+  font-size: 17px; font-weight: 800; letter-spacing: 2.5px;
+  color: var(--t1);
 }
-
-.badge {
-    font-family: var(--mono); font-size: 10px; font-weight: 600;
-    padding: 3px 9px; border-radius: 50px;
-    background: hsla(200,70%,50%,0.12);
-    color: var(--cyan); border: 1px solid hsla(200,70%,50%,0.25);
-    letter-spacing: 0.5px;
+.brand-version {
+  font-size: 10px; font-weight: 600; letter-spacing: 1px;
+  padding: 2px 8px; border-radius: 50px;
+  background: rgba(99,102,241,0.15); color: var(--brand);
+  border: 1px solid rgba(99,102,241,0.3);
 }
 
-.topbar-stats { display: flex; align-items: center; gap: 4px; }
-
-.stat-pill {
-    display: flex; align-items: center; gap: 6px;
-    padding: 4px 12px;
-    background: hsla(220,30%,14%,0.7);
-    border: 1px solid var(--border);
-    border-radius: 50px;
+.topbar-center {
+  display: flex; align-items: center; gap: 6px;
+}
+.stat-chip {
+  display: flex; align-items: center; gap: 7px;
+  padding: 5px 14px;
+  background: var(--bg-panel);
+  border: 1px solid var(--border);
+  border-radius: 50px;
 }
-.sp-label {
-    font-size: 9px; font-weight: 700; letter-spacing: 1.2px;
-    text-transform: uppercase; color: var(--text-3);
+.sc-label {
+  font-size: 9px; font-weight: 700; text-transform: uppercase;
+  letter-spacing: 1.2px; color: var(--t3);
 }
-.sp-val {
-    font-family: var(--mono); font-size: 14px; font-weight: 700;
-    color: var(--text-1);
+.sc-val {
+  font-family: var(--mono); font-size: 15px; font-weight: 700; color: var(--t1);
 }
 
 .topbar-right { display: flex; align-items: center; gap: 8px; }
 
 .top-select {
-    font-family: var(--mono); font-size: 11px;
-    padding: 5px 10px;
-    background: var(--bg-input); color: var(--text-2);
-    border: 1px solid var(--border); border-radius: var(--r-sm);
-    outline: none; cursor: pointer;
+  font-family: var(--font); font-size: 12px;
+  padding: 6px 10px;
+  background: var(--bg-input); color: var(--t2);
+  border: 1px solid var(--border); border-radius: var(--r-sm);
+  outline: none; cursor: pointer; max-width: 160px;
 }
 .top-select:focus { border-color: var(--border-hi); }
 
 .btn-primary {
-    font-family: var(--font); font-size: 12px; font-weight: 600;
-    padding: 6px 16px;
-    background: var(--blue); color: #fff;
-    border: none; border-radius: var(--r-sm); cursor: pointer;
-    transition: background 180ms, transform 120ms;
+  font-size: 12px; font-weight: 600; padding: 7px 18px;
+  background: var(--brand); color: #fff;
+  border: none; border-radius: var(--r-sm); cursor: pointer;
+  transition: all 160ms;
 }
-.btn-primary:hover { background: #2563eb; transform: translateY(-1px); }
-.btn-primary:active { transform: translateY(0); }
+.btn-primary:hover { background: #4f46e5; transform: translateY(-1px); }
 
 .btn-ghost {
-    font-family: var(--font); font-size: 12px; font-weight: 500;
-    padding: 6px 14px;
-    background: transparent; color: var(--text-2);
-    border: 1px solid var(--border); border-radius: var(--r-sm); cursor: pointer;
-    transition: border-color 180ms, color 180ms;
-}
-.btn-ghost:hover { border-color: var(--border-hi); color: var(--text-1); }
-
-/* ══════════════════════════════════════════════════════════
-   THREE-COLUMN THEATER
-══════════════════════════════════════════════════════════ */
+  font-size: 12px; font-weight: 500; padding: 7px 14px;
+  background: transparent; color: var(--t2);
+  border: 1px solid var(--border); border-radius: var(--r-sm); cursor: pointer;
+  transition: all 160ms;
+}
+.btn-ghost:hover { border-color: var(--border-hi); color: var(--t1); }
+
+/* ══════════════════════════════════════════════
+   KPI STRIP
+══════════════════════════════════════════════ */
+#kpi-strip {
+  position: fixed; top: var(--topbar-h); left: 0; right: 0; z-index: 190;
+  height: var(--kpi-h);
+  display: grid; grid-template-columns: repeat(4, 1fr);
+  border-bottom: 1px solid var(--border);
+  background: var(--bg-panel);
+}
+
+.kpi-card {
+  display: flex; flex-direction: column; justify-content: center;
+  padding: 10px 20px;
+  border-right: 1px solid var(--border);
+  position: relative; overflow: hidden;
+}
+.kpi-card:last-child { border-right: none; }
+.kpi-card::before {
+  content: ''; position: absolute;
+  bottom: 0; left: 0; right: 0; height: 3px;
+}
+.kpi-card.fulfill::before { background: var(--kpi-fulfill); }
+.kpi-card.trust::before   { background: var(--kpi-trust); }
+.kpi-card.cascade::before { background: var(--kpi-cascade); }
+.kpi-card.health::before  { background: var(--kpi-health); }
+
+.kpi-label {
+  font-size: 9px; font-weight: 700; text-transform: uppercase;
+  letter-spacing: 1.4px; color: var(--t3); margin-bottom: 3px;
+}
+.kpi-row { display: flex; align-items: baseline; gap: 10px; }
+.kpi-val {
+  font-family: var(--mono); font-size: 26px; font-weight: 800;
+  line-height: 1;
+}
+.kpi-card.fulfill .kpi-val { color: var(--kpi-fulfill); }
+.kpi-card.trust   .kpi-val { color: var(--kpi-trust); }
+.kpi-card.cascade .kpi-val { color: var(--kpi-cascade); }
+.kpi-card.health  .kpi-val { color: var(--kpi-health); }
+
+.kpi-sub {
+  font-size: 10px; color: var(--t3); line-height: 1;
+}
+.kpi-delta {
+  font-size: 10px; font-weight: 700; font-family: var(--mono);
+}
+.kpi-delta.up   { color: var(--s-completed); }
+.kpi-delta.down { color: var(--s-failed); }
+
+/* ══════════════════════════════════════════════
+   THEATER LAYOUT
+══════════════════════════════════════════════ */
 #theater {
-    position: fixed;
-    top: var(--topbar-h);
-    bottom: var(--timeline-h);
-    left: 0; right: 0;
-    display: grid;
-    grid-template-columns: var(--conv-w) 1fr var(--metrics-w);
-    overflow: hidden;
+  position: fixed;
+  top: calc(var(--topbar-h) + var(--kpi-h));
+  bottom: var(--timeline-h);
+  left: 0; right: 0;
+  display: grid;
+  grid-template-columns: var(--conv-w) 1fr var(--metrics-w);
+  overflow: hidden;
 }
 
-/* ── CONV PANEL ─────────────────────────────────────────── */
+/* ── LEFT: Conversation Panel ─────────────────── */
 #conv-panel {
-    display: flex; flex-direction: column;
-    border-right: 1px solid var(--border);
-    background: hsla(220,25%,7%,0.8);
-    overflow: hidden;
+  display: flex; flex-direction: column;
+  border-right: 1px solid var(--border);
+  background: var(--bg);
+  overflow: hidden;
 }
 
 #scenario-header {
-    display: flex; align-items: flex-start; gap: 10px;
-    padding: 12px 14px;
-    border-bottom: 1px solid var(--border);
-    flex-shrink: 0;
-    background: hsla(220,30%,10%,0.6);
+  padding: 12px 14px;
+  border-bottom: 1px solid var(--border);
+  background: var(--bg-panel);
+  flex-shrink: 0;
 }
-.sh-icon { font-size: 22px; margin-top: 1px; flex-shrink: 0; }
-.sh-title { font-size: 13px; font-weight: 600; color: var(--text-1); line-height: 1.4; }
-.sh-sub   { font-size: 11px; color: var(--text-3); margin-top: 2px; line-height: 1.4; }
+.sh-eyebrow {
+  font-size: 9px; font-weight: 700; text-transform: uppercase;
+  letter-spacing: 1.4px; color: var(--t3); margin-bottom: 4px;
+}
+.sh-title { font-size: 13px; font-weight: 700; color: var(--t1); line-height: 1.3; margin-bottom: 2px; }
+.sh-sub   { font-size: 11px; color: var(--t3); }
 
 #message-feed {
-    flex: 1; overflow-y: auto; padding: 10px 10px 0;
-    display: flex; flex-direction: column; gap: 8px;
+  flex: 1; overflow-y: auto;
+  padding: 10px 10px 0; display: flex; flex-direction: column; gap: 8px;
 }
-#message-feed::-webkit-scrollbar { width: 4px; }
+#message-feed::-webkit-scrollbar { width: 3px; }
 #message-feed::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }
 
 .feed-empty {
-    display: flex; flex-direction: column; align-items: center; justify-content: center;
-    gap: 10px; height: 100%; color: var(--text-3); text-align: center;
-    font-size: 12px; padding: 20px;
+  display: flex; flex-direction: column; align-items: center; justify-content: center;
+  gap: 10px; height: 100%; color: var(--t4); text-align: center;
+  font-size: 12px; padding: 20px;
 }
-.fe-icon { font-size: 32px; opacity: 0.4; }
+.fe-icon { font-size: 28px; opacity: 0.3; }
+.fe-text { line-height: 1.6; }
 
-/* Message types */
-.msg {
-    border-radius: var(--r); padding: 9px 11px;
-    font-size: 12px; line-height: 1.55;
-    animation: msgIn 0.25s ease both;
-}
-@keyframes msgIn {
-    from { opacity: 0; transform: translateY(8px); }
-    to   { opacity: 1; transform: translateY(0); }
-}
+/* Messages */
+.msg { border-radius: var(--r); padding: 10px 12px;
+  font-size: 12px; line-height: 1.55; animation: msgIn 0.2s ease both; }
+@keyframes msgIn { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:none; } }
 
-.msg-system {
-    background: hsla(220,30%,14%,0.5);
-    color: var(--text-3); font-size: 11px; text-align: center;
-    padding: 5px 8px;
-}
+.msg-system { background: rgba(255,255,255,0.03); color: var(--t3);
+  font-size: 11px; text-align: center; padding: 5px 8px; }
 
 .msg-stakeholder {
-    background: hsla(210,70%,50%,0.08);
-    border-left: 2px solid var(--blue);
-    border-radius: 0 var(--r) var(--r) var(--r);
-}
-.msg-stakeholder .msg-from {
-    font-size: 10px; font-weight: 700; text-transform: uppercase;
-    letter-spacing: 0.8px; color: var(--cyan); margin-bottom: 4px;
+  background: rgba(56,189,248,0.06);
+  border-left: 2px solid var(--s-accepted);
+  border-radius: 0 var(--r) var(--r) var(--r);
 }
-.msg-stakeholder .msg-body { color: var(--text-2); }
-.msg-stakeholder .msg-meta {
-    margin-top: 5px; font-size: 10px; color: var(--text-3);
-    font-family: var(--mono);
+.msg-from {
+  font-size: 10px; font-weight: 700; text-transform: uppercase;
+  letter-spacing: 0.8px; color: var(--s-accepted); margin-bottom: 4px;
 }
+.msg-body  { color: var(--t2); }
+.msg-meta  { margin-top: 5px; font-size: 10px; color: var(--t3); font-family: var(--mono); }
 
 .msg-think {
-    background: hsla(270,60%,14%,0.6);
-    border: 1px solid hsla(270,50%,40%,0.3);
-    border-radius: var(--r);
-    font-family: var(--mono); font-size: 10.5px;
-    color: #c084fc;
+  background: rgba(139,92,246,0.07);
+  border: 1px solid rgba(139,92,246,0.2);
+  border-radius: var(--r);
 }
 .think-header {
-    display: flex; align-items: center; gap: 6px;
-    padding: 6px 10px; border-bottom: 1px solid hsla(270,40%,30%,0.3);
-    font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px;
-    color: #a855f7;
+  display: flex; align-items: center; gap: 6px;
+  padding: 7px 10px; border-bottom: 1px solid rgba(139,92,246,0.2);
+  font-size: 10px; font-weight: 700; text-transform: uppercase;
+  letter-spacing: 1px; color: var(--brand2);
 }
 .think-body {
-    padding: 8px 10px;
-    white-space: pre-wrap; word-break: break-word;
-    color: #d8b4fe;
-    line-height: 1.6;
+  padding: 8px 10px;
+  font-family: var(--mono); font-size: 10.5px; color: #c4b5fd;
+  white-space: pre-wrap; word-break: break-word; line-height: 1.6;
 }
-.think-step {
-    margin-bottom: 4px;
-}
-.think-step-label { color: #a855f7; font-weight: 600; }
 
 .msg-decision {
-    background: hsla(142,60%,14%,0.5);
-    border-left: 2px solid var(--green);
-    border-radius: 0 var(--r) var(--r) var(--r);
-}
-.msg-decision.negative {
-    background: hsla(0,60%,14%,0.5);
-    border-left-color: var(--red);
+  border-left: 2px solid var(--s-completed);
+  background: rgba(52,211,153,0.05);
+  border-radius: 0 var(--r) var(--r) var(--r);
 }
-.md-action {
-    font-size: 13px; font-weight: 700; color: var(--green); margin-bottom: 3px;
-}
-.msg-decision.negative .md-action { color: var(--red); }
-.md-target { font-size: 11px; color: var(--text-2); }
-.md-reward {
-    font-family: var(--mono); font-size: 11px;
-    margin-top: 5px; padding-top: 5px;
-    border-top: 1px solid hsla(142,40%,30%,0.3);
-    color: var(--text-3);
+.msg-decision.neg {
+  border-left-color: var(--s-failed);
+  background: rgba(251,113,133,0.05);
 }
+.md-action { font-size: 13px; font-weight: 700; color: var(--s-completed); margin-bottom: 2px; }
+.msg-decision.neg .md-action { color: var(--s-failed); }
+.md-target { font-size: 11px; color: var(--t2); }
+.md-reward { margin-top: 5px; padding-top: 5px;
+  border-top: 1px solid rgba(52,211,153,0.15);
+  font-family: var(--mono); font-size: 10px; color: var(--t3); }
 
 .msg-alert {
-    background: hsla(38,80%,14%,0.5);
-    border-left: 2px solid var(--yellow);
-    border-radius: 0 var(--r) var(--r) var(--r);
-    color: var(--yellow); font-size: 11px;
+  background: rgba(251,191,36,0.07);
+  border-left: 2px solid var(--s-at-risk);
+  border-radius: 0 var(--r) var(--r) var(--r);
+  color: var(--s-at-risk); font-size: 11px;
 }
-
 .msg-cascade {
-    background: hsla(0,70%,10%,0.8);
-    border: 1px solid rgba(239,68,68,0.4);
-    color: var(--red); text-align: center;
-    animation: cascadeFlash 0.5s ease;
-}
-@keyframes cascadeFlash {
-    0%   { background: hsla(0,70%,20%,0.9); }
-    100% { background: hsla(0,70%,10%,0.8); }
+  background: rgba(251,113,133,0.1);
+  border: 1px solid rgba(251,113,133,0.3);
+  color: var(--s-failed); text-align: center; font-size: 11px;
+  animation: flashRed 0.5s ease;
 }
+@keyframes flashRed { 0% { background:rgba(251,113,133,0.25); } 100% { background:rgba(251,113,133,0.1); } }
 
 /* Conv footer */
 #conv-footer {
-    flex-shrink: 0;
-    padding: 10px 10px 12px;
-    border-top: 1px solid var(--border);
-    background: hsla(220,30%,8%,0.8);
-    display: flex; flex-direction: column; gap: 8px;
+  flex-shrink: 0; padding: 10px 10px 12px;
+  border-top: 1px solid var(--border);
+  background: var(--bg-panel);
+  display: flex; flex-direction: column; gap: 8px;
+}
+.cf-label {
+  font-size: 9px; font-weight: 700; text-transform: uppercase;
+  letter-spacing: 1.2px; color: var(--t3);
 }
-.cf-label { font-size: 10px; font-weight: 700; text-transform: uppercase;
-    letter-spacing: 1px; color: var(--text-3); }
-
 .node-select {
-    width: 100%; font-family: var(--mono); font-size: 11px;
-    padding: 6px 9px;
-    background: var(--bg-input); color: var(--text-2);
-    border: 1px solid var(--border); border-radius: var(--r-sm);
-    outline: none; cursor: pointer;
+  width: 100%; font-family: var(--mono); font-size: 11px;
+  padding: 6px 9px; background: var(--bg-input); color: var(--t2);
+  border: 1px solid var(--border); border-radius: var(--r-sm);
+  outline: none; cursor: pointer;
 }
 .node-select:focus { border-color: var(--border-hi); }
 
 #manual-actions {
-    display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 4px;
+  display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 4px;
 }
 .ma-btn {
-    font-family: var(--font); font-size: 11px; font-weight: 600;
-    padding: 6px 0; border: 1px solid var(--border);
-    border-radius: var(--r-sm); cursor: pointer;
-    background: hsla(220,30%,14%,0.6); color: var(--text-2);
-    transition: all 150ms; text-align: center;
-}
-.ma-btn:hover { background: var(--bg-hover); color: var(--text-1); border-color: var(--border-hi); }
-.ma-btn.accept:hover { border-color: var(--green); color: var(--green); }
-.ma-btn.decline:hover { border-color: var(--red); color: var(--red); }
-.ma-btn.counter:hover { border-color: var(--blue); color: var(--blue); }
-.ma-btn.wait:hover { border-color: var(--yellow); color: var(--yellow); }
-.ma-btn:disabled { opacity: 0.3; cursor: not-allowed; }
+  font-family: var(--font); font-size: 11px; font-weight: 600;
+  padding: 7px 0; border: 1px solid var(--border);
+  border-radius: var(--r-sm); cursor: pointer;
+  background: rgba(255,255,255,0.03); color: var(--t2);
+  transition: all 140ms; text-align: center;
+}
+.ma-btn:hover { background: var(--bg-card-hi); color: var(--t1); }
+.ma-btn.accept:hover  { border-color: var(--s-completed); color: var(--s-completed); }
+.ma-btn.decline:hover { border-color: var(--s-failed);    color: var(--s-failed); }
+.ma-btn.counter:hover { border-color: var(--s-accepted);  color: var(--s-accepted); }
+.ma-btn.wait:hover    { border-color: var(--s-at-risk);   color: var(--s-at-risk); }
+.ma-btn:disabled      { opacity: 0.3; cursor: not-allowed; }
 
 .autoplay-btn {
-    width: 100%; font-family: var(--font); font-size: 12px; font-weight: 600;
-    padding: 7px; border: none; border-radius: var(--r-sm); cursor: pointer;
-    background: linear-gradient(135deg, var(--blue), var(--purple));
-    color: #fff; transition: opacity 180ms, transform 120ms;
+  width: 100%; font-size: 12px; font-weight: 600; padding: 8px;
+  border: none; border-radius: var(--r-sm); cursor: pointer;
+  background: linear-gradient(135deg, var(--brand), var(--brand2));
+  color: #fff; transition: opacity 160ms, transform 120ms;
 }
 .autoplay-btn:hover { opacity: 0.9; transform: translateY(-1px); }
-.autoplay-btn.playing {
-    background: linear-gradient(135deg, var(--orange), var(--red));
-}
+.autoplay-btn.playing { background: linear-gradient(135deg,#f43f5e,#dc2626); }
 
-/* ── GRAPH PANEL ────────────────────────────────────────── */
+/* ── CENTER: Graph Panel ──────────────────────── */
 #graph-panel {
-    display: flex; flex-direction: column;
-    overflow: hidden; position: relative;
-    background: var(--bg);
+  display: flex; flex-direction: column;
+  background: var(--bg); overflow: hidden; position: relative;
 }
 
 #graph-header-bar {
-    display: flex; align-items: center; justify-content: space-between;
-    padding: 8px 16px;
-    border-bottom: 1px solid var(--border);
-    background: hsla(220,30%,8%,0.6);
-    flex-shrink: 0;
+  display: flex; align-items: center; justify-content: space-between;
+  padding: 8px 18px;
+  border-bottom: 1px solid var(--border);
+  background: var(--bg-panel); flex-shrink: 0;
 }
 .ghb-title {
-    font-size: 11px; font-weight: 700; text-transform: uppercase;
-    letter-spacing: 1px; color: var(--text-3);
+  font-size: 10px; font-weight: 700; text-transform: uppercase;
+  letter-spacing: 1.4px; color: var(--t3);
 }
-.ghb-indicators { display: flex; gap: 12px; }
-.ghb-dot {
-    font-family: var(--mono); font-size: 11px; color: var(--text-3);
+.ghb-chips { display: flex; gap: 8px; }
+.ghb-chip {
+  font-size: 10px; font-family: var(--mono);
+  padding: 2px 10px; border-radius: 50px;
+  border: 1px solid transparent;
 }
+.ghb-chip.pending   { color: var(--s-pending);   border-color: rgba(129,140,248,0.3); background: rgba(129,140,248,0.08); }
+.ghb-chip.active    { color: var(--s-accepted);  border-color: rgba(56,189,248,0.3);  background: rgba(56,189,248,0.08); }
+.ghb-chip.completed { color: var(--s-completed); border-color: rgba(52,211,153,0.3);  background: rgba(52,211,153,0.08); }
+.ghb-chip.failed    { color: var(--s-failed);    border-color: rgba(251,113,133,0.3); background: rgba(251,113,133,0.08); }
 
 #graph-area { flex: 1; position: relative; overflow: hidden; }
 #graph-svg  { width: 100%; height: 100%; display: block; }
 
 #graph-empty {
-    position: absolute; inset: 0;
-    display: flex; flex-direction: column;
-    align-items: center; justify-content: center; gap: 12px;
-    text-align: center; padding: 40px;
+  position: absolute; inset: 0;
+  display: flex; flex-direction: column; align-items: center; justify-content: center;
+  gap: 14px; text-align: center; padding: 40px;
+  pointer-events: none;
 }
 .ge-glyph {
-    font-size: 64px; opacity: 0.08;
-    filter: drop-shadow(0 0 20px rgba(59,130,246,0.3));
+  font-size: 72px; font-weight: 900; color: var(--brand);
+  opacity: 0.06; line-height: 1;
+  filter: blur(2px);
 }
-.ge-title { font-size: 18px; font-weight: 700; color: var(--text-2); }
-.ge-sub   { font-size: 13px; color: var(--text-3); line-height: 1.6; }
+.ge-title { font-size: 20px; font-weight: 700; color: var(--t2); pointer-events: auto; }
+.ge-sub   { font-size: 13px; color: var(--t3); line-height: 1.7; }
 .ge-btn {
-    margin-top: 8px; font-size: 14px; font-weight: 600;
-    padding: 10px 28px;
-    background: linear-gradient(135deg, var(--blue), var(--purple));
-    color: #fff; border: none; border-radius: 50px; cursor: pointer;
-    transition: transform 150ms, box-shadow 150ms;
-    box-shadow: 0 4px 16px rgba(59,130,246,0.3);
+  pointer-events: auto;
+  margin-top: 6px; font-size: 14px; font-weight: 700;
+  padding: 11px 32px;
+  background: linear-gradient(135deg, var(--brand), var(--brand2));
+  color: #fff; border: none; border-radius: 50px; cursor: pointer;
+  box-shadow: 0 4px 20px rgba(99,102,241,0.4);
+  transition: transform 150ms, box-shadow 150ms;
 }
-.ge-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(59,130,246,0.45); }
+.ge-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(99,102,241,0.55); }
 
 #graph-legend {
-    display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
-    padding: 6px 16px;
-    border-top: 1px solid var(--border);
-    background: hsla(220,30%,8%,0.5);
-    flex-shrink: 0;
-}
-.gl-item { display: flex; align-items: center; gap: 5px; font-size: 11px; color: var(--text-3); }
-.gl-dot  { width: 9px; height: 9px; border-radius: 50%; }
-.gl-dot.pending   { background: var(--yellow); box-shadow: 0 0 5px var(--yellow); }
-.gl-dot.accepted  { background: var(--blue);   box-shadow: 0 0 5px var(--blue); }
-.gl-dot.completed { background: var(--green);  box-shadow: 0 0 5px var(--green); }
-.gl-dot.failed    { background: var(--red);    box-shadow: 0 0 5px var(--red); }
-.gl-line { width: 20px; height: 2px; }
-.gl-line.dep      { background: var(--text-3); }
-.gl-line.conflict { background: var(--red); }
-
-/* ── D3 Graph Nodes ─────────────────────────────────────── */
-.node circle {
-    cursor: pointer;
-    transition: r 200ms, filter 200ms;
-}
-.node text {
-    font-family: var(--font); font-size: 11px; font-weight: 600;
-    fill: var(--text-1); pointer-events: none;
-    text-anchor: middle; dominant-baseline: central;
-}
-.node .node-sublabel {
-    font-size: 9px; font-weight: 400; fill: var(--text-3);
-}
-.node.status-pending circle {
-    fill: hsla(45,90%,14%,0.9);
-    stroke: var(--yellow); stroke-width: 2;
-    filter: drop-shadow(0 0 5px rgba(234,179,8,0.4));
-    animation: pulseNode 2s ease-in-out infinite;
-}
-@keyframes pulseNode {
-    0%,100% { filter: drop-shadow(0 0 4px rgba(234,179,8,0.35)); }
-    50%      { filter: drop-shadow(0 0 12px rgba(234,179,8,0.7)); }
-}
-.node.status-accepted circle {
-    fill: hsla(217,70%,14%,0.9);
-    stroke: var(--blue); stroke-width: 2;
-    filter: drop-shadow(0 0 6px rgba(59,130,246,0.5));
-}
-.node.status-completed circle {
-    fill: hsla(142,60%,10%,0.9);
-    stroke: var(--green); stroke-width: 2;
-    filter: drop-shadow(0 0 5px rgba(34,197,94,0.4));
-}
-.node.status-failed circle {
-    fill: hsla(0,70%,12%,0.95);
-    stroke: var(--red); stroke-width: 2.5;
-    filter: drop-shadow(0 0 8px rgba(239,68,68,0.6));
-    animation: shakeFail 0.5s ease;
-}
-@keyframes shakeFail {
-    0%,100% { transform: translate(0,0); }
-    20%     { transform: translate(-4px,0); }
-    40%     { transform: translate(4px,0); }
-    60%     { transform: translate(-3px,0); }
-    80%     { transform: translate(3px,0); }
-}
-.node.selected circle { stroke-width: 3 !important; }
-.node.status-pending.selected circle  { stroke: #fde047; }
-.node.status-accepted.selected circle { stroke: #60a5fa; }
-
-.link {
-    stroke-opacity: 0.5; stroke-width: 1.5;
-    fill: none;
-}
-.link.dependency { stroke: var(--text-3); }
-.link.conflict   { stroke: var(--red); stroke-dasharray: 4,3; stroke-opacity: 0.7; }
-.link.trust-impact { stroke: var(--purple); stroke-dasharray: 2,4; }
-
-/* Node urgency ring */
-.node .urgency-ring {
-    fill: none; stroke-width: 1;
-    stroke-dasharray: 2,2; opacity: 0.4;
-}
-
-/* ── METRICS PANEL ──────────────────────────────────────── */
+  display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
+  padding: 7px 18px;
+  border-top: 1px solid var(--border);
+  background: var(--bg-panel); flex-shrink: 0;
+}
+.gl-item  { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--t3); }
+.gl-dot   { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
+.gl-dot.pending   { background: var(--s-pending);   box-shadow: 0 0 6px var(--s-pending); }
+.gl-dot.accepted  { background: var(--s-accepted);  box-shadow: 0 0 6px var(--s-accepted); }
+.gl-dot.completed { background: var(--s-completed); box-shadow: 0 0 6px var(--s-completed); }
+.gl-dot.failed    { background: var(--s-failed);    box-shadow: 0 0 6px var(--s-failed); }
+.gl-dot.at-risk   { background: var(--s-at-risk);   box-shadow: 0 0 6px var(--s-at-risk); }
+.gl-line { width: 22px; height: 2px; flex-shrink: 0; }
+.gl-line.dep      { background: var(--t4); }
+.gl-line.conflict { background: var(--s-failed); }
+
+/* D3 Node styles */
+.node { cursor: pointer; }
+.node .node-bg {
+  transition: r 200ms;
+}
+.node .node-ring {
+  fill: none; stroke-width: 2;
+  transition: stroke 300ms;
+}
+.node .node-letter {
+  font-family: var(--font); font-size: 13px; font-weight: 800;
+  text-anchor: middle; dominant-baseline: central;
+  pointer-events: none;
+}
+.node .node-label {
+  font-family: var(--font); font-size: 10px; font-weight: 600;
+  fill: var(--t2); text-anchor: middle;
+  pointer-events: none;
+}
+.node .node-deadline {
+  font-family: var(--mono); font-size: 9px;
+  fill: var(--t3); text-anchor: middle;
+  pointer-events: none;
+}
+.node.selected .node-ring { stroke-width: 3; }
+.node .node-pulse { fill: none; stroke-width: 1; opacity: 0; }
+
+/* Status-specific fills */
+.node.pending   .node-bg { fill: rgba(129,140,248,0.1); }
+.node.accepted  .node-bg { fill: rgba(56,189,248,0.08); }
+.node.completed .node-bg { fill: rgba(52,211,153,0.08); }
+.node.failed    .node-bg { fill: rgba(251,113,133,0.1); }
+
+.node.pending   .node-ring  { stroke: var(--s-pending); }
+.node.accepted  .node-ring  { stroke: var(--s-accepted); }
+.node.completed .node-ring  { stroke: var(--s-completed); }
+.node.failed    .node-ring  { stroke: var(--s-failed); }
+
+.node.pending   .node-letter { fill: var(--s-pending); }
+.node.accepted  .node-letter { fill: var(--s-accepted); }
+.node.completed .node-letter { fill: var(--s-completed); }
+.node.failed    .node-letter { fill: var(--s-failed); }
+
+.node.pending .node-pulse {
+  stroke: var(--s-pending);
+  animation: nodeBreath 2.2s ease-in-out infinite;
+}
+@keyframes nodeBreath {
+  0%,100% { r: 26px; opacity: 0; }
+  50%     { r: 34px; opacity: 0.25; }
+}
+
+.node.failed .node-ring { animation: failShake 0.5s ease; }
+@keyframes failShake {
+  0%,100% { transform: translate(0,0); }
+  20%     { transform: translate(-4px,0); }
+  40%     { transform: translate(4px,0); }
+  60%     { transform: translate(-3px,0); }
+  80%     { transform: translate(3px,0); }
+}
+
+/* Edges */
+.edge { fill: none; }
+.edge.dependency { stroke: var(--t4); stroke-width: 1.5; stroke-dasharray: 6,3; opacity: 0.7; }
+.edge.conflict   { stroke: var(--s-failed); stroke-width: 1.5; stroke-dasharray: 4,3; opacity: 0.6; }
+.edge.trust-impact { stroke: var(--brand2); stroke-width: 1; stroke-dasharray: 2,4; opacity: 0.5; }
+
+/* ── RIGHT: Metrics Panel ─────────────────────── */
 #metrics-panel {
-    display: flex; flex-direction: column; gap: 8px;
-    padding: 10px 10px;
-    overflow-y: auto;
-    border-left: 1px solid var(--border);
-    background: hsla(220,25%,7%,0.8);
+  display: flex; flex-direction: column; gap: 0;
+  overflow-y: auto; border-left: 1px solid var(--border);
+  background: var(--bg);
 }
-#metrics-panel::-webkit-scrollbar { width: 4px; }
+#metrics-panel::-webkit-scrollbar { width: 3px; }
 #metrics-panel::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }
 
 .mc {
-    background: var(--bg-card);
-    border: 1px solid var(--border);
-    border-radius: var(--r);
-    overflow: hidden;
+  border-bottom: 1px solid var(--border);
+  overflow: hidden; flex-shrink: 0;
 }
+.mc:last-child { border-bottom: none; flex: 1; }
 
-.mc-title {
-    display: flex; align-items: center; justify-content: space-between;
-    padding: 8px 12px 6px;
-    font-size: 10px; font-weight: 700; text-transform: uppercase;
-    letter-spacing: 1px; color: var(--text-3);
-    border-bottom: 1px solid var(--border);
+.mc-hd {
+  display: flex; align-items: center; justify-content: space-between;
+  padding: 9px 14px 8px;
+  font-size: 9px; font-weight: 700; text-transform: uppercase;
+  letter-spacing: 1.4px; color: var(--t3);
+  background: var(--bg-panel);
+  border-bottom: 1px solid var(--border);
 }
-.mc-subtitle {
-    font-family: var(--mono); font-size: 10px; font-weight: 600;
-    padding: 2px 6px; border-radius: 4px;
-    background: hsla(142,50%,20%,0.3); color: var(--green);
+.mc-badge {
+  font-family: var(--mono); font-size: 10px; font-weight: 700;
+  padding: 2px 7px; border-radius: 4px;
 }
+.mc-badge.green  { background: rgba(52,211,153,0.15);  color: var(--s-completed); }
+.mc-badge.blue   { background: rgba(56,189,248,0.15);  color: var(--s-accepted); }
+.mc-badge.red    { background: rgba(251,113,133,0.15); color: var(--s-failed); }
+.mc-badge.purple { background: rgba(139,92,246,0.15);  color: var(--brand2); }
 
 /* Trust */
-#trust-list { padding: 8px 12px; display: flex; flex-direction: column; gap: 10px; }
-
-.trust-entry { display: flex; flex-direction: column; gap: 3px; }
-.te-header { display: flex; align-items: center; justify-content: space-between; }
-.te-name { font-size: 12px; font-weight: 600; color: var(--text-1); }
-.te-score { font-family: var(--mono); font-size: 12px; font-weight: 700; }
-.te-score.high   { color: var(--green); }
-.te-score.medium { color: var(--yellow); }
-.te-score.low    { color: var(--red); }
-.te-score.critical { color: #ff0033; animation: trustCrit 1s ease infinite; }
-@keyframes trustCrit {
-    0%,100% { opacity: 1; } 50% { opacity: 0.5; }
-}
-
-.te-bar-track {
-    height: 5px; background: hsla(220,30%,18%,0.8);
-    border-radius: 3px; overflow: hidden;
-}
-.te-bar-fill {
-    height: 100%; border-radius: 3px;
-    transition: width 0.5s ease, background 0.3s ease;
-}
-.te-bar-fill.high   { background: linear-gradient(90deg, var(--green), #16a34a); }
-.te-bar-fill.medium { background: linear-gradient(90deg, var(--yellow), #ca8a04); }
-.te-bar-fill.low    { background: linear-gradient(90deg, var(--orange), var(--red)); }
-.te-bar-fill.critical { background: var(--red); }
+#trust-list { padding: 10px 14px; display: flex; flex-direction: column; gap: 12px; }
+.te { display: flex; flex-direction: column; gap: 4px; }
+.te-row1 { display: flex; align-items: center; justify-content: space-between; }
+.te-name  { font-size: 12px; font-weight: 600; color: var(--t1); }
+.te-score-wrap { display: flex; align-items: baseline; gap: 5px; }
+.te-score {
+  font-family: var(--mono); font-size: 14px; font-weight: 800;
+}
+.te-score.hi   { color: var(--s-completed); }
+.te-score.mid  { color: var(--s-at-risk); }
+.te-score.lo   { color: var(--s-failed); }
+.te-delta {
+  font-family: var(--mono); font-size: 10px; font-weight: 600;
+}
+.te-delta.up   { color: var(--s-completed); }
+.te-delta.dn   { color: var(--s-failed); }
+.te-delta.neu  { color: var(--t3); }
+
+.te-track {
+  height: 5px; background: rgba(255,255,255,0.06);
+  border-radius: 3px; overflow: hidden;
+}
+.te-fill {
+  height: 100%; border-radius: 3px;
+  transition: width 0.5s ease, background 0.3s ease;
+}
+.te-fill.hi  { background: linear-gradient(90deg, var(--s-completed), #059669); }
+.te-fill.mid { background: linear-gradient(90deg, var(--s-at-risk), #d97706); }
+.te-fill.lo  { background: linear-gradient(90deg, #f97316, var(--s-failed)); }
 
 .te-dims {
-    display: flex; gap: 6px; margin-top: 2px;
+  display: flex; gap: 8px;
 }
-.te-dim {
-    font-size: 9.5px; color: var(--text-3);
-    font-family: var(--mono);
-}
-.te-dim span { color: var(--text-2); }
+.te-dim { font-size: 9.5px; color: var(--t3); font-family: var(--mono); }
+.te-dim span { color: var(--t2); }
 
 /* Capacity */
-#capacity-display { padding: 10px 12px; display: flex; flex-direction: column; gap: 6px; }
-.cap-numbers {
-    display: flex; align-items: baseline; gap: 4px;
-    flex-wrap: wrap;
-}
-.cap-numbers > :first-child { font-family: var(--mono); font-size: 20px; font-weight: 700; color: var(--text-1); }
-.cap-slash { color: var(--text-3); font-size: 16px; }
-.cap-numbers > :nth-child(3) { font-family: var(--mono); font-size: 16px; color: var(--text-2); }
-.cap-label { font-size: 10px; color: var(--text-3); width: 100%; margin-top: -2px; }
-
-.cap-bar-track {
-    height: 8px; background: hsla(220,30%,16%,0.8);
-    border-radius: 4px; overflow: hidden;
-}
-.cap-bar-fill {
-    height: 100%; border-radius: 4px;
-    transition: width 0.6s cubic-bezier(0.4,0,0.2,1), background 0.4s ease;
-    background: var(--green);
-}
-.cap-bar-fill.warn { background: linear-gradient(90deg, var(--yellow), var(--orange)); }
-.cap-bar-fill.crit { background: linear-gradient(90deg, var(--orange), var(--red)); animation: capFlash 0.8s ease infinite; }
-@keyframes capFlash {
-    0%,100% { opacity: 1; } 50% { opacity: 0.7; }
-}
-
-.cap-legend {
-    display: flex; gap: 10px;
-    font-size: 9.5px; color: var(--text-3);
-}
-.cap-ok   { color: var(--green); }
-.cap-warn { color: var(--yellow); }
-.cap-crit { color: var(--red); }
+#capacity-display { padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
+.cap-header { display: flex; align-items: baseline; gap: 6px; }
+.cap-val  { font-family: var(--mono); font-size: 22px; font-weight: 800; color: var(--t1); }
+.cap-sep  { color: var(--t4); font-size: 14px; }
+.cap-of   { font-family: var(--mono); font-size: 14px; color: var(--t2); }
+.cap-unit { font-size: 10px; color: var(--t3); }
+.cap-track {
+  height: 8px; background: rgba(255,255,255,0.06);
+  border-radius: 4px; overflow: hidden;
+}
+.cap-fill {
+  height: 100%; border-radius: 4px;
+  transition: width 0.6s cubic-bezier(.4,0,.2,1), background 0.3s ease;
+  background: var(--s-completed);
+}
+.cap-fill.warn { background: linear-gradient(90deg, var(--s-at-risk), #d97706); }
+.cap-fill.crit { background: linear-gradient(90deg, #f97316, var(--s-failed));
+  animation: capPulse 0.9s ease infinite; }
+@keyframes capPulse { 0%,100%{opacity:1;} 50%{opacity:0.65;} }
+.cap-zones { display: flex; justify-content: space-between; font-size: 9px; color: var(--t4); }
 
 /* Reward breakdown */
-#reward-display { padding: 8px 12px; }
-.rwd-empty { font-size: 11px; color: var(--text-3); padding: 4px 0; }
+#reward-display { padding: 10px 14px; }
+.rwd-empty { font-size: 11px; color: var(--t3); }
 .rwd-total {
-    font-family: var(--mono); font-size: 24px; font-weight: 800;
-    text-align: center; margin-bottom: 8px;
-    transition: color 300ms;
+  font-family: var(--mono); font-size: 28px; font-weight: 800;
+  text-align: center; margin-bottom: 10px;
+  transition: color 300ms;
 }
-.rwd-total.pos { color: var(--green); }
-.rwd-total.neg { color: var(--red); }
-
+.rwd-total.pos { color: var(--s-completed); }
+.rwd-total.neg { color: var(--s-failed); }
 .rwd-row {
-    display: flex; align-items: center; justify-content: space-between;
-    padding: 3px 0; border-bottom: 1px solid hsla(220,30%,18%,0.4);
+  display: flex; justify-content: space-between; align-items: center;
+  padding: 3px 0; border-bottom: 1px solid rgba(255,255,255,0.04);
+  font-size: 11px;
 }
 .rwd-row:last-child { border: none; }
-.rwd-key  { font-size: 11px; color: var(--text-2); }
-.rwd-val  { font-family: var(--mono); font-size: 11px; }
-.rwd-val.pos { color: var(--green); }
-.rwd-val.neg { color: var(--red); }
-.rwd-val.zero { color: var(--text-3); }
+.rwd-k { color: var(--t2); }
+.rwd-v { font-family: var(--mono); font-size: 11px; }
+.rwd-v.pos  { color: var(--s-completed); }
+.rwd-v.neg  { color: var(--s-failed); }
+.rwd-v.zero { color: var(--t4); }
 
 /* Target detail */
-#target-detail { padding: 10px 12px; }
-.td-empty { font-size: 11px; color: var(--text-3); }
-.td-name { font-size: 14px; font-weight: 700; color: var(--text-1); margin-bottom: 6px; }
-.td-row  { display: flex; justify-content: space-between; padding: 3px 0;
-    border-bottom: 1px solid hsla(220,30%,18%,0.3); font-size: 11px; }
+#target-detail { padding: 10px 14px; }
+.td-empty  { font-size: 11px; color: var(--t3); }
+.td-name   { font-size: 14px; font-weight: 700; color: var(--t1); margin-bottom: 8px; }
+.td-row    { display: flex; justify-content: space-between; padding: 4px 0;
+  border-bottom: 1px solid rgba(255,255,255,0.04); font-size: 11px; }
 .td-row:last-child { border: none; }
-.td-k { color: var(--text-3); }
-.td-v { color: var(--text-1); font-family: var(--mono); font-weight: 600; }
-.td-status {
-    display: inline-block; padding: 2px 8px; border-radius: 50px;
-    font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px;
+.td-k  { color: var(--t3); }
+.td-v  { color: var(--t1); font-family: var(--mono); font-weight: 600; }
+.td-badge {
+  display: inline-block; padding: 2px 8px; border-radius: 50px;
+  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px;
 }
-.td-status.pending  { background: hsla(45,70%,20%,0.5); color: var(--yellow); }
-.td-status.accepted { background: hsla(217,70%,20%,0.5); color: var(--blue); }
-.td-status.completed{ background: hsla(142,60%,14%,0.5); color: var(--green); }
-.td-status.failed   { background: hsla(0,60%,14%,0.5); color: var(--red); }
+.td-badge.pending   { background: rgba(129,140,248,0.15); color: var(--s-pending); }
+.td-badge.accepted  { background: rgba(56,189,248,0.12);  color: var(--s-accepted); }
+.td-badge.completed { background: rgba(52,211,153,0.12);  color: var(--s-completed); }
+.td-badge.failed    { background: rgba(251,113,133,0.12); color: var(--s-failed); }
 
 /* Log */
-.mc-log { flex: 1; min-height: 80px; }
-#log-list { padding: 6px 10px; display: flex; flex-direction: column; gap: 4px;
-    max-height: 160px; overflow-y: auto; }
+#log-list { padding: 6px 10px; overflow-y: auto; max-height: 130px; display: flex; flex-direction: column; gap: 3px; }
 #log-list::-webkit-scrollbar { width: 3px; }
-#log-list::-webkit-scrollbar-thumb { background: var(--border); }
-
-.log-item {
-    font-size: 11px; padding: 4px 6px; border-radius: var(--r-sm);
-    animation: logIn 0.2s ease;
-    border-left: 2px solid transparent;
-}
-@keyframes logIn { from { opacity:0; } to { opacity:1; } }
-.log-item.system  { color: var(--text-3); border-left-color: var(--border); }
-.log-item.agent   { color: var(--cyan); border-left-color: var(--cyan); }
-.log-item.success { color: var(--green); border-left-color: var(--green); }
-.log-item.danger  { color: var(--red); border-left-color: var(--red); }
-.log-item.response{ color: var(--text-2); border-left-color: var(--purple); font-style: italic; }
-
-/* ══════════════════════════════════════════════════════════
+#log-list::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }
+.log-item { font-size: 11px; padding: 3px 7px; border-radius: var(--r-sm);
+  border-left: 2px solid transparent; animation: logIn 0.2s ease; }
+@keyframes logIn { from{opacity:0;} to{opacity:1;} }
+.log-item.system  { color: var(--t3); border-left-color: var(--border); }
+.log-item.agent   { color: var(--s-accepted); border-left-color: var(--s-accepted); }
+.log-item.success { color: var(--s-completed); border-left-color: var(--s-completed); }
+.log-item.danger  { color: var(--s-failed); border-left-color: var(--s-failed); }
+.log-item.response{ color: var(--t2); border-left-color: var(--brand2); font-style: italic; }
+
+/* ═══════════════════════════════════════════��══
    DECISION TIMELINE
-══════════════════════════════════════════════════════════ */
+══════════════════════════════════════════════ */
 #timeline-bar {
-    position: fixed; bottom: 0; left: 0; right: 0;
-    height: var(--timeline-h);
-    display: flex; align-items: center; gap: 10px;
-    padding: 0 16px;
-    background: hsla(220,30%,8%,0.95);
-    border-top: 1px solid var(--border);
-    overflow-x: auto; overflow-y: hidden;
-    z-index: 100;
+  position: fixed; bottom: 0; left: 0; right: 0; z-index: 100;
+  height: var(--timeline-h);
+  display: flex; align-items: center; gap: 12px; padding: 0 18px;
+  background: var(--bg-panel); border-top: 1px solid var(--border);
+  overflow-x: auto; overflow-y: hidden;
 }
 #timeline-bar::-webkit-scrollbar { height: 3px; }
 #timeline-bar::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }
-
-.tl-label {
-    font-size: 9px; font-weight: 700; text-transform: uppercase;
-    letter-spacing: 1.2px; color: var(--text-3); flex-shrink: 0;
-    writing-mode: horizontal-tb;
-}
-
+.tl-label { font-size: 9px; font-weight: 700; text-transform: uppercase;
+  letter-spacing: 1.2px; color: var(--t3); flex-shrink: 0; }
 #timeline-track { display: flex; align-items: center; gap: 4px; height: 100%; }
-
 .tl-step {
-    display: flex; flex-direction: column; align-items: center; justify-content: center;
-    gap: 2px; padding: 4px 8px; border-radius: var(--r-sm);
-    border: 1px solid var(--border);
-    background: hsla(220,30%,12%,0.6);
-    cursor: default; flex-shrink: 0;
-    animation: tlIn 0.2s ease;
-    transition: border-color 150ms;
-    min-width: 60px;
-}
-@keyframes tlIn { from { opacity:0; transform:scale(0.85); } to { opacity:1; transform:scale(1); } }
-.tl-step:hover { border-color: var(--border-hi); }
-
-.tl-step.accept   { border-color: hsla(142,50%,40%,0.4); }
-.tl-step.decline  { border-color: hsla(0,50%,40%,0.4); }
-.tl-step.counter  { border-color: hsla(217,50%,45%,0.4); }
-.tl-step.do_nothing { opacity: 0.5; }
-
-.tl-icon  { font-size: 14px; }
-.tl-label2 { font-size: 9px; color: var(--text-3); font-family: var(--mono); }
-.tl-reward {
-    font-family: var(--mono); font-size: 9px; font-weight: 700;
-}
-.tl-reward.pos { color: var(--green); }
-.tl-reward.neg { color: var(--red); }
-
-.tl-connector {
-    width: 16px; height: 1px;
-    background: var(--border); flex-shrink: 0; opacity: 0.5;
-}
-
-/* ══════════════════════════════════════════════════════════
+  display: flex; flex-direction: column; align-items: center; justify-content: center;
+  gap: 1px; padding: 5px 10px; border-radius: var(--r-sm);
+  border: 1px solid var(--border); background: rgba(255,255,255,0.02);
+  cursor: default; flex-shrink: 0; animation: tlIn 0.2s ease;
+  transition: border-color 140ms; min-width: 58px;
+}
+@keyframes tlIn { from{opacity:0;transform:scale(0.85);} to{opacity:1;transform:scale(1);} }
+.tl-step.accept    { border-color: rgba(52,211,153,0.35); }
+.tl-step.decline   { border-color: rgba(251,113,133,0.35); }
+.tl-step.counter   { border-color: rgba(56,189,248,0.35); }
+.tl-step.do_nothing { opacity: 0.45; }
+.tl-icon { font-size: 14px; line-height: 1; }
+.tl-num  { font-size: 8px; color: var(--t4); font-family: var(--mono); }
+.tl-r    { font-family: var(--mono); font-size: 9px; font-weight: 700; }
+.tl-r.pos { color: var(--s-completed); }
+.tl-r.neg { color: var(--s-failed); }
+.tl-conn  { width: 14px; height: 1px; background: var(--border); flex-shrink: 0; opacity: 0.4; }
+
+/* ══════════════════════════════════════════════
    COMPARE OVERLAY
-══════════════════════════════════════════════════════════ */
+══════════════════════════════════════════════ */
 #compare-overlay {
-    position: fixed; inset: 0; z-index: 300;
-    display: flex; flex-direction: column;
-    background: var(--bg);
-    animation: overlayIn 0.3s ease;
+  position: fixed; inset: 0; z-index: 300;
+  display: flex; flex-direction: column;
+  background: var(--bg);
+  animation: fadeIn 0.25s ease;
 }
-@keyframes overlayIn { from { opacity:0; } to { opacity:1; } }
+@keyframes fadeIn { from{opacity:0;} to{opacity:1;} }
 
 .cmp-topbar {
-    display: flex; align-items: center; justify-content: space-between;
-    padding: 10px 20px;
-    border-bottom: 1px solid var(--border);
-    background: var(--bg-topbar);
-    flex-shrink: 0;
+  display: flex; align-items: center; justify-content: space-between;
+  padding: 12px 20px;
+  border-bottom: 1px solid var(--border);
+  background: var(--bg-panel); flex-shrink: 0;
 }
 .cmp-scenario-info { display: flex; align-items: center; gap: 12px; }
-.cmp-scenario-icon { font-size: 24px; }
-.cmp-scenario-name { font-size: 15px; font-weight: 700; color: var(--text-1); }
-.cmp-scenario-desc { font-size: 11px; color: var(--text-3); margin-top: 2px; }
-
+.cmp-icon { font-size: 26px; }
+.cmp-scenario-name { font-size: 16px; font-weight: 800; color: var(--t1); }
+.cmp-scenario-desc { font-size: 11px; color: var(--t3); margin-top: 1px; }
 .cmp-controls { display: flex; align-items: center; gap: 8px; }
-.cmp-step-btn {
-    font-family: var(--mono); font-size: 16px; padding: 4px 12px; font-weight: 700;
-}
-.cmp-step-label { font-family: var(--mono); font-size: 12px; color: var(--text-2); min-width: 80px; text-align: center; }
-.cmp-auto-btn.playing { background: hsla(0,60%,20%,0.5); color: var(--red); border-color: var(--red); }
+.cmp-step-label { font-family: var(--mono); font-size: 12px; color: var(--t2); min-width: 84px; text-align: center; }
+.cmp-step-btn { padding: 5px 14px; font-family: var(--mono); font-size: 16px; font-weight: 700; }
 .btn-close-cmp {
-    font-size: 13px; padding: 5px 12px;
-    background: hsla(0,60%,20%,0.4); color: var(--red);
-    border: 1px solid hsla(0,60%,40%,0.4); border-radius: var(--r-sm); cursor: pointer;
+  font-size: 12px; padding: 6px 14px;
+  background: rgba(251,113,133,0.1); color: var(--s-failed);
+  border: 1px solid rgba(251,113,133,0.3); border-radius: var(--r-sm); cursor: pointer;
 }
-.btn-close-cmp:hover { background: hsla(0,60%,25%,0.6); }
+.btn-close-cmp:hover { background: rgba(251,113,133,0.2); }
 
 .cmp-loading {
-    flex: 1; display: flex; flex-direction: column;
-    align-items: center; justify-content: center; gap: 16px;
-    color: var(--text-3);
+  flex: 1; display: flex; flex-direction: column;
+  align-items: center; justify-content: center; gap: 16px; color: var(--t3);
 }
 .cmp-spinner {
-    width: 40px; height: 40px; border-radius: 50%;
-    border: 3px solid var(--border);
-    border-top-color: var(--blue);
-    animation: spin 0.8s linear infinite;
+  width: 40px; height: 40px; border-radius: 50%;
+  border: 3px solid var(--border); border-top-color: var(--brand);
+  animation: spin 0.8s linear infinite;
 }
-@keyframes spin { to { transform: rotate(360deg); } }
+@keyframes spin { to{transform:rotate(360deg);} }
 
 .cmp-body {
-    flex: 1; display: grid;
-    grid-template-columns: 1fr 140px 1fr;
-    overflow: hidden;
+  flex: 1; display: grid; grid-template-columns: 1fr 130px 1fr; overflow: hidden;
 }
-
 .cmp-side { display: flex; flex-direction: column; overflow: hidden; }
-
-.cmp-side-header {
-    padding: 10px 16px;
-    display: flex; flex-direction: column; gap: 2px;
-    border-bottom: 1px solid var(--border);
-    flex-shrink: 0;
-}
-.naive-header  { background: hsla(0,40%,10%,0.6); }
-.vergil-header { background: hsla(142,40%,10%,0.6); }
-.csh-badge {
-    font-size: 14px; font-weight: 700;
-}
-.naive-header  .csh-badge { color: var(--red); }
-.vergil-header .csh-badge { color: var(--green); }
-.csh-desc { font-size: 11px; color: var(--text-3); }
+.cmp-side-hd {
+  padding: 10px 18px; flex-shrink: 0;
+  border-bottom: 1px solid var(--border);
+  display: flex; flex-direction: column; gap: 2px;
+}
+.naive-hd  { background: rgba(251,113,133,0.06); }
+.vergil-hd { background: rgba(52,211,153,0.06); }
+.csh-badge { font-size: 14px; font-weight: 800; }
+.naive-hd  .csh-badge { color: var(--s-failed); }
+.vergil-hd .csh-badge { color: var(--s-completed); }
+.csh-sub  { font-size: 11px; color: var(--t3); }
 
 .cmp-svg { flex: 1; display: block; }
 
 .cmp-side-stats {
-    display: flex; gap: 16px; padding: 8px 16px;
-    border-top: 1px solid var(--border);
-    flex-shrink: 0;
-    font-family: var(--mono); font-size: 11px;
+  display: flex; gap: 16px; padding: 8px 16px;
+  border-top: 1px solid var(--border); flex-shrink: 0;
+  font-family: var(--mono); font-size: 11px;
 }
 .css-stat { display: flex; flex-direction: column; gap: 1px; }
-.css-label { font-size: 9px; text-transform: uppercase; letter-spacing: 0.8px; color: var(--text-3); }
-.css-val { font-weight: 700; color: var(--text-1); }
+.css-lbl  { font-size: 9px; text-transform: uppercase; letter-spacing: 0.8px; color: var(--t3); }
+.css-v    { font-weight: 700; color: var(--t1); }
 
-.cmp-side-step {
-    padding: 8px 14px;
-    font-size: 11px; color: var(--text-2); line-height: 1.5;
-    border-top: 1px solid var(--border);
-    min-height: 60px; max-height: 80px; overflow-y: auto;
-    flex-shrink: 0;
-    background: hsla(220,30%,8%,0.6);
+.cmp-step-display {
+  padding: 8px 14px; font-size: 11px; color: var(--t2); line-height: 1.5;
+  border-top: 1px solid var(--border); min-height: 58px; max-height: 80px;
+  overflow-y: auto; flex-shrink: 0; background: rgba(255,255,255,0.02);
 }
-.cmp-think-block {
-    font-family: var(--mono); font-size: 10px; color: #c084fc;
-    background: hsla(270,40%,10%,0.5);
+.cmp-think-display {
+  font-family: var(--mono); font-size: 10px; color: #c4b5fd;
+  background: rgba(139,92,246,0.07);
 }
 
-/* Compare center column */
 .cmp-center {
-    border-left: 1px solid var(--border);
-    border-right: 1px solid var(--border);
-    display: flex; flex-direction: column;
-    align-items: center; justify-content: center;
-    gap: 14px; padding: 20px 12px;
-    background: hsla(220,25%,9%,0.8);
+  border-left: 1px solid var(--border);
+  border-right: 1px solid var(--border);
+  display: flex; flex-direction: column;
+  align-items: center; justify-content: center;
+  gap: 10px; padding: 16px 10px;
+  background: var(--bg-panel);
 }
 .cmp-delta-title {
-    font-size: 9px; font-weight: 800; text-transform: uppercase;
-    letter-spacing: 1.5px; color: var(--text-3); margin-bottom: 4px;
+  font-size: 9px; font-weight: 800; text-transform: uppercase;
+  letter-spacing: 1.5px; color: var(--t3); margin-bottom: 2px;
 }
 .delta-row {
-    width: 100%; text-align: center;
-    padding: 10px 8px;
-    background: var(--bg-card);
-    border: 1px solid var(--border); border-radius: var(--r);
-}
-.dr-label { font-size: 9px; text-transform: uppercase; letter-spacing: 0.8px; color: var(--text-3); margin-bottom: 4px; }
-.dr-val {
-    font-family: var(--mono); font-size: 16px; font-weight: 800;
-    color: var(--text-2);
+  width: 100%; text-align: center; padding: 9px 6px;
+  background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--r);
 }
-.dr-val.better { color: var(--green); }
-.dr-val.worse  { color: var(--red); }
+.dr-lbl { font-size: 9px; text-transform: uppercase; letter-spacing: 0.8px; color: var(--t3); margin-bottom: 3px; }
+.dr-v   { font-family: var(--mono); font-size: 17px; font-weight: 800; color: var(--t2); }
+.dr-v.better { color: var(--s-completed); }
+.dr-v.worse  { color: var(--s-failed); }
 
 .cmp-verdict {
-    width: 100%; text-align: center; padding: 10px 8px;
-    background: hsla(142,40%,12%,0.5);
-    border: 1px solid hsla(142,40%,30%,0.3);
-    border-radius: var(--r);
-    font-size: 12px; font-weight: 600; color: var(--green); line-height: 1.5;
+  width: 100%; text-align: center; padding: 9px 6px;
+  background: rgba(52,211,153,0.08); border: 1px solid rgba(52,211,153,0.2);
+  border-radius: var(--r); font-size: 11px; font-weight: 600;
+  color: var(--s-completed); line-height: 1.5;
 }

scripts/train_grpo_colab.py

@@ -48,9 +48,14 @@ from vergil.curriculum.failure_db import FailureTopologyDatabase
 
 def state_to_prompt(state, env) -> str:
     """
-    Convert VERGIL state to a structured text prompt for the LLM.
-    Uses a <think>...</think> block to train chain-of-thought CDG reasoning
-    before producing the final JSON decision.
+    Compact text serialization of VERGIL state for the LLM.
+
+    Trimmed to ~60-70% of the previous size for faster training generations.
+    Removed: verbose decision-rules section (penalties are *learned* via
+    the reward, not described in the prompt) and the over-prescriptive
+    chain-of-thought scaffold (we still allow <think>; we just don't
+    spend tokens on a 5-step recipe). Kept: state, pending list with
+    explicit valid node_ids, accepted list, trust scores, JSON schema.
     """
     nodes = state.cdg_nodes
     pending = [n for n in nodes if n.status == CommitmentStatus.PENDING]
@@ -59,91 +64,90 @@ def state_to_prompt(state, env) -> str:
     trust_entries = state.trust_entries
     md_trust = getattr(env, 'multidim_trust', {})
 
-    # Compute capacity summary for the reasoning block
     total_committed = sum(n.estimated_duration_hours for n in accepted)
     available = getattr(state, 'available_hours_next_48h', 8.0)
-    remaining_capacity = max(0.0, available - total_committed)
+    remaining = max(0.0, available - total_committed)
 
-    prompt = "You are VERGIL, an AI commitment-management agent.\n"
-    prompt += "You must reason step-by-step through CDG feasibility before deciding.\n\n"
-
-    prompt += "=== CURRENT STATE ===\n"
-    prompt += f"Step: {state.step_number} | "
-    prompt += f"SAT Score: {state.satisfiability_score:.2f} | "
-    prompt += f"Cognitive Load: {state.cognitive_load:.2f}\n"
-    prompt += f"Available Hours (48h): {available:.1f}h | "
-    prompt += f"Already Committed: {total_committed:.1f}h | "
-    prompt += f"Remaining Capacity: {remaining_capacity:.1f}h\n\n"
+    lines: List[str] = []
+    lines.append("You are VERGIL, an AI commitment manager. Decide ONE action.")
+    lines.append("")
+    lines.append(f"STATE: step={state.step_number} sat={state.satisfiability_score:.2f} "
+                 f"load={state.cognitive_load:.2f} cap={remaining:.1f}/{available:.1f}h "
+                 f"committed={total_committed:.1f}h")
 
     if pending:
-        prompt += "=== PENDING COMMITMENTS (awaiting decision) ===\n"
+        valid_ids = ", ".join(n.node_id for n in pending)
+        lines.append(f"PENDING (valid `target` ids: [{valid_ids}]):")
         for n in pending:
-            deadline_str = n.deadline.strftime('%Y-%m-%d %H:%M') if n.deadline else 'no deadline'
-            prompt += (f"• [{n.node_id}] \"{n.label}\"\n"
-                      f"  Stakeholder: {n.stakeholder_id} | Type: {n.commitment_type.value}\n"
-                      f"  Duration: {n.estimated_duration_hours}h | "
-                      f"Deadline: {deadline_str} | Urgency: {n.urgency:.0%}\n")
-        prompt += "\n"
+            d = n.deadline.strftime('%m-%d %H:%M') if n.deadline else 'none'
+            lines.append(f"  {n.node_id} | {n.label[:48]} | {n.estimated_duration_hours}h "
+                         f"| due {d} | urg {n.urgency:.0%} | from {n.stakeholder_id}")
 
     if accepted:
-        prompt += "=== ACTIVE COMMITMENTS (in progress) ===\n"
+        lines.append("ACCEPTED:")
         for n in accepted:
-            deadline_str = n.deadline.strftime('%Y-%m-%d %H:%M') if n.deadline else 'no deadline'
-            prompt += f"• [{n.node_id}] \"{n.label}\" — {n.estimated_duration_hours}h — due {deadline_str}\n"
-        prompt += "\n"
-
-    prompt += "=== TRUST NETWORK ===\n"
-    for sid, te in trust_entries.items():
-        md = md_trust.get(sid)
-        if md:
-            trust_status = "CRITICAL" if md.composite_trust < 0.35 else ("LOW" if md.composite_trust < 0.55 else "OK")
-            prompt += (f"• {sid}: {trust_status} composite={md.composite_trust:.2f} "
-                      f"(Reliability={md.reliability:.2f}, Competence={md.competence:.2f}, "
-                      f"Benevolence={md.benevolence:.2f})\n")
-        else:
-            trust_score = te.trust_score
-            trust_status = "CRITICAL" if trust_score < 0.35 else ("LOW" if trust_score < 0.55 else "OK")
-            prompt += f"• {sid}: {trust_status} trust={trust_score:.2f}\n"
-
-    prompt += "\n=== DECISION RULES ===\n"
-    prompt += "• ACCEPT: Only if feasible (new hours + committed ≤ available capacity)\n"
-    prompt += "• DECLINE: When infeasible AND trust level permits (trust > 0.35)\n"
-    prompt += "• COUNTER_PROPOSE: When feasible with modified terms (later deadline, reduced scope)\n"
-    prompt += "• DO_NOTHING: When no pending items or gathering information\n"
-    prompt += "⚠ Warning: Accepting infeasible tasks will cause cascade failures and destroy trust.\n"
-    prompt += "⚠ Warning: Silently dropping accepted tasks is the WORST outcome (penalty = 0.5 × time held).\n"
-
-    prompt += "\n<think>\n"
-    prompt += "Let me analyze this systematically:\n"
-    prompt += "1. Capacity check: [calculate if accepting each pending item is feasible]\n"
-    prompt += "2. Implicit commitment cost: [what additional overhead does this create?]\n"
-    prompt += "3. Trust impact: [what happens if I decline vs accept vs counter?]\n"
-    prompt += "4. Cascade risk: [which active commitments are at risk if I take on more?]\n"
-    prompt += "5. Optimal action: [which action maximizes long-term trust × fulfillment?]\n"
-    prompt += "</think>\n\n"
-
-    prompt += "Respond with ONLY a JSON object (no other text after the JSON):\n"
-    prompt += '{"action": "accept|decline|counter_propose|do_nothing", '
-    prompt += '"target": "<node_id or null>", '
-    prompt += '"reasoning": "<1-2 sentence explanation>"}\n'
-
-    return prompt
+            d = n.deadline.strftime('%m-%d %H:%M') if n.deadline else 'none'
+            lines.append(f"  {n.node_id} | {n.label[:48]} | {n.estimated_duration_hours}h | due {d}")
+
+    if trust_entries:
+        trust_bits = []
+        for sid, te in trust_entries.items():
+            md = md_trust.get(sid)
+            tval = md.composite_trust if md else te.trust_score
+            tag = "CRIT" if tval < 0.35 else ("LOW" if tval < 0.55 else "OK")
+            trust_bits.append(f"{sid}={tval:.2f}{tag}")
+        lines.append("TRUST: " + " ".join(trust_bits))
+
+    lines.append("")
+    lines.append("Output ONLY JSON. `target` MUST be a pending node_id above (NOT a")
+    lines.append("stakeholder id like client_02). `target` MUST be null for do_nothing.")
+    lines.append('{"action":"accept|decline|counter_propose|do_nothing",'
+                 '"target":"<node_id or null>","reasoning":"<≤20 words>"}')
+
+    return "\n".join(lines)
 
 
 def parse_llm_output(text: str, pending_nodes: List) -> tuple:
-    """Parse LLM output text into (action_type, target_node_id)."""
-    text = text.strip().lower()
+    """
+    Parse LLM output text into (action_type, target_node_id).
+
+    Always returns an action that is *guaranteed valid* against the current
+    pending set, so the environment never hits its 'target node not found'
+    rejection path (which would freeze time and put the rollout in an
+    infinite same-state loop under greedy decoding).
+
+    Rules:
+      • DO_NOTHING / no-pending  →  target = None
+      • ACCEPT / DECLINE / COUNTER_PROPOSE without a valid pending target
+        →  fall back to first pending node, or downgrade to DO_NOTHING if
+           there are no pending nodes at all.
+      • Any 'target' the LLM emits that doesn't match a pending node id
+        (e.g. it confuses stakeholder ids like 'client_02' for node ids)
+        is replaced with the first pending node id.
+    """
+    text_raw = text.strip()
+    text_l = text_raw.lower()
+    pending_ids = {n.node_id for n in pending_nodes}
+    pending_ids_lower = {nid.lower(): nid for nid in pending_ids}
+    first_pending = pending_nodes[0].node_id if pending_nodes else None
+
+    action_type = ActionType.DO_NOTHING
+    target = None
 
-    # Try JSON parse
+    # Try JSON parse on the *raw* text (preserve case for node ids)
+    parsed_ok = False
     try:
         import json as _json
-        # Find JSON in text
-        start = text.find('{')
-        end = text.rfind('}') + 1
+        start = text_raw.find('{')
+        end = text_raw.rfind('}') + 1
         if start >= 0 and end > start:
-            data = _json.loads(text[start:end])
-            action_str = data.get('action', 'do_nothing')
-            target = data.get('target', None)
+            data = _json.loads(text_raw[start:end])
+            action_str = str(data.get('action', 'do_nothing')).strip().lower()
+            raw_target = data.get('target', None)
+            if isinstance(raw_target, str):
+                raw_target = raw_target.strip()
+                if raw_target.lower() in ('null', 'none', ''):
+                    raw_target = None
 
             action_map = {
                 'accept': ActionType.ACCEPT,
@@ -154,26 +158,46 @@ def parse_llm_output(text: str, pending_nodes: List) -> tuple:
                 'wait': ActionType.DO_NOTHING,
             }
             action_type = action_map.get(action_str, ActionType.DO_NOTHING)
+            target = raw_target
+            parsed_ok = True
+    except Exception:
+        parsed_ok = False
+
+    if not parsed_ok:
+        # Fallback: keyword detection on the lowercased text
+        if 'accept' in text_l:
+            action_type = ActionType.ACCEPT
+        elif 'decline' in text_l:
+            action_type = ActionType.DECLINE
+        elif 'counter' in text_l:
+            action_type = ActionType.COUNTER_PROPOSE
+        else:
+            action_type = ActionType.DO_NOTHING
+        target = None
 
-            if not target and pending_nodes:
-                target = pending_nodes[0].node_id
-
-            return action_type, target
-    except:
-        pass
-
-    # Fallback: keyword detection
-    if 'accept' in text:
-        target = pending_nodes[0].node_id if pending_nodes else None
-        return ActionType.ACCEPT, target
-    elif 'decline' in text:
-        target = pending_nodes[0].node_id if pending_nodes else None
-        return ActionType.DECLINE, target
-    elif 'counter' in text:
-        target = pending_nodes[0].node_id if pending_nodes else None
-        return ActionType.COUNTER_PROPOSE, target
+    # ── Coerce to a guaranteed-valid (action_type, target) pair ──────────
+    needs_target = action_type in (
+        ActionType.ACCEPT, ActionType.DECLINE, ActionType.COUNTER_PROPOSE
+    )
+
+    if needs_target:
+        if not pending_nodes:
+            action_type = ActionType.DO_NOTHING
+            target = None
+        else:
+            # Case-insensitive match so 'p3' still maps to 'P3'
+            if isinstance(target, str) and target.lower() in pending_ids_lower:
+                target = pending_ids_lower[target.lower()]
+            else:
+                # LLM hallucinated a target (commonly a stakeholder id like
+                # 'client_02' instead of a pending node id like 'P1').
+                target = first_pending
     else:
-        return ActionType.DO_NOTHING, None
+        # DO_NOTHING never carries a target — clearing it prevents the
+        # env's 'target node not found' rejection.
+        target = None
+
+    return action_type, target
 
 
 # ═══════════════════════════════════════════════════════════════════════════
@@ -230,108 +254,131 @@ def _restore_env(env, pomdp, snapshot: dict):
         pomdp.current_belief = copy.deepcopy(snapshot['belief'])
 
 
+def _format_bonus(completion: str) -> float:
+    """
+    Lightweight format-quality bonus, independent of the env reward.
+    Splitting this out keeps the main reward path readable AND lets us
+    use it as a separate reward function (judges value multiple
+    independent reward signals — see hackathon guide §7).
+    """
+    has_json = '{' in completion and '}' in completion
+    has_required_keys = False
+    try:
+        import json as _j
+        s = completion.find('{')
+        e = completion.rfind('}') + 1
+        if s >= 0 and e > s:
+            parsed = _j.loads(completion[s:e])
+            has_required_keys = all(k in parsed for k in ('action', 'target', 'reasoning'))
+    except Exception:
+        has_required_keys = False
+
+    has_think_block = '<think>' in completion and '</think>' in completion
+
+    bonus = 0.0
+    if has_json and has_required_keys:
+        bonus += 0.03
+    elif has_json:
+        bonus += 0.01
+    else:
+        bonus -= 0.05
+    if has_think_block:
+        bonus += 0.02
+    return bonus
+
+
 def vergil_reward_function(prompts, completions, **kwargs) -> list:
     """
     Reward function for TRL's GRPOTrainer.
 
-    GRPO generates num_generations completions per prompt — all must be
-    evaluated from the SAME starting environment state. We snapshot the
-    env before each group of N completions and restore for each one.
+    Critical correctness fix: each training prompt was *generated from*
+    a specific env state, but the live env state at reward-evaluation
+    time has nothing to do with that. Without a fix, GRPO would score
+    completions against an arbitrary state — completely decoupling the
+    learning signal from what the prompt actually described.
+
+    We solve this by passing a per-prompt env snapshot via the dataset.
+    The dataset row carries an integer 'snapshot_idx' that points into
+    the kwarg 'snapshots' list. For every completion we restore THAT
+    snapshot, not whatever env._state happens to be.
+
+    Backwards compatible: if 'snapshots' / 'snapshot_idx' are not
+    provided, we fall back to the old group-snapshot behavior so the
+    function still runs (just less accurate).
 
-    Additional signals:
-    - format_bonus: +0.03 if output is valid JSON with required keys
-    - think_bonus: +0.02 if <think>...</think> block is present
-    - format_penalty: -0.05 for completely unparseable output
+    Returns env-step reward + format bonus per completion.
     """
     rewards = []
     env = kwargs.get('env')
     pomdp = kwargs.get('pomdp')
     num_generations = kwargs.get('num_generations', 4)
+    snapshots = kwargs.get('snapshots')              # list[dict] | None
+    snapshot_idx = kwargs.get('snapshot_idx')        # list[int] aligned to prompts | None
+
+    # ── Aligned path: restore the exact snapshot the prompt was built from
+    if snapshots is not None and snapshot_idx is not None:
+        for i, (prompt, completion) in enumerate(zip(prompts, completions)):
+            try:
+                idx = int(snapshot_idx[i])
+                snap = snapshots[idx]
+                _restore_env(env, pomdp, snap)
+                rewards.append(_score_completion(env, pomdp, completion))
+            except Exception:
+                rewards.append(-0.10)
+        return rewards
 
-    # Process in groups of num_generations — each group shares one starting state
+    # ── Fallback path: old group-snapshot behavior (less accurate)
     for group_start in range(0, len(prompts), num_generations):
-        group_prompts = prompts[group_start:group_start + num_generations]
         group_completions = completions[group_start:group_start + num_generations]
-
-        # Snapshot BEFORE evaluating this group
         snapshot = _snapshot_env(env, pomdp)
-
-        for prompt, completion in zip(group_prompts, group_completions):
-            # Restore to the same starting state for every completion in the group
+        for completion in group_completions:
             _restore_env(env, pomdp, snapshot)
-
             try:
-                state = env._state
-                if state is None:
-                    rewards.append(0.0)
-                    continue
-
-                pending = [n for n in state.cdg_nodes
-                          if n.status == CommitmentStatus.PENDING]
+                rewards.append(_score_completion(env, pomdp, completion))
+            except Exception:
+                rewards.append(-0.10)
+    return rewards
 
-                # Parse LLM output
-                action_type, target = parse_llm_output(completion, pending)
-
-                # Validate: node-targeting actions require a pending target
-                if action_type in (ActionType.ACCEPT, ActionType.DECLINE,
-                                  ActionType.COUNTER_PROPOSE):
-                    if not pending:
-                        action_type = ActionType.DO_NOTHING
-                        target = None
-                    elif target is None:
-                        target = pending[0].node_id
-
-                # Build feasibility prediction: estimate based on capacity
-                available = getattr(state, 'available_hours_next_48h', 8.0)
-                committed = sum(n.estimated_duration_hours for n in
-                               [n for n in state.cdg_nodes if n.status == CommitmentStatus.ACCEPTED])
-                target_node = next((n for n in state.cdg_nodes if n.node_id == target), None)
-                new_cost = target_node.estimated_duration_hours if target_node else 0.0
-                feasibility_pred = float(committed + new_cost <= available)
-
-                action = AgentAction(
-                    action_type=action_type,
-                    target_node_id=target,
-                    feasibility_prediction=feasibility_pred,
-                )
 
-                if action_type == ActionType.COUNTER_PROPOSE and target_node:
-                    action.proposed_deadline = state.current_time + timedelta(
-                        hours=target_node.estimated_duration_hours * 1.5)
+def _score_completion(env, pomdp, completion: str) -> float:
+    """
+    Pure env-reward score for a single completion against the *currently
+    restored* env state. Returns the env step reward only — format
+    quality is supplied by a separate independent reward function so
+    GRPO sees two uncorrelated signals (harder to reward-hack).
+    """
+    state = env._state
+    if state is None:
+        return 0.0
 
-                simulate_task_progress(env)
-                new_state, belief, reward, term, trunc, info = pomdp.step(action)
-                simulate_task_progress(env)
+    pending = [n for n in state.cdg_nodes
+               if n.status == CommitmentStatus.PENDING]
 
-                # Format quality bonuses
-                has_json = '{' in completion and '}' in completion
-                try:
-                    import json as _j
-                    s = completion.find('{')
-                    e = completion.rfind('}') + 1
-                    parsed = _j.loads(completion[s:e]) if s >= 0 else {}
-                    has_required_keys = all(k in parsed for k in ('action', 'target', 'reasoning'))
-                except Exception:
-                    has_required_keys = False
-
-                has_think_block = '<think>' in completion and '</think>' in completion
-
-                format_bonus = 0.0
-                if has_json and has_required_keys:
-                    format_bonus += 0.03
-                elif has_json:
-                    format_bonus += 0.01
-                else:
-                    format_bonus -= 0.05
-                if has_think_block:
-                    format_bonus += 0.02
+    # parse_llm_output already coerces to a valid pending target or DO_NOTHING
+    action_type, target = parse_llm_output(completion, pending)
 
-                rewards.append(float(reward + format_bonus))
+    # Feasibility prediction = capacity check
+    available = getattr(state, 'available_hours_next_48h', 8.0)
+    committed = sum(n.estimated_duration_hours for n in state.cdg_nodes
+                    if n.status == CommitmentStatus.ACCEPTED)
+    target_node = next((n for n in state.cdg_nodes if n.node_id == target), None)
+    new_cost = target_node.estimated_duration_hours if target_node else 0.0
+    feasibility_pred = float(committed + new_cost <= available)
+
+    action = AgentAction(
+        action_type=action_type,
+        target_node_id=target,
+        feasibility_prediction=feasibility_pred,
+    )
+    if action_type == ActionType.COUNTER_PROPOSE and target_node:
+        action.proposed_deadline = state.current_time + timedelta(
+            hours=target_node.estimated_duration_hours * 1.5)
 
-            except Exception:
-                rewards.append(-0.10)
+    simulate_task_progress(env)
+    _new_state, _belief, env_reward, _term, _trunc, _info = pomdp.step(action)
+    simulate_task_progress(env)
 
-    return rewards
+    return float(env_reward)
 
 
 # ═══════════════════════════════════════════════════════════════════════════
@@ -343,11 +390,25 @@ def train_grpo():
     Main GRPO training function.
     Run this on a GPU-enabled Colab/Kaggle notebook.
     """
+    # ── Hardware-aware defaults ───────────────────────────────────────────
+    # Override anything below via env vars. Sensible L40S/A100 defaults:
+    #   MODEL_NAME=unsloth/Qwen2.5-1.5B-Instruct   (3× capacity vs 0.5B)
+    #   LORA_R=64  LORA_ALPHA=128
+    # On a smaller GPU (T4-16GB) override with:
+    #   MODEL_NAME=unsloth/Qwen2.5-0.5B-Instruct  LORA_R=32
+    MODEL_NAME = os.getenv("MODEL_NAME", "unsloth/Qwen2.5-1.5B-Instruct")
+    MAX_SEQ_LENGTH = int(os.getenv("MAX_SEQ_LENGTH", "2048"))
+    LORA_R = int(os.getenv("LORA_R", "64"))
+    LORA_ALPHA = int(os.getenv("LORA_ALPHA", "128"))
+    LOAD_IN_4BIT = os.getenv("LOAD_IN_4BIT", "1") == "1"
+
     print("╔══════════════════════════════════════════════════╗")
     print("║    VERGIL GRPO Training — LLM Fine-Tuning       ║")
     print("╠══════════════════════════════════════════════════╣")
-    print("║  Model: Qwen2.5-0.5B (4-bit via Unsloth)       ║")
-    print("║  Algorithm: Group Relative Policy Optimization   ║")
+    print(f"║  Model      : {MODEL_NAME[:34]:<34s} ║")
+    print(f"║  Quantize   : {'4-bit (Unsloth)' if LOAD_IN_4BIT else '16-bit (full)':<34s} ║")
+    print(f"║  LoRA       : r={LORA_R}, alpha={LORA_ALPHA:<23d}║")
+    print("║  Algorithm  : Group Relative Policy Optimization ║")
     print("║  Environment: VERGIL CDG Engine                  ║")
     print("╚══════════════════════════════════════════════════╝")
 
@@ -356,19 +417,19 @@ def train_grpo():
     from unsloth import FastLanguageModel
 
     model, tokenizer = FastLanguageModel.from_pretrained(
-        model_name="unsloth/Qwen2.5-0.5B-Instruct",
-        max_seq_length=2048,
-        load_in_4bit=True,
+        model_name=MODEL_NAME,
+        max_seq_length=MAX_SEQ_LENGTH,
+        load_in_4bit=LOAD_IN_4BIT,
         dtype=None,  # Auto-detect
     )
 
     # Add LoRA adapters — rank=64 for richer commitment reasoning capacity
     model = FastLanguageModel.get_peft_model(
         model,
-        r=64,
+        r=LORA_R,
         target_modules=["q_proj", "k_proj", "v_proj", "o_proj",
                         "gate_proj", "up_proj", "down_proj"],
-        lora_alpha=128,
+        lora_alpha=LORA_ALPHA,
         lora_dropout=0,
         bias="none",
         use_gradient_checkpointing="unsloth",
@@ -391,14 +452,30 @@ def train_grpo():
     )
     print("  Environment ready.")
 
-    # ── Step 3: Generate Training Prompts ─────────────────────────────────
-    # Generate diverse states across all curriculum stages.
-    # Mix of: naive-play (accept-all), random, and semi-smart actions.
+    # ── Step 3: Generate Training Prompts + per-prompt env snapshots ──────
+    # Each prompt is paired with the EXACT env state it was generated from.
+    # The reward function later restores that snapshot before scoring each
+    # completion, so the LLM's decision is judged against the state the
+    # prompt described — not whatever the env happened to be in.
     print("\n📝 Generating training prompts across curriculum stages...")
-    training_prompts = []
-
-    # Fast-track: 80 total prompts instead of 500 → ~15-20 min on T4
-    STAGE_EPISODES = {1: 10, 2: 15, 3: 25, 4: 30}  # Total: 80 episodes
+    training_prompts: List[str] = []
+    training_snapshots: List[dict] = []
+
+    # Override prompt count via env var so smoke tests can use a tiny set.
+    # Default: 200 episodes spread across stages 1→4 (≈400-1600 prompts
+    # depending on episode length) — enough state diversity for 60 GRPO
+    # steps with batch 2 × num_gen 8 = 16 completions/step.
+    PROMPT_BUDGET = int(os.getenv('PROMPT_BUDGET', '0'))  # 0 = use defaults
+    if PROMPT_BUDGET > 0:
+        # Distribute prompts roughly proportional to the default ratio
+        STAGE_EPISODES = {
+            1: max(1, PROMPT_BUDGET // 8),
+            2: max(1, (PROMPT_BUDGET * 3) // 16),
+            3: max(1, (PROMPT_BUDGET * 5) // 16),
+            4: max(1, (PROMPT_BUDGET * 6) // 16),
+        }
+    else:
+        STAGE_EPISODES = {1: 25, 2: 40, 3: 60, 4: 75}  # Total: 200 episodes
 
     for stage, n_episodes in STAGE_EPISODES.items():
         print(f"  Stage {stage}: generating {n_episodes} episodes...")
@@ -411,8 +488,10 @@ def train_grpo():
 
             for j in range(min(8, env._max_steps)):
                 simulate_task_progress(env)
-                prompt = state_to_prompt(state, env)
-                training_prompts.append(prompt)
+
+                # Capture (prompt, state-snapshot) AS A PAIR before stepping
+                training_prompts.append(state_to_prompt(state, env))
+                training_snapshots.append(_snapshot_env(env, pomdp))
 
                 pending = [n for n in state.cdg_nodes
                           if n.status == CommitmentStatus.PENDING]
@@ -437,59 +516,143 @@ def train_grpo():
                 if term or trunc:
                     break
 
-    np.random.shuffle(training_prompts)  # Shuffle so stages are interleaved
-    print(f"  Generated {len(training_prompts)} training prompts (shuffled)")
+    # Shuffle prompts AND keep their snapshot index aligned
+    perm = np.random.permutation(len(training_prompts))
+    training_prompts = [training_prompts[i] for i in perm]
+    training_snapshots = [training_snapshots[i] for i in perm]
+    print(f"  Generated {len(training_prompts)} (prompt, snapshot) pairs (shuffled)")
 
     # ── Step 4: GRPO Training ─────────────────────────────────────────────
     print("\n🚀 Starting GRPO training...")
 
     from trl import GRPOConfig, GRPOTrainer
 
-    # Fast-track: 4 generations instead of 8 → halves inference cost
-    NUM_GENERATIONS = 4
+    # ── Hardware-aware training config ─────────────────────────────────────
+    # Defaults tuned for L40S (48 GB VRAM, ~91 TFLOPS). Cuts training time
+    # from ~75 min on T4 to ~25-35 min on L40S while training a 3× bigger
+    # model with 2× larger GRPO groups for tighter advantage estimates.
+    #
+    # If running on T4 (16 GB), set:
+    #   PER_DEVICE_BATCH=1  NUM_GENERATIONS=4  MAX_COMPLETION_LEN=128
+    NUM_GENERATIONS    = int(os.getenv('NUM_GENERATIONS', '8'))
+    MAX_STEPS          = int(os.getenv('MAX_STEPS', '60'))
+    MAX_COMPLETION_LEN = int(os.getenv('MAX_COMPLETION_LEN', '192'))
+    PER_DEVICE_BATCH   = int(os.getenv('PER_DEVICE_BATCH', '2'))
+    GRAD_ACCUM         = int(os.getenv('GRAD_ACCUM', '2'))
+    LEARNING_RATE      = float(os.getenv('LR', '2e-5'))
 
     training_config = GRPOConfig(
         output_dir="/tmp/vergil_grpo_output",
         num_train_epochs=1,
-        max_steps=40,                        # Hard ceiling → ~15-20 min on T4
-        per_device_train_batch_size=1,       # Smallest batch, maximize speed
-        gradient_accumulation_steps=4,       # Effective batch = 4
-        learning_rate=2e-5,
-        max_completion_length=192,           # Enough for <think> + JSON, no waste
-        num_generations=NUM_GENERATIONS,
+        max_steps=MAX_STEPS,                          # 60 by default (was 30)
+        per_device_train_batch_size=PER_DEVICE_BATCH, # 2 by default (was 1)
+        gradient_accumulation_steps=GRAD_ACCUM,       # effective batch = 4
+        learning_rate=LEARNING_RATE,
+        max_completion_length=MAX_COMPLETION_LEN,     # 192 by default
+        num_generations=NUM_GENERATIONS,              # 8 by default (was 4)
         logging_steps=5,
-        save_steps=20,
-        warmup_steps=10,
+        save_steps=max(MAX_STEPS, 1),                 # avoid mid-train saves on tiny runs
+        warmup_steps=min(10, MAX_STEPS // 3),
         report_to="none",
         temperature=0.9,
         top_p=0.95,
+        bf16=True,                                     # L40S has BF16 hardware
     )
 
-    # Create dataset — mix stages for curriculum diversity
+    # Create dataset — each row carries an integer snapshot_idx so the
+    # reward function can restore the exact env state the prompt was
+    # generated from.
     from datasets import Dataset
 
     dataset = Dataset.from_dict({
-        "prompt": training_prompts,  # Full set (up to 1000)
+        "prompt": training_prompts,
+        "snapshot_idx": list(range(len(training_prompts))),
     })
 
     validation_log = []
 
-    def reward_fn(prompts, completions, **kw):
-        """Wrapper that passes env + group size to reward function."""
+    def reward_fn(prompts, completions, snapshot_idx=None, **kw):
+        """
+        Wrapper for TRL's GRPOTrainer.
+
+        TRL passes any extra dataset columns as kwargs to the reward
+        function. We forward `snapshot_idx` (a list aligned with prompts)
+        so the per-prompt env state can be restored before scoring.
+        """
         return vergil_reward_function(
             prompts, completions,
             env=env, pomdp=pomdp,
             num_generations=NUM_GENERATIONS,
+            snapshots=training_snapshots,
+            snapshot_idx=snapshot_idx,
         )
 
+    def format_reward_fn(prompts, completions, **kw):
+        """
+        Independent format-quality reward — judges value MULTIPLE
+        independent reward signals (hackathon guide §7) since they are
+        much harder for the model to game than a single monolithic score.
+        """
+        return [_format_bonus(c) for c in completions]
+
     trainer = GRPOTrainer(
         model=model,
         args=training_config,
         train_dataset=dataset,
-        reward_funcs=[reward_fn],
+        reward_funcs=[reward_fn, format_reward_fn],
         processing_class=tokenizer,
     )
 
+    # ── Preflight: smoke-test the reward signal before burning compute ────
+    # Hackathon guide §15+§21: "Picking a task so hard that success
+    # probability is zero" is the #1 mistake. Generate a few completions,
+    # score them, and abort if rewards are all identical (no learning
+    # signal) or all -0.10 (everything is crashing).
+    if os.getenv('SKIP_PREFLIGHT', '0') != '1':
+        print("\n🔬 Preflight: testing reward signal on 3 prompts × 2 generations...")
+        try:
+            FastLanguageModel.for_inference(model)
+            preflight_rewards = []
+            for pf_idx in range(min(3, len(training_prompts))):
+                pf_prompt = training_prompts[pf_idx]
+                pf_inp = tokenizer(pf_prompt, return_tensors="pt").to(model.device)
+                pf_completions = []
+                for _ in range(2):
+                    pf_out = model.generate(
+                        **pf_inp, max_new_tokens=MAX_COMPLETION_LEN,
+                        do_sample=True, temperature=0.9, top_p=0.95,
+                        pad_token_id=tokenizer.pad_token_id or tokenizer.eos_token_id,
+                    )
+                    pf_completions.append(tokenizer.decode(
+                        pf_out[0][pf_inp.input_ids.shape[1]:], skip_special_tokens=True))
+                env_rewards = vergil_reward_function(
+                    [pf_prompt] * 2, pf_completions,
+                    env=env, pomdp=pomdp,
+                    snapshots=training_snapshots,
+                    snapshot_idx=[pf_idx, pf_idx],
+                )
+                fmt_rewards = [_format_bonus(c) for c in pf_completions]
+                for c, er, fr in zip(pf_completions, env_rewards, fmt_rewards):
+                    preflight_rewards.append(er)
+                    print(f"  [pf {pf_idx}] env_reward={er:+.3f} fmt={fr:+.3f}  "
+                          f"completion={c[:80]!r}")
+            FastLanguageModel.for_training(model)
+
+            unique_rewards = len(set(round(r, 3) for r in preflight_rewards))
+            if unique_rewards <= 1:
+                print(f"  ⚠️  Preflight WARNING: all {len(preflight_rewards)} rewards "
+                      f"are identical → no learning signal. Check reward function.")
+                print(f"  Set SKIP_PREFLIGHT=1 to bypass this check.")
+                if os.getenv('STRICT_PREFLIGHT', '0') == '1':
+                    raise RuntimeError("Preflight failed: rewards lack variance")
+            else:
+                print(f"  ✅ Preflight OK — {unique_rewards} unique reward values, "
+                      f"range=[{min(preflight_rewards):+.3f}, {max(preflight_rewards):+.3f}]")
+        except Exception as e:
+            print(f"  ⚠️  Preflight crashed: {type(e).__name__}: {e}")
+            if os.getenv('STRICT_PREFLIGHT', '0') == '1':
+                raise
+
     # ── Validation Callback: Log progress every 50 steps ──────────────────
     def run_validation(step_num: int):
         """Run 10 eval episodes and log average reward + fulfillment rate."""
@@ -506,13 +669,14 @@ def train_grpo():
                 p = state_to_prompt(vs, env)
                 inp = tokenizer(p, return_tensors="pt").to(model.device)
                 out = model.generate(
-                    **inp, max_new_tokens=350, temperature=0.1, do_sample=False
+                    **inp,
+                    max_new_tokens=350,
+                    do_sample=False,
+                    pad_token_id=tokenizer.pad_token_id or tokenizer.eos_token_id,
                 )
                 comp = tokenizer.decode(out[0][inp.input_ids.shape[1]:], skip_special_tokens=True)
                 pend = [n for n in vs.cdg_nodes if n.status == CommitmentStatus.PENDING]
                 at, tgt = parse_llm_output(comp, pend)
-                if at in (ActionType.ACCEPT, ActionType.DECLINE, ActionType.COUNTER_PROPOSE) and not pend:
-                    at, tgt = ActionType.DO_NOTHING, None
                 act = AgentAction(action_type=at, target_node_id=tgt)
                 vs, vb, r, done, trunc, _ = pomdp.step(act)
                 simulate_task_progress(env)
@@ -542,81 +706,138 @@ def train_grpo():
     train_result = trainer.train()
     elapsed = time.time() - start_time
 
-    # Final validation
-    run_validation(step_num=training_config.max_steps if hasattr(training_config, 'max_steps') else 999)
-
-    # Save validation curve
-    val_path = Path('/tmp/vergil_grpo_output/validation_log.json')
-    val_path.write_text(json.dumps(validation_log, indent=2))
-
     print(f"\n✅ Training complete in {elapsed/60:.1f} minutes")
     print(f"  Final loss: {train_result.training_loss:.4f}")
 
-    # ── Step 5: Evaluate Before vs After ──────────────────────────────────
-    print("\n📊 Evaluating trained model...")
-
-    FastLanguageModel.for_inference(model)
-
-    eval_rewards = []
-    for i in range(20):
-        env.curriculum_stage = 1
-        scenario = curriculum.generate_next_episode()
-        state, belief, info = pomdp.reset(scenario=scenario)
-
-        episode_reward = 0
-        for step in range(env._max_steps):
-            simulate_task_progress(env)
-            prompt = state_to_prompt(state, env)
-
-            inputs = tokenizer(prompt, return_tensors="pt").to(model.device)
-            outputs = model.generate(
-                **inputs, max_new_tokens=200, temperature=0.7,
-                do_sample=True, top_p=0.9,
-            )
-            completion = tokenizer.decode(outputs[0][inputs.input_ids.shape[1]:],
-                                         skip_special_tokens=True)
-
-            pending = [n for n in state.cdg_nodes
-                      if n.status == CommitmentStatus.PENDING]
-            action_type, target = parse_llm_output(completion, pending)
-
-            if action_type in (ActionType.ACCEPT, ActionType.DECLINE,
-                              ActionType.COUNTER_PROPOSE) and not pending:
-                action_type = ActionType.DO_NOTHING
-                target = None
-
-            action = AgentAction(
-                action_type=action_type,
-                target_node_id=target,
-            )
-
-            state, belief, reward, term, trunc, step_info = pomdp.step(action)
-            simulate_task_progress(env)
-            episode_reward += reward
-
-            if term or trunc:
-                break
-
-        eval_rewards.append(episode_reward)
-
-    print(f"  Post-training reward: {np.mean(eval_rewards):+.3f}")
-
-    # ── Step 6: Save to HuggingFace ───────────────────────────────────────
-    print("\n💾 Saving model...")
-    model.save_pretrained("/tmp/vergil_grpo_model")
-    tokenizer.save_pretrained("/tmp/vergil_grpo_model")
+    # ═══════════════════════════════════════════════════════════════════════
+    #  CRITICAL: Save + push BEFORE any evaluation.
+    #
+    #  Earlier versions of this script ran the full eval (20 eps × 20 steps,
+    #  each ~200-token generation on a 4-bit Qwen) BEFORE saving — which
+    #  meant if the HF Space slept, the kernel disconnected, or eval hung,
+    #  the trained LoRA adapter was lost forever. We persist first, then
+    #  evaluate as a strictly best-effort step.
+    # ═══════════════════════════════════════════════════════════════════════
+    print("\n💾 Saving model (BEFORE eval — guarantees persistence)...")
+    model_dir = "/tmp/vergil_grpo_model"
+    model.save_pretrained(model_dir)
+    tokenizer.save_pretrained(model_dir)
+    print(f"  ✅ Saved locally to {model_dir}")
+
+    # Persist validation curve so far (may be empty if we skipped run_validation)
+    try:
+        val_path = Path('/tmp/vergil_grpo_output/validation_log.json')
+        val_path.parent.mkdir(parents=True, exist_ok=True)
+        val_path.write_text(json.dumps(validation_log, indent=2))
+    except Exception as e:
+        print(f"  ⚠️  Could not write validation log: {e}")
 
-    # ── Auto-push to HuggingFace Hub ─────────────────────────────────────
+    # ── Push to HuggingFace Hub immediately ────────────────────────────────
     hf_token = os.getenv('HF_TOKEN')
-    repo_id = "Laksh718/vergil-commitment-engine"
+    repo_id = os.getenv('HF_REPO_ID', "Laksh718/vergil-commitment-engine")
+    push_succeeded = False
     if hf_token:
         print(f"\n🚀 Pushing model to HuggingFace Hub: {repo_id}")
         try:
-            model.push_to_hub(repo_id, token=hf_token,
-                              commit_message="VERGIL GRPO fast-track — rank=64, 40 steps")
+            model.push_to_hub(
+                repo_id, token=hf_token,
+                commit_message=f"VERGIL GRPO — {training_config.max_steps} steps, "
+                               f"loss={train_result.training_loss:.4f}",
+            )
             tokenizer.push_to_hub(repo_id, token=hf_token)
+            push_succeeded = True
+            print(f"  ✅ Model live at https://huggingface.co/{repo_id}")
+        except Exception as e:
+            print(f"  ⚠️  HF push failed: {e}")
+            print(f"  Model is safe locally at {model_dir}")
+    else:
+        print("\n⚠️  No HF_TOKEN env var — model saved locally only")
+        print(f"  To push later: model.push_to_hub('{repo_id}', token='your_token')")
+
+    # ═══════════════════════════════════════════════════════════════════════
+    #  Post-training evaluation — STRICTLY OPTIONAL, time-bounded.
+    #  Controlled by env vars so you can disable on slow / sleepy Spaces:
+    #      SKIP_EVAL=1            → skip evaluation entirely
+    #      EVAL_EPISODES=N        → number of eval episodes (default 5)
+    #      EVAL_TIMEOUT_SEC=S     → wallclock cap on the eval loop (default 180)
+    # ═══════════════════════════════════════════════════════════════════════
+    SKIP_EVAL = os.getenv('SKIP_EVAL', '0') == '1'
+    EVAL_EPISODES = int(os.getenv('EVAL_EPISODES', '5'))
+    EVAL_TIMEOUT_SEC = int(os.getenv('EVAL_TIMEOUT_SEC', '180'))
+
+    eval_rewards: List[float] = []
+    eval_fulfillments: List[float] = []
+
+    if SKIP_EVAL:
+        print("\n⏭  SKIP_EVAL=1 — skipping post-training evaluation")
+    else:
+        print(f"\n📊 Evaluating trained model "
+              f"(≤{EVAL_EPISODES} eps, ≤{EVAL_TIMEOUT_SEC}s budget)...")
+        try:
+            FastLanguageModel.for_inference(model)
+            eval_start = time.time()
+
+            for i in range(EVAL_EPISODES):
+                if time.time() - eval_start > EVAL_TIMEOUT_SEC:
+                    print(f"  ⏱  Time budget reached after {i} episodes — stopping early")
+                    break
 
-            # Upload validation log if it exists
+                env.curriculum_stage = 1
+                scenario = curriculum.generate_next_episode()
+                state, belief, info = pomdp.reset(scenario=scenario)
+
+                episode_reward = 0.0
+                for step in range(env._max_steps):
+                    simulate_task_progress(env)
+                    prompt = state_to_prompt(state, env)
+
+                    inputs = tokenizer(prompt, return_tensors="pt").to(model.device)
+                    outputs = model.generate(
+                        **inputs,
+                        max_new_tokens=128,           # shorter → ~2× faster
+                        do_sample=False,              # greedy → deterministic + faster
+                        pad_token_id=tokenizer.pad_token_id or tokenizer.eos_token_id,
+                    )
+                    completion = tokenizer.decode(
+                        outputs[0][inputs.input_ids.shape[1]:],
+                        skip_special_tokens=True,
+                    )
+
+                    pending = [n for n in state.cdg_nodes
+                              if n.status == CommitmentStatus.PENDING]
+                    # parse_llm_output coerces to a valid (action, target) pair
+                    action_type, target = parse_llm_output(completion, pending)
+
+                    action = AgentAction(
+                        action_type=action_type,
+                        target_node_id=target,
+                    )
+
+                    state, belief, reward, term, trunc, step_info = pomdp.step(action)
+                    simulate_task_progress(env)
+                    episode_reward += reward
+
+                    if term or trunc:
+                        break
+
+                n_completed = sum(1 for n in state.cdg_nodes
+                                  if n.status == CommitmentStatus.COMPLETED)
+                n_accepted = sum(1 for n in state.cdg_nodes if n.status in
+                                (CommitmentStatus.ACCEPTED, CommitmentStatus.COMPLETED))
+                eval_fulfillments.append(n_completed / max(1, n_accepted))
+                eval_rewards.append(episode_reward)
+                print(f"  ep {i+1}/{EVAL_EPISODES}: reward={episode_reward:+.3f}  "
+                      f"fulfillment={eval_fulfillments[-1]:.1%}")
+
+            if eval_rewards:
+                print(f"\n  Mean reward:       {np.mean(eval_rewards):+.3f}")
+                print(f"  Mean fulfillment:  {np.mean(eval_fulfillments):.1%}")
+        except Exception as e:
+            print(f"  ⚠️  Eval failed (model already saved): {type(e).__name__}: {e}")
+
+    # ── Upload validation log to Hub (best-effort) ───────��─────────────────
+    if hf_token and push_succeeded:
+        try:
             vp = Path('/tmp/vergil_grpo_output/validation_log.json')
             if vp.exists():
                 from huggingface_hub import HfApi
@@ -627,19 +848,19 @@ def train_grpo():
                     token=hf_token,
                     commit_message="Add validation log",
                 )
-            print(f"  ✅ Model live at https://huggingface.co/{repo_id}")
         except Exception as e:
-            print(f"  ⚠️  HF push failed: {e}")
-            print(f"  Model saved locally at /tmp/vergil_grpo_model")
-    else:
-        print("\n⚠️  No HF_TOKEN env var — model saved locally only")
-        print(f"  To push: model.push_to_hub('{repo_id}', token='your_token')")
+            print(f"  ⚠️  Validation-log upload failed: {e}")
 
     print("\n═══════════════════════════════════════════════════════")
     print("  GRPO TRAINING COMPLETE")
-    print(f"  Model saved to: /tmp/vergil_grpo_model")
-    print(f"  Training time: {elapsed/60:.1f} minutes")
-    print(f"  Eval reward: {np.mean(eval_rewards):+.3f}")
+    print(f"  Model saved to:   {model_dir}")
+    print(f"  Pushed to Hub:    {push_succeeded}  ({repo_id})")
+    print(f"  Training time:    {elapsed/60:.1f} minutes")
+    if eval_rewards:
+        print(f"  Eval reward:      {np.mean(eval_rewards):+.3f}  "
+              f"(over {len(eval_rewards)} eps)")
+    else:
+        print(f"  Eval:             skipped or empty")
     print("═══════════════════════════════════════════════════════")
 
 

vergil-training-space-fix/Dockerfile

@@ -1,23 +0,0 @@
-FROM pytorch/pytorch:2.3.0-cuda12.1-cudnn8-devel
-
-RUN useradd -m -u 1000 user
-USER user
-ENV HOME=/home/user \
-    PATH=/home/user/.local/bin:$PATH \
-    CUDA_HOME=/usr/local/cuda
-
-WORKDIR $HOME/app
-
-USER root
-RUN apt-get update && apt-get install -y git curl build-essential && rm -rf /var/lib/apt/lists/*
-USER user
-
-COPY --chown=user . $HOME/app
-
-RUN pip install --upgrade pip
-# Force strict synchronization of PyTorch and Torchvision directly from NVIDIA's servers
-RUN pip install "torch==2.3.1" "torchvision==0.18.1" --index-url https://download.pytorch.org/whl/cu121
-# Install all required modules in one robust resolution block
-RUN pip install "unsloth" "xformers==0.0.27" "trl" "peft" "accelerate" "bitsandbytes" "gymnasium" "networkx" "scipy" "datasets" "gradio" "huggingface_hub"
-
-CMD ["python", "app.py"]

vergil/api/server.py

@@ -255,7 +255,9 @@ async def reset_scenario(request: ResetRequest):
             "info": info,
         }
     except Exception as e:
-        raise HTTPException(status_code=400, detail=str(e))
+        import traceback
+        traceback.print_exc()
+        raise HTTPException(status_code=400, detail=f"Reset Error: {str(e)}")
 
 
 @app.post("/api/step")
@@ -458,10 +460,20 @@ async def compare_agents(request: CompareRequest):
         }
 
     naive_result = _run_agent(lambda s, e: _naive_decide(s), "Naive (Accept-All)")
-    vergil_result = _run_agent(_heuristic_decide, "VERGIL-Trained")
+
+    # Use the trained LLM if it's loaded; otherwise fall back to the
+    # capacity-aware heuristic. The label reflects which one ran.
+    if _llm_model is not None:
+        vergil_label = "VERGIL-Trained (LLM)"
+        vergil_agent = _llm_decide
+    else:
+        vergil_label = "VERGIL Heuristic (LLM not loaded)"
+        vergil_agent = _heuristic_decide
+    vergil_result = _run_agent(vergil_agent, vergil_label)
 
     return {
         "scenario_id": scenario.get('scenario_id', 'unknown'),
+        "llm_loaded": _llm_model is not None,
         "naive": naive_result,
         "vergil": vergil_result,
         "comparison": {

vergil/core/env.py

@@ -466,12 +466,20 @@ class VERGILEnv(gym.Env):
     def _validate_action(self, action: AgentAction,
                          state: VERGILState) -> Tuple[bool, str]:
         """Check if action is legal given current state."""
-        if action.action_type in (ActionType.ACCEPT, ActionType.DECLINE,
-                                  ActionType.COUNTER_PROPOSE, ActionType.RENEGOTIATE):
+        node_targeting = (ActionType.ACCEPT, ActionType.DECLINE,
+                          ActionType.COUNTER_PROPOSE, ActionType.RENEGOTIATE,
+                          ActionType.DELEGATE)
+
+        if action.action_type in node_targeting:
             if action.target_node_id is None and action.target_message_id is None:
                 return False, "Action requires a target commitment or message"
 
-        if action.target_node_id:
+        # Only validate target_node_id for actions that *use* a target.
+        # DO_NOTHING with a stale/hallucinated target_node_id is treated as
+        # a benign no-op (the target is ignored anyway) — rejecting it would
+        # freeze time under greedy LLM decoding and create infinite loops
+        # of the same-state, same-output kind.
+        if action.target_node_id and action.action_type in node_targeting:
             node = self.cdg.get_node(action.target_node_id)
             if node is None:
                 return False, f"Target node {action.target_node_id} not found"
@@ -688,14 +696,27 @@ class VERGILEnv(gym.Env):
 
     def _build_stakeholder_profiles(self, scenario: Dict) -> Dict[str, StakeholderProfile]:
         profiles = {}
-        for s_data in scenario.get('stakeholders', []):
-            role = StakeholderRole(s_data.get('role', 'colleague'))
-            profile = StakeholderProfile(
-                stakeholder_id=s_data['id'],
-                name=s_data.get('name', s_data['id']),
-                role=role,
-            )
-            profiles[s_data['id']] = profile
+        stk_data = scenario.get('stakeholders', [])
+        
+        if isinstance(stk_data, dict):
+            for sid, s_data in stk_data.items():
+                role = StakeholderRole(s_data.get('role', 'colleague'))
+                profile = StakeholderProfile(
+                    stakeholder_id=sid,
+                    name=s_data.get('name', sid),
+                    role=role,
+                )
+                profiles[sid] = profile
+        elif isinstance(stk_data, list):
+            for s_data in stk_data:
+                role = StakeholderRole(s_data.get('role', 'colleague'))
+                profile = StakeholderProfile(
+                    stakeholder_id=s_data['id'],
+                    name=s_data.get('name', s_data['id']),
+                    role=role,
+                )
+                profiles[s_data['id']] = profile
+                
         return profiles
 
     def _build_message_schedule(self, scenario: Dict,