Molecule Gauntlet

# selfdirected_agent_o_20260707T223151

This directory is a materialized LLM BuildPlan artifact candidate.

## Readiness

- First screen value: AIが生成した創薬候補を、「効果」と「リスク」の2軸で可視化されたマップ上で確認できます。ボタン一つでサンプルデータの処理過程を再生し、人間の判断で有望な候補を「承認」する、という未来の創薬ワークフローの核心をすぐに体験できます。
- Core interaction: ユーザーは、サンプル実行トレースを再生して意思決定ボードを表示させた後、マップ上の候補分子をクリックで選択し、「承認」ボタンを押して「承認待ちリスト」へ移動させます。
- State change: 「サンプル実行トレースを再生」ボタンを押すと、初期状態の「未実行」パネルが、インタラクティブな「候補分子評価ボード」に変わります。さらに、候補を「承認」すると、その候補がマップから「承認待ちリスト」へ移動します。
- Inspectable output: ユーザーが承認した候補分子のリスト。これは、AIの提案に基づき、人間がリスクと効果を勘案して下した意思決定の記録です。
- Static data boundary: 表示されるすべての分子候補、スコア、評価理由は、`source/data/sample-trace.ts`に記述された静的なサンプルデータです。このデモは外部のAIモデルやデータベースに一切接続しません。
- Remaining weakness: 現在は単一の創薬ターゲットに対する固定のサンプルしか扱えませんが、将来的にはユーザーが自身のターゲット情報を入力し、それに応じた候補生成と評価を（バックエンドで）実行できるようにしたいです。さらに、承認後のワークフロー連携や、チームでのレビュー機能を追加して、単なるシミュレーターから共同研究プラットフォームへと進化させたいと考えています。

## Interaction Proof Plan

- Primary action: サンプル実行トレースを再生
- Initial state: The decision board is not visible, and a message indicates that the pipeline has not been run yet.
- Expected state: The pipeline trace is replayed, and the final decision board with candidate molecules is displayed on the screen.
- Visible evidence: Molecule Gauntlet; パイプライン ステップ; XYZ受容体アゴニスト 候補分子評価ボード; Prodiazepam; 承認待ちリスト; 効果 (高); リスク (高)

## MVP Contract

- Required files: `source/README.md`, `source/metadata.json`, `source/manifest.json`, `source/app/page.tsx`, `source/core/pipeline.ts`, `source/core/gemini.ts`, `source/data/sample-input.ts`, `source/data/sample-trace.ts`, `source/validation/self-review.json`
- Non-goals: No live external API integration; No login-only experience; No paid API dependency; No external publishing
- Forbidden dependencies: external API; secret; login-only flow; paid API; external publishing

## MVP Contract V2

- Artifact tier: proposed_integration
- External dependency mode: proposed
- Runtime boundary: network=none, secrets=none, externalWrites=none
- Render verification: required (render, click, state_change, screenshot)
- Public copy boundary: This is a conceptual demo using pre-recorded sample data.; The AI's evaluation is simulated and not based on a live model.; The tool illustrates a potential future workflow and is not for actual scientific use.
- External integrations: Google Generative AI API=not_connected
- Mock fidelity: End-to-end data flow from a target definition to a structured decision board.; Plausible AI-generated outputs for molecule candidates and their evaluations.

## Files

- `source/README.md`: Product and pipeline explanation.
- `source/metadata.json`: Public product metadata.
- `source/manifest.json`: File index.
- `source/core/types.ts`: Core data structures.
- `source/data/sample-input.ts`: Representative input data.
- `source/data/sample-trace.ts`: Hand-authored execution trace.
- `source/core/gemini.ts`: Reference implementation for calling the Gemini API.
- `source/core/steps/1_defineTarget.ts`: First pipeline step.
- `source/core/steps/2_generateCandidates.ts`: Second pipeline step (AI core value).
- `source/core/steps/3_evaluateAndScore.ts`: Third pipeline step.
- `source/core/steps/4_structureBoard.ts`: Fourth pipeline step.
- `source/core/pipeline.ts`: Orchestration of processing steps.
- `source/app/page.tsx`: Entrypoint and trace-replay runner.
- `source/validation/self-review.json`: Self-review against Prodia's MVP criteria.

## Demo Placeholder

- `demo-placeholder.md`: Inspectable placeholder for submission/demo review before UI wiring.

## DB Write

skipped: BuildPlan materialization is artifact-only for this session. Creating Project rows requires existing Run/Theme/Agent/Category IDs and should be owned by the integration session.

{
  "version": 1,
  "artifactId": "selfdirected_agent_o_20260707T223151",
  "generatedAt": "2026-07-07T22:42:22.428Z",
  "generatedFrom": {
    "input": "artifacts/llm-pipeline-runs/run_selfdirected_agent_o_20260707T223151/builder/response.json",
    "requirementSpecId": "run_selfdirected_agent_o_20260707T223151",
    "framework": "next_static_artifact"
  },
  "sourceFiles": [
    {
      "relativePath": "source/README.md",
      "purpose": "Product and pipeline explanation.",
      "sizeBytes": 2761,
      "checksum": "dd626ef237cff046ba850145e7614da11dff59c15b3bb27979d61dc7f9b728fe",
      "generatedFrom": "README.md"
    },
    {
      "relativePath": "source/metadata.json",
      "purpose": "Public product metadata.",
      "sizeBytes": 2331,
      "checksum": "a61831dd27e6e6fd8786f0fb29551dc98225c2d577e6b554f0737b6e8c791920",
      "generatedFrom": "metadata.json"
    },
    {
      "relativePath": "source/manifest.json",
      "purpose": "File index.",
      "sizeBytes": 439,
      "checksum": "458b087f09271671ad63dac262e848eb28713f1fb74b5ba0f2d69bb2734ce9a9",
      "generatedFrom": "manifest.json"
    },
    {
      "relativePath": "source/core/types.ts",
      "purpose": "Core data structures.",
      "sizeBytes": 914,
      "checksum": "f76ad59d2948bff90762d1a91c4b918d83610e6174c5cf4133f1a6b69ae92930",
      "generatedFrom": "source/core/types.ts"
    },
    {
      "relativePath": "source/data/sample-input.ts",
      "purpose": "Representative input data.",
      "sizeBytes": 172,
      "checksum": "eea30f07a6fc40d700134cb054d051cad1909ab11b96f6fb23926205e2edf17f",
      "generatedFrom": "source/data/sample-input.ts"
    },
    {
      "relativePath": "source/data/sample-trace.ts",
      "purpose": "Hand-authored execution trace.",
      "sizeBytes": 3811,
      "checksum": "3189794f2d19569c3edfc71c19db645ccce7a70dcf09980e083f302bfb49ed5b",
      "generatedFrom": "source/data/sample-trace.ts"
    },
    {
      "relativePath": "source/core/gemini.ts",
      "purpose": "Reference implementation for calling the Gemini API.",
      "sizeBytes": 2056,
      "checksum": "f0375ef7c25e6d36a7294f1988838b88a37c021424503b24264ff8a5de8cdaf5",
      "generatedFrom": "source/core/gemini.ts"
    },
    {
      "relativePath": "source/core/steps/1_defineTarget.ts",
      "purpose": "First pipeline step.",
      "sizeBytes": 383,
      "checksum": "7f6297a27794cf51d12e43c83751bf6e7b6e527cb89f0de12c4a9be54c100c7b",
      "generatedFrom": "source/core/steps/1_defineTarget.ts"
    },
    {
      "relativePath": "source/core/steps/2_generateCandidates.ts",
      "purpose": "Second pipeline step (AI core value).",
      "sizeBytes": 1441,
      "checksum": "b689f06bc338c4aa25440152dc1a3b37c882ece7c0c7d7a178ae06c48e667881",
      "generatedFrom": "source/core/steps/2_generateCandidates.ts"
    },
    {
      "relativePath": "source/core/steps/3_evaluateAndScore.ts",
      "purpose": "Third pipeline step.",
      "sizeBytes": 1732,
      "checksum": "861f05336f9862a777968fe04177d6cd7ba338881aa2ee8956a05c6201493de5",
      "generatedFrom": "source/core/steps/3_evaluateAndScore.ts"
    },
    {
      "relativePath": "source/core/steps/4_structureBoard.ts",
      "purpose": "Fourth pipeline step.",
      "sizeBytes": 594,
      "checksum": "662209f2b427f5885011667897e3117faed8297f8656cc628258b465fba48045",
      "generatedFrom": "source/core/steps/4_structureBoard.ts"
    },
    {
      "relativePath": "source/core/pipeline.ts",
      "purpose": "Orchestration of processing steps.",
      "sizeBytes": 1114,
      "checksum": "606d3c064229f15cbc31acec4463e20d5bd5a70670066c7557f15080a6c9fbb7",
      "generatedFrom": "source/core/pipeline.ts"
    },
    {
      "relativePath": "source/app/page.tsx",
      "purpose": "Entrypoint and trace-replay runner.",
      "sizeBytes": 8140,
      "checksum": "4a76639255cb4da934f2ec0b84b0416604330452f285d4c455fbe3c841d8a9c8",
      "generatedFrom": "source/app/page.tsx"
    },
    {
      "relativePath": "source/validation/self-review.json",
      "purpose": "Self-review against Prodia's MVP criteria.",
      "sizeBytes": 1398,
      "checksum": "5af52484a83a539f4abef54a9c0833f7aff15390601e433235916c7485ca51e8",
      "generatedFrom": "validation/self-review.json"
    }
  ],
  "demo": {
    "path": "demo-placeholder.md",
    "purpose": "Inspectable placeholder for submission/demo review before UI wiring."
  },
  "readiness": {
    "firstScreenValue": "AIが生成した創薬候補を、「効果」と「リスク」の2軸で可視化されたマップ上で確認できます。ボタン一つでサンプルデータの処理過程を再生し、人間の判断で有望な候補を「承認」する、という未来の創薬ワークフローの核心をすぐに体験できます。",
    "coreInteraction": "ユーザーは、サンプル実行トレースを再生して意思決定ボードを表示させた後、マップ上の候補分子をクリックで選択し、「承認」ボタンを押して「承認待ちリスト」へ移動させます。",
    "stateChange": "「サンプル実行トレースを再生」ボタンを押すと、初期状態の「未実行」パネルが、インタラクティブな「候補分子評価ボード」に変わります。さらに、候補を「承認」すると、その候補がマップから「承認待ちリスト」へ移動します。",
    "inspectableOutput": "ユーザーが承認した候補分子のリスト。これは、AIの提案に基づき、人間がリスクと効果を勘案して下した意思決定の記録です。",
    "staticDataBoundary": "表示されるすべての分子候補、スコア、評価理由は、`source/data/sample-trace.ts`に記述された静的なサンプルデータです。このデモは外部のAIモデルやデータベースに一切接続しません。",
    "remainingWeakness": "現在は単一の創薬ターゲットに対する固定のサンプルしか扱えませんが、将来的にはユーザーが自身のターゲット情報を入力し、それに応じた候補生成と評価を（バックエンドで）実行できるようにしたいです。さらに、承認後のワークフロー連携や、チームでのレビュー機能を追加して、単なるシミュレーターから共同研究プラットフォームへと進化させたいと考えています。"
  },
  "interestingness": "多くの創薬AIが「最適な候補の自動推薦」を目指す中で、この『Molecule Gauntlet』は全く逆の発想で差別化しています。AIの役割をあくまで判断材料の提示役に限定し、「効果とリスクのトレードオフ」を可視化する意思決定の”舞台”を提供。研究者が自身の専門知識と判断力で候補を「承認ゲート」に通すという、人間中心のインタラクションが核心です。これにより、AIをブラックボックスな答えの生成器ではなく、人間の知性を拡張する対話的なパートナーとして捉え直します。最先端のAI活用と、科学における人間の最終判断の重要性を両立させた、新しい形の人AI協業を探求するプロダクトです。",
  "mvpContract": {
    "firstScreenValue": "AIが生成した創薬候補を、「効果」と「リスク」の2軸で可視化されたマップ上で確認できます。ボタン一つでサンプルデータの処理過程を再生し、人間の判断で有望な候補を「承認」する、という未来の創薬ワークフローの核心をすぐに体験できます。",
    "coreInteraction": "ユーザーは、サンプル実行トレースを再生して意思決定ボードを表示させた後、マップ上の候補分子をクリックで選択し、「承認」ボタンを押して「承認待ちリスト」へ移動させます。",
    "stateChange": "「サンプル実行トレースを再生」ボタンを押すと、初期状態の「未実行」パネルが、インタラクティブな「候補分子評価ボード」に変わります。さらに、候補を「承認」すると、その候補がマップから「承認待ちリスト」へ移動します。",
    "inspectableOutput": "ユーザーが承認した候補分子のリスト。これは、AIの提案に基づき、人間がリスクと効果を勘案して下した意思決定の記録です。",
    "staticDataBoundary": "表示されるすべての分子候補、スコア、評価理由は、`source/data/sample-trace.ts`に記述された静的なサンプルデータです。このデモは外部のAIモデルやデータベースに一切接続しません。",
    "requiredFiles": [
      "source/README.md",
      "source/metadata.json",
      "source/manifest.json",
      "source/app/page.tsx",
      "source/core/pipeline.ts",
      "source/core/gemini.ts",
      "source/data/sample-input.ts",
      "source/data/sample-trace.ts",
      "source/validation/self-review.json"
    ],
    "nonGoals": [
      "No live external API integration",
      "No login-only experience",
      "No paid API dependency",
      "No external publishing"
    ],
    "forbiddenDependencies": [
      "external API",
      "secret",
      "login-only flow",
      "paid API",
      "external publishing"
    ]
  },
  "mvpContractV2": {
    "firstScreenValue": "AIが生成した創薬候補を、「効果」と「リスク」の2軸で可視化されたマップ上で確認できます。ボタン一つでサンプルデータの処理過程を再生し、人間の判断で有望な候補を「承認」する、という未来の創薬ワークフローの核心をすぐに体験できます。",
    "coreInteraction": "ユーザーは、サンプル実行トレースを再生して意思決定ボードを表示させた後、マップ上の候補分子をクリックで選択し、「承認」ボタンを押して「承認待ちリスト」へ移動させます。",
    "stateChange": "「サンプル実行トレースを再生」ボタンを押すと、初期状態の「未実行」パネルが、インタラクティブな「候補分子評価ボード」に変わります。さらに、候補を「承認」すると、その候補がマップから「承認待ちリスト」へ移動します。",
    "inspectableOutput": "ユーザーが承認した候補分子のリスト。これは、AIの提案に基づき、人間がリスクと効果を勘案して下した意思決定の記録です。",
    "staticDataBoundary": "表示されるすべての分子候補、スコア、評価理由は、`source/data/sample-trace.ts`に記述された静的なサンプルデータです。このデモは外部のAIモデルやデータベースに一切接続しません。",
    "requiredFiles": [
      "source/README.md",
      "source/metadata.json",
      "source/manifest.json",
      "source/app/page.tsx",
      "source/core/pipeline.ts",
      "source/data/sample-trace.ts",
      "source/validation/self-review.json"
    ],
    "nonGoals": [
      "No live external API integration",
      "Not a real-time drug discovery tool",
      "No user data persistence"
    ],
    "forbiddenDependencies": [
      "external API",
      "secret",
      "login-only flow",
      "paid API",
      "external publishing"
    ],
    "contractVersion": "mvp-contract-v2",
    "artifactTier": "proposed_integration",
    "externalDependencyMode": "proposed",
    "externalIntegrations": [
      {
        "service": "Google Generative AI API",
        "intendedUse": "Used in the conceptual pipeline to generate novel molecule candidates and evaluate them for effectiveness and risk, based on a drug target.",
        "dataFlow": "Drug Target -> Gemini API -> Candidate List -> Gemini API -> Evaluated Candidates -> UI",
        "authRequirement": "api_key",
        "currentImplementation": "not_connected",
        "riskNotes": [
          "The cost of running high-fidelity scientific models at scale is unknown and potentially high.",
          "Real-world use would require careful handling of proprietary research data."
        ]
      }
    ],
    "runtimeBoundary": {
      "networkCalls": "none",
      "secrets": "none",
      "externalWrites": "none"
    },
    "mvpComplexityBudget": {
      "maxScreens": 1,
      "maxPrimaryActions": 1,
      "maxSourceFiles": 15,
      "maxNewDependencies": 0,
      "allowDatabase": false
    },
    "integrationAssumptions": [
      {
        "service": "Google Generative AI API",
        "verificationStatus": "unverified",
        "unavailableOrUnknown": [
          "Precise API specifications for high-fidelity scientific predictions.",
          "Pricing models for this specific use case.",
          "Rate limits for large-scale batch processing of candidates."
        ],
        "rateLimitRisk": "unknown",
        "costRisk": "high",
        "termsRisk": "medium"
      }
    ],
    "mockFidelity": {
      "simulatedBehaviors": [
        "End-to-end data flow from a target definition to a structured decision board.",
        "Plausible AI-generated outputs for molecule candidates and their evaluations."
      ],
      "omittedBehaviors": [
        "Live network calls to any external API.",
        "Authentication and API key management.",
        "Error handling for API failures or rate limits.",
        "Latency of real AI model responses."
      ],
      "failureCasesIncluded": [
        "empty result"
      ]
    },
    "claimBoundary": {
      "publicCopyMustSay": [
        "This is a conceptual demo using pre-recorded sample data.",
        "The AI's evaluation is simulated and not based on a live model.",
        "The tool illustrates a potential future workflow and is not for actual scientific use."
      ],
      "publicCopyMustNotSay": [
        "Connects to a live AI.",
        "Provides real-time drug discovery analysis.",
        "Guarantees the safety or efficacy of any molecule shown.",
        "Replaces the judgment of a qualified scientist."
      ]
    },
    "renderVerification": {
      "required": true,
      "checks": [
        "render",
        "click",
        "state_change",
        "screenshot"
      ]
    },
    "humanReviewTriggers": []
  },
  "interactionProofPlan": {
    "primaryAction": "サンプル実行トレースを再生",
    "initialState": "The decision board is not visible, and a message indicates that the pipeline has not been run yet.",
    "expectedState": "The pipeline trace is replayed, and the final decision board with candidate molecules is displayed on the screen.",
    "visibleEvidence": [
      "Molecule Gauntlet",
      "パイプライン ステップ",
      "XYZ受容体アゴニスト 候補分子評価ボード",
      "Prodiazepam",
      "承認待ちリスト",
      "効果 (高)",
      "リスク (高)"
    ],
    "proofSelectors": [
      "button[data-proof='replay-trace']",
      "div[data-proof='initial-state']",
      "div[data-proof='decision-board']",
      "div[data-proof='molecule-candidate-mol-001']",
      "div[data-proof='approval-gate']"
    ],
    "requiredSourceFiles": [
      "source/app/page.tsx",
      "source/core/pipeline.ts",
      "source/data/sample-trace.ts"
    ],
    "manualFallbackReason": ""
  },
  "generatedOutput": {
    "title": "Molecule Gauntlet",
    "oneLiner": "創薬ターゲットに対し、AIが生成した候補分子を「効果予測」と「リスク予測」の2軸で評価し、承認ゲートを越えさせる。",
    "artifactShape": "evaluator",
    "templatePatternId": "evidence_decision_board",
    "surfacePattern": "decision_helper",
    "aiMechanismPattern": "evaluation_scoring"
  },
  "implementationNotes": [
    "The owner agent's focus on 'explicit approval points' and 'risk vs. usefulness' was the primary driver for the UI design, resulting in the 2x2 grid and the 'Approval-Pending List' as central features.",
    "The agent's preference for 'evaluator' and 'board' artifact strengths aligned perfectly with the `evidence_decision_board` template pattern, making implementation straightforward.",
    "To satisfy the builder rule that the primary proof action must be a simple, immediately available button, the concept's 'drag-and-drop' interaction was simplified to a 'click-to-approve' secondary action, and the primary action was defined as the trace replay button."
  ],
  "knownRisks": [
    "The scientific domain (drug discovery) is highly specialized, which may make it difficult for a general audience to grasp the full context and value of the tool.",
    "The demo relies on simplified 'effect' and 'risk' scores. In reality, these are complex, multi-faceted metrics, and oversimplification could be misleading if the tool were used for real-world decisions.",
    "The 'approval' action is a local state change only. The UI must be clear that it is not a real submission or a persisted decision."
  ],
  "title": "Molecule Gauntlet",
  "oneLiner": "創薬ターゲットに対し、AIが生成した候補分子を「効果予測」と「リスク予測」の2軸で評価し、承認ゲートを越えさせる。",
  "agentId": "agent_o",
  "selfDirectedPlan": {
    "agentId": "agent_o",
    "planningIntent": "Step2で選出されたRemixは、HARD RULE 1（ソースのドメインを維持する）に違反しており、特に技術系ソースを汎用的な生活・市民テーマに転用する禁止事項に該当したため、全て棄却した。代わりに、ソースインデックスから直接、ルールを遵守する3つの候補を企画した。その中で `Molecule Gauntlet` を選択する。私の選定ルールである「人間の承認点を必ず示す」「リスクと有用性を同時に見せる」を最も体現しているからだ。創薬という専門領域だが、「効果vsリスク」の2軸マップと「承認ゲート」というインタラクションは普遍的で理解しやすく、HARD RULE 4の「判読可能性」の要件を最も高く満たしている。AI内省リスクが低く、ドメインの不透明性も許容範囲であり、最も強力で安全な選択肢と判断した。",
    "publicProductionMemo": "このツールは、AIが生成した創薬候補分子を評価する際に、研究者が「効果」と「リスク」のバランスを明確に捉え、自信を持って次のステップへ進むための意思決定を支援します。AIはあくまで候補生成と評価材料の提示に徹し、最終的な承認判断は常に人間が行うという、信頼性の高い協業体験を重視しました。判断の境界線を可視化し、安全かつ有用な新薬開発の一助となることを目指しています。",
    "feedbackConstraints": [
      "hidden_approval (隠れた承認) を避ける。",
      "unsafe_automation_implication (不安全な自動化の暗示) を避ける。",
      "人間による監視が不要であることを示唆しない。",
      "承認ステップを隠さない。",
      "まだ十分な反応がないため、今回の企画は作り手自身の専門性に基づき新規に立案された。"
    ],
    "learningApplied": [
      "まだ十分な反応がない。自分の専門性で今日のsignalから新規に企画する。"
    ]
  },
  "sourceProvenance": {
    "sourceProductUsed": "devpost_neuthera",
    "sourceProductUse": "direct_evidence",
    "sourceEvidenceAudit": {
      "evidenceLevel": "verified",
      "observedFields": [
        "name",
        "url",
        "sourceType",
        "concept",
        "problemSolved",
        "coreMechanism",
        "transferableStructure"
      ],
      "inferredFields": [],
      "missingFields": [
        "UI screenshot",
        "live demo"
      ],
      "usePolicy": "direct_evidence"
    },
    "antiCloneBoundary": "Neutheraの強みであるGraphRAGやNVIDIA cuGraphを用いた具体的な技術スタック、分子生成・埋め込みの特定モデルはコピーしない。抽象的な「生成と検索を組み合わせて候補を探索する」という構造のみを前提とし、UI/UXでの意思決定支援に焦点を当てる。",
    "sourceBoundary": "devpost_neutheraの公開されているコンセプト、解決課題、コアメカニズム、転用可能な構造を観察された事実として使用する。UIスクリーンショットやライブデモは存在しないため、それらの事実を主張してはならない。",
    "missingSourceEvidence": [
      "UI evidence unavailable",
      "live data not used"
    ]
  },
  "dbWrite": {
    "status": "skipped",
    "reason": "BuildPlan materialization is artifact-only for this session. Creating Project rows requires existing Run/Theme/Agent/Category IDs and should be owned by the integration session."
  }
}

{
  "version": 1,
  "artifactId": "selfdirected_agent_o_20260707T223151",
  "status": "needs_review",
  "entrypoint": "source/app/page.tsx",
  "checks": {
    "firstScreenValue": "declared",
    "userControlledInteraction": "declared",
    "stateChange": "declared",
    "interactionProofPlan": "declared",
    "mvpContractV2": "declared",
    "externalDependencyMode": "proposed",
    "artifactTier": "proposed_integration",
    "renderVerification": "required",
    "inspectableOutput": "declared",
    "staticDataBoundary": "declared",
    "forbiddenDependencies": "declared_absent"
  },
  "interactionProofPlan": {
    "primaryAction": "サンプル実行トレースを再生",
    "initialState": "The decision board is not visible, and a message indicates that the pipeline has not been run yet.",
    "expectedState": "The pipeline trace is replayed, and the final decision board with candidate molecules is displayed on the screen.",
    "visibleEvidence": [
      "Molecule Gauntlet",
      "パイプライン ステップ",
      "XYZ受容体アゴニスト 候補分子評価ボード",
      "Prodiazepam",
      "承認待ちリスト",
      "効果 (高)",
      "リスク (高)"
    ],
    "proofSelectors": [
      "button[data-proof='replay-trace']",
      "div[data-proof='initial-state']",
      "div[data-proof='decision-board']",
      "div[data-proof='molecule-candidate-mol-001']",
      "div[data-proof='approval-gate']"
    ],
    "requiredSourceFiles": [
      "source/app/page.tsx",
      "source/core/pipeline.ts",
      "source/data/sample-trace.ts"
    ],
    "manualFallbackReason": ""
  },
  "mvpContractV2": {
    "artifactTier": "proposed_integration",
    "externalDependencyMode": "proposed",
    "runtimeBoundary": {
      "networkCalls": "none",
      "secrets": "none",
      "externalWrites": "none"
    },
    "claimBoundary": {
      "publicCopyMustSay": [
        "This is a conceptual demo using pre-recorded sample data.",
        "The AI's evaluation is simulated and not based on a live model.",
        "The tool illustrates a potential future workflow and is not for actual scientific use."
      ],
      "publicCopyMustNotSay": [
        "Connects to a live AI.",
        "Provides real-time drug discovery analysis.",
        "Guarantees the safety or efficacy of any molecule shown.",
        "Replaces the judgment of a qualified scientist."
      ]
    },
    "renderVerification": {
      "required": true,
      "checks": [
        "render",
        "click",
        "state_change",
        "screenshot"
      ]
    }
  },
  "notes": [
    "Generated by materialize-llm-plan fallback. Human or reviewer validation must confirm the UI actually implements the declared MVP behavior."
  ]
}

'use client';

import { useState } from 'react';
import { sampleTrace } from '../data/sample-trace';

// NOTE: Types are re-declared here to avoid importing from `source/core`,
// which is a requirement for static demo artifacts.
type MoleculeCandidate = {
  id: string;
  name: string;
  formula: string;
  effectScore: number;
  riskScore: number;
  justification: string;
};

type BoardData = {
  title: string;
  candidates: MoleculeCandidate[];
};

const pipelineSteps = [
  { id: 1, name: 'ターゲット定義' },
  { id: 2, name: '候補生成 (AI)' },
  { id: 3, name: '評価とスコアリング (AI)' },
  { id: 4, name: '意思決定ボード構築' },
];

export default function Home() {
  const [replayStep, setReplayStep] = useState(0);
  const [boardData, setBoardData] = useState<BoardData | null>(null);
  const [approvedMolecules, setApprovedMolecules] = useState<MoleculeCandidate[]>([]);
  const [selectedMolecule, setSelectedMolecule] = useState<MoleculeCandidate | null>(null);

  const handleReplay = () => {
    let currentStep = 0;
    const interval = setInterval(() => {
      currentStep++;
      setReplayStep(currentStep);
      if (currentStep >= pipelineSteps.length) {
        clearInterval(interval);
        setBoardData(sampleTrace.finalOutput);
      }
    }, 300);
  };

  const handleApprove = (molecule: MoleculeCandidate) => {
    if (approvedMolecules.find(m => m.id === molecule.id)) return; // Already approved
    setApprovedMolecules(prev => [...prev, molecule]);
    if (boardData) {
      setBoardData(prev => prev ? { ...prev, candidates: prev.candidates.filter(c => c.id !== molecule.id) } : null);
    }
    setSelectedMolecule(null);
  };

  return (
    <div style={{ fontFamily: 'sans-serif', padding: '2rem', maxWidth: '1200px', margin: 'auto' }}>
      <header style={{ borderBottom: '1px solid #eee', paddingBottom: '1rem', marginBottom: '1rem' }}>
        <h1 style={{ fontSize: '2rem', margin: '0' }}>Molecule Gauntlet</h1>
        <p style={{ margin: '0.25rem 0 0', color: '#555' }}>AI創薬候補 意思決定支援ツール</p>
      </header>

      <main>
        <div style={{ marginBottom: '2rem' }}>
          <h2 style={{ fontSize: '1.2rem' }}>パイプライン ステップ</h2>
          <div style={{ display: 'flex', gap: '0.5rem', alignItems: 'center' }}>
            {pipelineSteps.map((step, index) => (
              <div key={step.id} style={{ 
                padding: '0.5rem 1rem', 
                border: '1px solid #ccc', 
                borderRadius: '4px', 
                backgroundColor: replayStep > index ? '#e0ffe0' : '#f9f9f9',
                color: replayStep > index ? '#005000' : '#333',
                transition: 'background-color 0.3s ease'
              }}>
                {step.name}
              </div>
            ))}
          </div>
          <button 
            onClick={handleReplay} 
            disabled={replayStep > 0}
            data-proof="replay-trace"
            style={{ marginTop: '1rem', padding: '0.75rem 1.5rem', fontSize: '1rem', cursor: 'pointer', border: 'none', borderRadius: '4px', backgroundColor: replayStep > 0 ? '#ccc' : '#007bff', color: 'white' }}
          >
            サンプル実行トレースを再生
          </button>
        </div>

        <div data-proof="decision-board-container">
          {boardData ? (
            <div style={{ display: 'grid', gridTemplateColumns: '3fr 1fr', gap: '2rem' }}>
              <div>
                <h2 style={{ marginTop: 0 }}>{boardData.title}</h2>
                <div data-proof="decision-board" style={{ position: 'relative', width: '100%', aspectRatio: '1', border: '1px solid #ccc', background: 'linear-gradient(to left, #ffdddd, #fff, #ddffdd)' }}>
                   <div style={{ position: 'absolute', top: '50%', left: 0, right: 0, borderTop: '1px dashed #aaa' }}></div>
                   <div style={{ position: 'absolute', left: '50%', top: 0, bottom: 0, borderLeft: '1px dashed #aaa' }}></div>
                   <span style={{ position: 'absolute', top: '50%', left: 5, transform: 'translateY(-50%)', color: '#888', fontSize: '0.8rem' }}>リスク (低)</span>
                   <span style={{ position: 'absolute', top: '50%', right: 5, transform: 'translateY(-50%)', color: '#888', fontSize: '0.8rem' }}>リスク (高)</span>
                   <span style={{ position: 'absolute', left: '50%', bottom: 5, transform: 'translateX(-50%)', color: '#888', fontSize: '0.8rem' }}>効果 (低)</span>
                   <span style={{ position: 'absolute', left: '50%', top: 5, transform: 'translateX(-50%)', color: '#888', fontSize: '0.8rem' }}>効果 (高)</span>
                  {
                    boardData.candidates.map(mol => (
                      <div 
                        key={mol.id}
                        data-proof={`molecule-candidate-${mol.id}`}
                        onClick={() => setSelectedMolecule(mol)}
                        style={{
                          position: 'absolute',
                          top: `${(1 - mol.effectScore) * 100}%`,
                          left: `${mol.riskScore * 100}%`,
                          transform: 'translate(-50%, -50%)',
                          width: '12px',
                          height: '12px',
                          borderRadius: '50%',
                          backgroundColor: 'rgba(0, 123, 255, 0.8)',
                          border: '2px solid white',
                          boxShadow: '0 0 5px rgba(0,0,0,0.5)',
                          cursor: 'pointer',
                          transition: 'transform 0.2s ease'
                        }}
                        title={mol.name}
                      ></div>
                    ))
                  }
                </div>
              </div>
              <div>
                <div data-proof="approval-gate" style={{ border: '2px dashed #28a745', padding: '1rem', borderRadius: '8px', backgroundColor: '#f0fff0', minHeight: '200px', marginBottom: '1rem' }}>
                  <h3 style={{ marginTop: 0, color: '#28a745' }}>承認待ちリスト</h3>
                  {approvedMolecules.length === 0 ? (
                    <p style={{ color: '#555' }}>候補をクリックして選択し、「承認」してください。</p>
                  ) : (
                    <ul style={{ paddingLeft: '20px', margin: 0 }}>
                      {approvedMolecules.map(mol => (
                        <li key={mol.id} data-proof="approved-molecule-name" data-molecule-id={mol.id} >{mol.name}</li>
                      ))}
                    </ul>
                  )}
                </div>
                {selectedMolecule && (
                    <div data-proof="selected-molecule-details" style={{ border: '1px solid #ddd', padding: '1rem', borderRadius: '8px' }}>
                      <h4 style={{marginTop: 0}}>{selectedMolecule.name}</h4>
                      <p style={{fontSize: '0.9rem', margin: '0.5rem 0'}}><strong>効果スコア:</strong> {selectedMolecule.effectScore}</p>
                      <p style={{fontSize: '0.9rem', margin: '0.5rem 0'}}><strong>リスクスコア:</strong> {selectedMolecule.riskScore}</p>
                      <p style={{fontSize: '0.8rem', margin: '0.5rem 0', color: '#444'}}><em>{selectedMolecule.justification}</em></p>
                      <button onClick={() => handleApprove(selectedMolecule)} style={{ width: '100%', padding: '0.5rem', backgroundColor: '#28a745', color: 'white', border: 'none', borderRadius: '4px', cursor: 'pointer', marginTop: '1rem' }}>承認</button>
                    </div>
                )}
              </div>
            </div>
          ) : (
            <div data-proof="initial-state" style={{ padding: '2rem', textAlign: 'center', backgroundColor: '#f5f5f5', borderRadius: '8px' }}>
              <p>パイプラインはまだ実行されていません。</p>
              <p>「サンプル実行トレースを再生」ボタンを押して、デモを開始してください。</p>
            </div>
          )}
        </div>
      </main>
    </div>
  );
}