cot

app.py

@@ -375,6 +375,41 @@ CHAIN_CSS = """
 .hct-s1 .hct-dot { background: #6878c8; }
 .hct-s2 .hct-dot { background: #c08040; }
 .hct-s3 .hct-dot { background: #d4453a; }
+
+/* ── Prompt collapsible ── */
+details.hct-prompt-details { padding: 0 14px 10px; }
+details.hct-prompt-details summary {
+  display: inline-flex; align-items: center; list-style: none;
+  font-family: 'DM Mono', monospace; font-size: 9px;
+  letter-spacing: 0.08em; text-transform: uppercase;
+  padding: 3px 10px; border-radius: 20px; cursor: pointer;
+  border: 1px solid currentColor; opacity: 0.4;
+  transition: opacity 0.2s; background: transparent; user-select: none;
+}
+details.hct-prompt-details summary::-webkit-details-marker { display: none; }
+details.hct-prompt-details summary::before { content: '▼  prompt'; }
+details.hct-prompt-details[open] summary::before { content: '▲  prompt'; }
+details.hct-prompt-details summary:hover { opacity: 0.75; }
+.hct-s1 details.hct-prompt-details summary { color: #3a4a80; }
+.hct-s2 details.hct-prompt-details summary { color: #7a4a10; }
+.hct-s3 details.hct-prompt-details summary { color: #b0302a; }
+.hct-prompt-content {
+  margin-top: 7px; background: rgba(0,0,0,0.025);
+  border-radius: 7px; padding: 8px 12px 8px 10px;
+  border-left: 2px solid #ccc; opacity: 0.85;
+}
+.hct-prompt-list {
+  margin: 0; padding: 0 0 0 16px; list-style: disc;
+}
+.hct-prompt-list li {
+  margin-bottom: 5px; color: #445;
+  font-size: 11px; line-height: 1.6;
+}
+.hct-prompt-list li:last-child { margin-bottom: 0; }
+.hct-prompt-list code {
+  font-family: 'DM Mono', monospace; font-size: 10px;
+  background: rgba(0,0,0,0.07); padding: 1px 4px; border-radius: 3px;
+}
 </style>
 """
 
@@ -509,33 +544,36 @@ def _parse_s3(text):
     return pred, conf, (reasoning[:277] + '…' if len(reasoning) > 280 else reasoning)
 
 
-PROMPT_DESCRIPTIONS = {
-    1: (
-        "Given the agent's mobility trajectory data — including visited locations, visit frequencies, "
-        "stay durations, activity types, and temporal patterns — extract objective factual features "
-        "without any interpretation. Identify: (1) location inventory with visit counts and apparent "
-        "price tier; (2) temporal distribution across time-of-day and weekday/weekend; "
-        "(3) spatial activity radius and movement distances; (4) typical activity sequences and "
-        "transition patterns between location types."
-    ),
-    2: (
-        "Based on the trajectory features extracted in Step 1, perform behavioral abstraction across "
-        "four dimensions: (1) Routine & Schedule — infer work schedule type and daily structure; "
-        "(2) Economic Behavior — assess spending tier from venue choices and mobility costs; "
-        "(3) Social & Lifestyle — identify social engagement patterns, leisure activities, and "
-        "community involvement; (4) Routine Stability — evaluate consistency and regularity of "
-        "movement patterns over the observation period."
-    ),
-    3: (
-        "Synthesizing the factual features (Step 1) and behavioral patterns (Step 2), infer the "
-        "agent's household income bracket. Consider location economic indicators, transportation "
-        "mode signals, activity diversity, and lifestyle markers collectively. Output a single "
-        "income range prediction with supporting reasoning grounded in the observed mobility evidence."
-    ),
+PROMPT_BULLETS = {
+    1: [
+        "Extract objective factual features from the agent's mobility trajectory <b>without any interpretation</b>",
+        "Location inventory: list all visited POIs with visit counts and apparent price tier (budget / mid-range / high-end)",
+        "Temporal patterns: time-of-day distribution, weekday vs. weekend split, and regularity of routines",
+        "Spatial characteristics: activity radius, average movement distance between locations",
+        "Sequence observations: common location transitions and typical daily activity chains",
+    ],
+    2: [
+        "Perform behavioral abstraction across four dimensions based on Step 1 features",
+        "Routine &amp; Schedule: infer work schedule type (fixed hours, flexible, shift work, etc.) and daily structure",
+        "Economic Behavior: assess spending tier from venue choices, transportation costs, and lifestyle signals",
+        "Social &amp; Lifestyle: identify social engagement patterns, leisure activities, and community involvement",
+        "Routine Stability: evaluate consistency and regularity of movement patterns over the observation period",
+    ],
+    3: [
+        "Synthesize factual features (Step 1) and behavioral patterns (Step 2) to infer household income bracket",
+        "Score location economic indicators: luxury / mid-range / budget venue distribution",
+        "Consider transportation mode signals, activity diversity, and temporal flexibility as income proxies",
+        "Output: <code>INCOME_PREDICTION</code> — a single income range with confidence rating (1–5)",
+        "Output: <code>INCOME_REASONING</code> — evidence-grounded justification referencing specific mobility observations",
+    ],
 }
 
 def _extract_prompt_instruction(prompt_text, stage):
-    return PROMPT_DESCRIPTIONS.get(stage, '')
+    bullets = PROMPT_BULLETS.get(stage, [])
+    if not bullets:
+        return ''
+    items = ''.join(f'<li>{b}</li>' for b in bullets)
+    return f'<ul class="hct-prompt-list">{items}</ul>'
 
 
 # ── Body renderers ────────────────────────────────────────────────────────────
@@ -629,37 +667,24 @@ def render_chain(s1_text, s2_text, s3_text, status="idle",
     s2_body = _s2_body(s2_text if s2_on else '', s2_on)
     s3_body = _s3_body(s3_text if s3_on else '', s3_on)
 
-    def paper_block(prompt_text, stage_num, response_text, resp_label):
-        def esc(t): return t.replace('&','&amp;').replace('<','&lt;').replace('>','&gt;')
-        # Prompt snippet
-        instr = _extract_prompt_instruction(prompt_text, stage_num)
-        p_short = esc(instr[:220]) + ('……' if len(instr) > 220 else '') if instr else ''
-        # Response snippet
-        r_clean = response_text.strip()
-        r_short = esc(r_clean[:260]) + ('……' if len(r_clean) > 260 else '') if r_clean else ''
-
-        prompt_html = (f'<div class="hct-paper-prompt">'
-                       f'<div class="hct-paper-tag">Prompt {stage_num}</div>'
-                       f'<div class="hct-paper-text">{p_short}</div>'
-                       f'</div>') if p_short else ''
-        connector = '<div class="hct-paper-connector"><div class="hct-paper-connector-line"></div></div>' if (p_short and r_short) else ''
-        response_html = (f'<div class="hct-paper-response">'
-                         f'<div class="hct-paper-tag">{resp_label}</div>'
-                         f'<div class="hct-paper-text">{r_short}</div>'
-                         f'</div>') if r_short else ''
-        if not prompt_html and not response_html:
+    def prompt_pill(stage_num):
+        bullets_html = _extract_prompt_instruction('', stage_num)
+        if not bullets_html:
             return ''
-        return f'<div class="hct-paper-wrap">{prompt_html}{connector}{response_html}</div>'
+        return (f'<details class="hct-prompt-details">'
+                f'<summary></summary>'
+                f'<div class="hct-prompt-content">{bullets_html}</div>'
+                f'</details>')
 
-    def stage(cls, num, title, body, on, prompt_text, stage_num, response_text='', resp_label='Response'):
+    def stage(cls, num, title, body, on, stage_num):
         dim_cls = 'active' if on else 'dim'
-        paper = paper_block(prompt_text, stage_num, response_text, resp_label) if on and (prompt_text or response_text) else ''
+        pill = prompt_pill(stage_num) if on else ''
         return (f'<div class="hct-stage hct-{cls} {dim_cls}">'
                 f'<div class="hct-head">'
                 f'<span class="hct-num">{num}</span>'
                 f'<span class="hct-title">{title}</span>'
                 f'</div>'
-                f'{paper}'
+                f'{pill}'
                 f'<div class="hct-body">{body}</div>'
                 f'</div>')
 
@@ -671,11 +696,11 @@ def render_chain(s1_text, s2_text, s3_text, status="idle",
                 f'<div class="hct-arrow-line"></div></div>')
 
     html  = CHAIN_CSS + '<div class="hct-root">'
-    html += stage('s1', 'Stage 01', 'Feature Extraction',    s1_body, s1_on, s1_prompt, 1, s1_text, 'Response 1')
+    html += stage('s1', 'Stage 01', 'Feature Extraction',    s1_body, s1_on, 1)
     html += arrow('behavioral abstraction', s2_on)
-    html += stage('s2', 'Stage 02', 'Behavioral Analysis',   s2_body, s2_on, s2_prompt, 2, s2_text, 'Response 2')
+    html += stage('s2', 'Stage 02', 'Behavioral Analysis',   s2_body, s2_on, 2)
     html += arrow('demographic inference', s3_on)
-    html += stage('s3', 'Stage 03', 'Demographic Inference', s3_body, s3_on, s3_prompt, 3, s3_text, 'Response 3')
+    html += stage('s3', 'Stage 03', 'Demographic Inference', s3_body, s3_on, 3)
     html += '</div>'
     return html