Fix inference action sanitization and improve mobile responsiveness

- Sanitize LLM action output to strip empty strings and irrelevant fields,
preventing Pydantic 422 validation errors on /step endpoint
- Remove default for HF_TOKEN (per hackathon requirements)
- Improve system prompt for better structured JSON output from LLM
- Add fallback API key support (GROQ_API_KEY, API_KEY)
- Handle 422 errors gracefully in _step() with penalty reward
- Enhance mobile CSS: add 420px breakpoint, fix spotlight guide on mobile,
touch-friendly button sizing, prevent horizontal overflow

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

frontend/src/styles.css

@@ -31,6 +31,8 @@ body {
   line-height: 1.55;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
+  -webkit-tap-highlight-color: transparent;
+  -webkit-text-size-adjust: 100%;
 }
 
 .shell {
@@ -820,6 +822,13 @@ button:disabled {
   box-shadow: none;
 }
 
+/* ── Global mobile overflow prevention ───────────────────────── */
+
+html, body {
+  overflow-x: hidden;
+  width: 100%;
+}
+
 /* ── Responsive ──────────────────────────────────────────────── */
 
 @media (max-width: 1180px) {
@@ -848,13 +857,26 @@ button:disabled {
 
 @media (max-width: 760px) {
   .shell {
-    padding: 12px 12px 24px;
+    padding: 10px 10px 24px;
+  }
+
+  .container {
+    width: 100%;
   }
 
   .topbar,
   .panel {
     border-radius: var(--radius-sm);
-    padding: 16px 18px;
+    padding: 14px 14px;
+  }
+
+  .topbar {
+    gap: 12px;
+  }
+
+  .topbar-right {
+    width: 100%;
+    justify-content: space-between;
   }
 
   .actions {
@@ -864,14 +886,22 @@ button:disabled {
   .actions button,
   .actions select {
     width: 100%;
+    min-height: 46px;
+  }
+
+  .layout {
+    gap: 14px;
+    margin-top: 14px;
   }
 
   .kpi-grid {
     grid-template-columns: 1fr 1fr;
+    gap: 8px;
   }
 
   .med-grid {
     grid-template-columns: 1fr;
+    max-height: none;
   }
 
   .stack-two {
@@ -886,6 +916,13 @@ button:disabled {
     left: 10px !important;
     right: 10px !important;
     max-width: calc(100vw - 20px) !important;
+    top: auto !important;
+    bottom: 20px !important;
+    width: calc(100vw - 20px) !important;
+  }
+
+  .spotlight-ring {
+    display: none;
   }
 
   .guide-footer,
@@ -893,9 +930,221 @@ button:disabled {
     flex-direction: column;
   }
 
+  .spotlight-tooltip-footer button {
+    width: 100%;
+  }
+
+  .app-footer p {
+    font-size: 0.72rem;
+  }
+
   .logs {
     max-height: 200px;
   }
+
+  .logs div {
+    overflow-x: auto;
+    white-space: normal;
+    word-break: break-all;
+  }
+
+  .risk-labels {
+    flex-direction: column;
+    gap: 4px;
+  }
+
+  .conditions-row {
+    gap: 6px;
+  }
+
+  .condition-tag {
+    font-size: 0.7rem;
+    padding: 3px 10px;
+  }
+
+  .budget-note {
+    font-size: 0.82rem;
+    padding: 12px 14px;
+  }
+
+  .history-list {
+    max-height: 240px;
+  }
+
+  .history-item strong {
+    word-break: break-word;
+  }
+
+  .med-card-header {
+    flex-wrap: wrap;
+  }
+
+  .med-details {
+    flex-wrap: wrap;
+  }
+
+  .beers-flags {
+    gap: 4px;
+  }
+
+  .beers-tag {
+    font-size: 0.65rem;
+    padding: 2px 8px;
+  }
+}
+
+/* ── Small phones (≤ 420px) ─────────────────────────────────── */
+
+@media (max-width: 420px) {
+  .shell {
+    padding: 6px 6px 20px;
+  }
+
+  .topbar,
+  .panel {
+    padding: 12px 10px;
+    border-radius: 8px;
+  }
+
+  .title-wrap {
+    min-width: 0;
+  }
+
+  .title-wrap h1 {
+    font-size: 0.95rem;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .title-wrap p {
+    font-size: 0.72rem;
+  }
+
+  .layout {
+    gap: 10px;
+    margin-top: 10px;
+  }
+
+  .kpi-grid {
+    grid-template-columns: 1fr;
+    gap: 6px;
+  }
+
+  .kpi-grid div {
+    padding: 10px 12px;
+  }
+
+  .kpi-grid span {
+    font-size: 0.68rem;
+    margin-bottom: 4px;
+  }
+
+  .kpi-grid strong {
+    font-size: 0.88rem;
+  }
+
+  .med-card {
+    padding: 12px 12px;
+  }
+
+  .med-card-header strong {
+    font-size: 0.84rem;
+  }
+
+  .spotlight-tooltip {
+    padding: 14px;
+    bottom: 10px !important;
+  }
+
+  .spotlight-tooltip-header h3 {
+    font-size: 0.9rem;
+  }
+
+  .spotlight-tooltip-body {
+    font-size: 0.8rem;
+    margin-bottom: 14px;
+    line-height: 1.55;
+  }
+
+  .panel h2 {
+    font-size: 0.75rem;
+    margin-bottom: 10px;
+  }
+
+  .panel h3 {
+    font-size: 0.72rem;
+  }
+
+  .submit-btn {
+    min-height: 48px;
+    font-size: 0.88rem;
+  }
+
+  .logs {
+    max-height: 160px;
+    font-size: 0.75rem;
+    gap: 6px;
+  }
+
+  .logs div {
+    padding: 8px 10px;
+    line-height: 1.4;
+  }
+
+  .history-item {
+    padding: 10px 12px;
+  }
+
+  .history-item strong {
+    font-size: 0.82rem;
+  }
+
+  .history-detail {
+    font-size: 0.78rem;
+  }
+
+  .severity-tag, .intervention-tag {
+    font-size: 0.65rem;
+    padding: 2px 8px;
+  }
+
+  button, select, input {
+    font-size: 0.85rem;
+    min-height: 46px;
+    padding: 10px 12px;
+  }
+
+  .action-row label,
+  .field-group label {
+    font-size: 0.72rem;
+  }
+
+  .status-chip {
+    font-size: 0.65rem;
+    padding: 4px 10px;
+  }
+
+  .guide-trigger {
+    width: 30px !important;
+    height: 30px;
+    min-height: 30px;
+    font-size: 0.85rem;
+  }
+
+  .guide-counter {
+    font-size: 0.68rem;
+    padding: 3px 8px;
+  }
+
+  .app-footer {
+    margin-top: 16px;
+  }
+
+  .app-footer p {
+    font-size: 0.68rem;
+    line-height: 1.4;
+  }
 }
 
 /* ── Scrollbar ────��──────────────────────────────────────────── */

inference.py

@@ -17,12 +17,20 @@ import os
 import re
 from typing import Any, Dict, List
 
+try:
+    from dotenv import load_dotenv
+    load_dotenv()
+except ImportError:
+    pass
+
 import requests
 from openai import OpenAI
 
-API_BASE_URL = os.getenv("API_BASE_URL", "https://router.huggingface.co/v1")
-MODEL_NAME = os.getenv("MODEL_NAME", "Qwen/Qwen2.5-72B-Instruct")
-HF_TOKEN = os.getenv("HF_TOKEN", "")
+API_BASE_URL = os.getenv("API_BASE_URL", "https://api.groq.com/openai/v1")
+MODEL_NAME = os.getenv("MODEL_NAME", "llama-3.3-70b-versatile")
+HF_TOKEN = os.getenv("HF_TOKEN")
+# Also accept GROQ_API_KEY or API_KEY as fallback for the token
+_API_KEY = HF_TOKEN or os.getenv("GROQ_API_KEY") or os.getenv("API_KEY")
 ENV_URL = os.getenv("POLYPHARMACY_ENV_URL", "http://localhost:7860").rstrip("/")
 
 BENCHMARK = "polypharmacy_env"
@@ -31,14 +39,23 @@ MAX_STEPS = 16
 TEMPERATURE = 0.0
 MAX_TOKENS = 220
 
+VALID_ACTION_TYPES = {"query_ddi", "propose_intervention", "finish_review"}
+VALID_INTERVENTIONS = {"stop", "dose_reduce", "substitute", "add_monitoring"}
+
 SYSTEM_PROMPT = (
-    "You are a clinical-pharmacist agent. "
-    "Return one JSON action only with keys matching this schema: "
-    '{"action_type":"query_ddi|propose_intervention|finish_review",'
-    '"drug_id_1":"", "drug_id_2":"", "target_drug_id":"",'
+    "You are a clinical-pharmacist agent reviewing an elderly patient's medications. "
+    "You MUST return ONLY a single JSON object (no markdown, no explanation). "
+    "The action_type MUST be exactly one of: query_ddi, propose_intervention, finish_review. "
+    "Schema for query_ddi: "
+    '{"action_type":"query_ddi","drug_id_1":"DRUG_X","drug_id_2":"DRUG_Y"} '
+    "Schema for propose_intervention: "
+    '{"action_type":"propose_intervention","target_drug_id":"DRUG_X",'
     '"intervention_type":"stop|dose_reduce|substitute|add_monitoring",'
-    '"proposed_new_drug_id":"", "rationale":""}. '
-    "Prefer safe, high-impact actions and finish when useful actions are exhausted."
+    '"rationale":"reason"} '
+    "Schema for finish_review: "
+    '{"action_type":"finish_review"} '
+    "Strategy: First query_ddi for high-risk drug pairs (especially those with beers_flags). "
+    "Then propose_intervention for dangerous findings. Finally finish_review."
 )
 
 
@@ -83,12 +100,43 @@ def _safe_json(text: str) -> Dict[str, Any]:
     try:
         data = json.loads(text)
         if isinstance(data, dict):
-            return data
+            return _sanitize_action(data)
     except Exception:
         pass
     return {"action_type": "finish_review"}
 
 
+def _sanitize_action(raw: Dict[str, Any]) -> Dict[str, Any]:
+    """Build a clean action dict with only the fields relevant to the action type."""
+    atype = raw.get("action_type", "")
+    if atype not in VALID_ACTION_TYPES:
+        return {"action_type": "finish_review"}
+
+    if atype == "query_ddi":
+        return {
+            "action_type": "query_ddi",
+            "drug_id_1": raw.get("drug_id_1") or None,
+            "drug_id_2": raw.get("drug_id_2") or None,
+        }
+    if atype == "propose_intervention":
+        it = raw.get("intervention_type", "")
+        if it not in VALID_INTERVENTIONS:
+            it = "add_monitoring"
+        result: Dict[str, Any] = {
+            "action_type": "propose_intervention",
+            "target_drug_id": raw.get("target_drug_id") or None,
+            "intervention_type": it,
+        }
+        new_drug = raw.get("proposed_new_drug_id") or None
+        if new_drug:
+            result["proposed_new_drug_id"] = new_drug
+        rationale = raw.get("rationale") or None
+        if rationale:
+            result["rationale"] = rationale
+        return result
+    return {"action_type": "finish_review"}
+
+
 def _llm_action(client: OpenAI, obs: Dict[str, Any]) -> Dict[str, Any]:
     meds = obs.get("current_medications", [])
     summary = {
@@ -129,6 +177,9 @@ def _reset(task_id: str) -> Dict[str, Any]:
 
 def _step(action: Dict[str, Any]) -> Dict[str, Any]:
     r = requests.post(f"{ENV_URL}/step", json={"action": action}, timeout=45)
+    if r.status_code == 422:
+        # Invalid action — return a penalty and let the agent continue
+        return {"observation": {}, "reward": -0.1, "done": False, "info": {"error": r.text[:200]}}
     r.raise_for_status()
     return r.json()
 
@@ -168,17 +219,16 @@ def run_task(client: OpenAI, task_id: str) -> None:
                 success = score > 0.0
                 break
     except Exception:
-        # Still emit END to keep evaluator parser stable.
         success = False
     finally:
         log_end(success=success, steps=steps, score=score, rewards=rewards)
 
 
 def main() -> int:
-    if not HF_TOKEN:
-        print("HF_TOKEN is required", flush=True)
+    if not _API_KEY:
+        print("HF_TOKEN (or GROQ_API_KEY / API_KEY) is required", flush=True)
         return 1
-    client = OpenAI(base_url=API_BASE_URL, api_key=HF_TOKEN)
+    client = OpenAI(base_url=API_BASE_URL, api_key=_API_KEY)
     for task in TASKS:
         run_task(client, task)
     return 0