Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <meta name="description" content="CUTS+ Causal Terminal β Iroha Financial Intelligence. Real-time causal probability matrix, HHKD decomposition, and DoFlow inference over NIFTY50."> | |
| <title>CUTS+ Causal Terminal Β· Iroha</title> | |
| <!-- Stylesheet (separate file served via StaticFiles) --> | |
| <link rel="stylesheet" href="/static/style.css"> | |
| </head> | |
| <body> | |
| <!-- ββ Loading Overlay βββββββββββββββββββββββββββββββββββββββββββββββββββ --> | |
| <div id="loading-overlay"> | |
| <div class="loading-brand">CUTS+ CAUSAL</div> | |
| <div class="loading-bar-wrap"> | |
| <div class="loading-bar-fill"></div> | |
| </div> | |
| <div class="loading-status" id="loading-status">INITIALISING ENGINEβ¦</div> | |
| </div> | |
| <!-- ββ Top Bar βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ --> | |
| <div class="topbar"> | |
| <div style="display:flex;align-items:center;gap:16px;"> | |
| <div class="brand">CUTS+ CAUSAL</div> | |
| <div class="tabs"> | |
| <button class="tab active" data-tab="matrix" onclick="setTab('matrix')">MATRIX</button> | |
| <button class="tab" data-tab="network" onclick="setTab('network')">NETWORK</button> | |
| <button class="tab" data-tab="hhkd" onclick="setTab('hhkd')">HHKD</button> | |
| <button class="tab" data-tab="sector" onclick="setTab('sector')">SECTOR</button> | |
| <button class="tab" data-tab="single" onclick="setTab('single')">SINGLE TICKER</button> | |
| </div> | |
| </div> | |
| <div class="topbar-right"> | |
| <span><span class="live-dot"></span> LIVE</span> | |
| <span id="clock" style="color:var(--amber);">--:--:--</span> | |
| <span>NIFTY50 Β· EPOCH 30/30</span> | |
| </div> | |
| </div> | |
| <!-- ββ API Status Banner βββββββββββββββββββββββββββββββββββββββββββββββββ --> | |
| <div id="api-banner"> | |
| <div class="api-chip" id="api-rest"> | |
| <div class="api-dot"></div><span>REST API</span> | |
| </div> | |
| <div class="api-chip" id="api-gradio"> | |
| <div class="api-dot"></div><span>GRADIO CLIENT</span> | |
| </div> | |
| <div class="api-chip" id="api-pipeline"> | |
| <div class="api-dot"></div><span>PIPELINE</span> | |
| </div> | |
| <div class="api-chip" id="api-infer"> | |
| <div class="api-dot"></div><span>INFERENCE</span> | |
| </div> | |
| </div> | |
| <!-- ββ Body ββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ --> | |
| <div class="body"> | |
| <!-- LEFT SIDEBAR --> | |
| <div class="sidebar"> | |
| <div class="sb-header"> | |
| <span>TICKERS β Ο RANK</span> | |
| <span id="sb-count" style="color:var(--muted);">36</span> | |
| </div> | |
| <div class="sb-seg"> | |
| <div class="seg-btn"> | |
| <button class="active" onclick="setSeg(this,'all')">ALL</button> | |
| <button onclick="setSeg(this,'up')">UPSTREAM</button> | |
| <button onclick="setSeg(this,'dn')">SINK</button> | |
| </div> | |
| </div> | |
| <div class="sb-search"> | |
| <input type="text" placeholder="Search tickerβ¦" id="sb-search-input" | |
| oninput="filterTickers(this.value)" autocomplete="off"> | |
| </div> | |
| <div class="ticker-list" id="ticker-list"></div> | |
| </div> | |
| <!-- CENTER PANEL --> | |
| <div class="center"> | |
| <!-- MATRIX VIEW --> | |
| <div class="view active" id="view-matrix"> | |
| <div class="view-header"> | |
| <span class="vh-title">CAUSAL PROBABILITY MATRIX</span> | |
| <span class="vh-meta">GΒ·Ο(G_T) Β· GUMBEL-SOFTMAX Β· HOVER β DETAILS Β· CLICK β PIN</span> | |
| </div> | |
| <div class="legend"> | |
| <div class="leg-item"><div class="leg-dot" style="background:#e03434;"></div>Strong cause >0.7</div> | |
| <div class="leg-item"><div class="leg-dot" style="background:#f0a500;"></div>Moderate 0.4β0.7</div> | |
| <div class="leg-item"><div class="leg-dot" style="background:#003a20;"></div>Weak <0.4</div> | |
| <div class="leg-item" style="margin-left:auto;color:var(--muted);">Inference ripples across this map in real-time</div> | |
| </div> | |
| <div class="view-body" style="padding:0;" id="matrix-body"> | |
| <svg id="heatmap-svg"></svg> | |
| </div> | |
| </div> | |
| <!-- NETWORK VIEW --> | |
| <div class="view" id="view-network"> | |
| <div class="view-header"> | |
| <span class="vh-title">CAUSAL NETWORK GRAPH</span> | |
| <span class="vh-meta">THRESHOLDED DAG Β· ΞΈ=0.5 Β· DRAG TO EXPLORE Β· NODE SIZE β OUT-DEGREE</span> | |
| </div> | |
| <div class="legend"> | |
| <div class="leg-item"><div class="leg-dot" style="background:var(--amber);"></div>High Ο (upstream)</div> | |
| <div class="leg-item"><div class="leg-dot" style="background:var(--cyan);"></div>Mid Ο</div> | |
| <div class="leg-item"><div class="leg-dot" style="background:var(--muted);"></div>Low Ο (sink)</div> | |
| <div class="leg-item"><div class="leg-line" style="background:var(--red);"></div>Strong edge</div> | |
| </div> | |
| <div class="view-body" style="padding:0;position:relative;"> | |
| <svg id="net-svg"></svg> | |
| </div> | |
| </div> | |
| <!-- HHKD VIEW --> | |
| <div class="view" id="view-hhkd"> | |
| <div class="view-header"> | |
| <span class="vh-title">HELMHOLTZ-HODGE-KODAIRA DECOMPOSITION</span> | |
| <span class="vh-meta">J_b β J_grad + J_res Β· βRESIDUALβ < 10β»βΆ</span> | |
| </div> | |
| <div class="view-body" style="padding:10px;"> | |
| <div style="display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px;"> | |
| <div> | |
| <div style="color:var(--amber);font-size:9px;letter-spacing:2px;margin-bottom:8px;text-transform:uppercase;"> | |
| Scalar Potential Ο β Upstream Ranking | |
| </div> | |
| <div id="phi-chart"></div> | |
| </div> | |
| <div> | |
| <div style="color:var(--cyan);font-size:9px;letter-spacing:2px;margin-bottom:8px;text-transform:uppercase;"> | |
| Decomposition Diagnostics | |
| </div> | |
| <div id="hhkd-diag"></div> | |
| <div style="margin-top:10px;"> | |
| <div style="color:var(--muted);font-size:9px;letter-spacing:1px;margin-bottom:6px;">GRADIENT vs CYCLIC SPLIT</div> | |
| <div style="height:18px;background:var(--bg4);border-radius:3px;overflow:hidden;display:flex;"> | |
| <div style="height:18px;width:93.8%;background:var(--amber);display:flex;align-items:center;justify-content:center;font-size:8px;color:#000;font-weight:600;">GRADIENT 93.8%</div> | |
| <div style="flex:1;height:18px;background:var(--cyan-lo);display:flex;align-items:center;justify-content:center;font-size:8px;color:var(--cyan);">6.2%</div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div style="color:var(--amber);font-size:9px;letter-spacing:2px;margin-bottom:8px;text-transform:uppercase;"> | |
| Gradient Flow J_grad β Sector Heatmap | |
| </div> | |
| <svg id="jgrad-svg"></svg> | |
| </div> | |
| </div> | |
| <!-- SECTOR VIEW --> | |
| <div class="view" id="view-sector"> | |
| <div class="view-header"> | |
| <span class="vh-title">SECTOR MACRO GRAPH β REASON TRIPLET β¨G, A, Eβ©</span> | |
| <span class="vh-meta">BIDIRECTIONAL MESSAGE PASSING Β· CrossLevelMPNN</span> | |
| </div> | |
| <div class="view-body" style="padding:0;overflow-y:auto;"> | |
| <div style="padding:10px;"> | |
| <div style="color:var(--amber);font-size:9px;letter-spacing:2px;margin-bottom:8px;text-transform:uppercase;">Macro Sector Adjacency</div> | |
| <svg id="macro-svg"></svg> | |
| </div> | |
| <div class="sector-grid" id="sector-grid"></div> | |
| </div> | |
| </div> | |
| <!-- SINGLE TICKER VIEW --> | |
| <div class="view" id="view-single"> | |
| <div class="view-header"> | |
| <div> | |
| <span class="vh-title">SINGLE TICKER β FUNDAMENTAL CAUSAL</span> | |
| <span id="single-name" style="color:var(--amber);font-size:13px;font-weight:600;margin-left:12px;">RELIANCE</span> | |
| </div> | |
| <span class="vh-meta">DuPont PRIOR Β· 23 NODES Β· SCM RIDGE Β· CAMEF GPT4MTS</span> | |
| </div> | |
| <div class="view-body" style="padding:10px;overflow-y:auto;"> | |
| <div style="display:grid;grid-template-columns:1fr 1fr;gap:10px;"> | |
| <div> | |
| <div style="color:var(--amber);font-size:9px;letter-spacing:2px;margin-bottom:6px;text-transform:uppercase;">DuPont Prior Adjacency (23Γ23)</div> | |
| <svg id="dupont-svg"></svg> | |
| <div style="color:var(--cyan);font-size:9px;letter-spacing:2px;margin:10px 0 6px;text-transform:uppercase;">Discovered Causal Edges</div> | |
| <div id="disc-edges"></div> | |
| </div> | |
| <div> | |
| <div style="color:var(--amber);font-size:9px;letter-spacing:2px;margin-bottom:6px;text-transform:uppercase;">CAMEF Stress Forecast</div> | |
| <svg id="camef-svg"></svg> | |
| <div style="color:var(--cyan);font-size:9px;letter-spacing:2px;margin:10px 0 6px;text-transform:uppercase;">FCM Lag-Graph GββGβ</div> | |
| <div id="fcm-bars"></div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div><!-- /center --> | |
| <!-- RIGHT PANEL --> | |
| <div class="rpanel"> | |
| <!-- INFERENCE ENGINE --> | |
| <div style="flex-shrink:0;border-bottom:1px solid var(--border);"> | |
| <div class="rp-head">CAUSAL INFERENCE ENGINE</div> | |
| <div class="infer-panel"> | |
| <div class="infer-mode"> | |
| <button class="m-assert active" onclick="setInferMode('assert')">ASSERT</button> | |
| <button class="m-intervene" onclick="setInferMode('intervene')">INTERVENE</button> | |
| <button class="m-counter" onclick="setInferMode('counter')">COUNTERΒ·F</button> | |
| </div> | |
| <div class="infer-form" id="infer-form"> | |
| <!-- populated by app.js --> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- RESULTS --> | |
| <div style="flex:1;overflow-y:auto;"> | |
| <div class="rp-head"> | |
| RESULTS & RIPPLE TRACE | |
| <span id="result-count" style="color:var(--muted);font-size:9px;font-weight:400;"></span> | |
| </div> | |
| <div style="padding:8px;" id="results-area"> | |
| <div style="color:var(--muted);font-size:10px;text-align:center;padding:20px 0;"> | |
| Run an inference query to see results and ripple effects across all views. | |
| </div> | |
| </div> | |
| <!-- NEWS FEED --> | |
| <div class="rp-head" style="margin-top:0;">LLM DENOISED NEWS</div> | |
| <div id="news-feed"></div> | |
| </div> | |
| </div><!-- /rpanel --> | |
| </div><!-- /body --> | |
| <!-- STATUS STRIP --> | |
| <div class="status-strip"> | |
| <div class="ss-chip"><span class="ss-k">TICKERS</span><span class="ss-v am">36</span></div> | |
| <div class="ss-chip"><span class="ss-k">EDGES</span><span class="ss-v am">127</span></div> | |
| <div class="ss-chip"><span class="ss-k">DENSITY</span><span class="ss-v">5.2%</span></div> | |
| <div class="ss-chip"><span class="ss-k">Ξ»_s</span><span class="ss-v">0.10</span></div> | |
| <div class="ss-chip"><span class="ss-k">Ξ»_d</span><span class="ss-v">1.00</span></div> | |
| <div class="ss-chip"><span class="ss-k">LOSS</span><span class="ss-v up" id="ss-loss">0.0412</span></div> | |
| <div class="ss-chip"><span class="ss-k">PRIOR CONFORM</span><span class="ss-v up">91.3%</span></div> | |
| <div class="ss-chip"><span class="ss-k">βJ_resβ</span><span class="ss-v am">3.2e-7</span></div> | |
| <div class="ss-chip"><span class="ss-k">EPOCH</span><span class="ss-v">30/30 β</span></div> | |
| </div> | |
| <!-- NODE POPUP --> | |
| <div class="node-popup" id="node-popup"> | |
| <div class="np-head"> | |
| <span id="np-name">RELIANCE</span> | |
| <span id="np-sector" style="font-size:9px;color:var(--muted);font-weight:400;">Energy</span> | |
| </div> | |
| <div class="np-row"><span class="np-k">Ο Potential</span><span class="np-v am" id="np-phi">+2.41</span></div> | |
| <div class="np-row"><span class="np-k">Rank</span><span class="np-v up" id="np-rank">#1 Upstream</span></div> | |
| <div class="np-row"><span class="np-k">Out-degree</span><span class="np-v" id="np-out">8</span></div> | |
| <div class="np-row"><span class="np-k">In-degree</span><span class="np-v" id="np-in">2</span></div> | |
| <div class="np-row"><span class="np-k">Strongest cause</span><span class="np-v am" id="np-cause">ONGC 0.847</span></div> | |
| <div class="np-row"><span class="np-k">News score</span><span class="np-v up" id="np-news">0.87</span></div> | |
| </div> | |
| <!-- ERROR TOAST --> | |
| <div id="error-toast"></div> | |
| <!-- App JS (separate file served via StaticFiles) --> | |
| <script type="module" src="/static/app.js"></script> | |
| </body> | |
| </html> | |