XAUUSDAITradingBot/EchoHeirloom

1/* MedFlow Command — instrument-panel design system.2   Stage colour is always paired with a glyph and a word: colour never carries3   status on its own. */4 5:root{6  --bg:#070E12; --bg-2:#0C161C; --panel:#101D25; --panel-2:#162A34; --line:#22404E;7  --ink:#E8F4F6; --ink-2:#9FBCC7; --ink-3:#6B8794;8  --received:#38D6E4; --triaged:#4F8CFF; --investigating:#A57BFF; --proposed:#FFB020;9  --validation:#FF5FA2; --approved:#2FD68A; --executing:#19C2C9; --verified:#B6E02A;10  --closed:#6E8494; --blocked:#FF8A3D; --failed:#FF5C4D; --escalated:#FF3B6B;11  --ok:#2FD68A; --warn:#FFB020; --bad:#FF5C4D;12  --radius:10px; --radius-lg:16px;13  --sans:"Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;14  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;15  --shadow:0 18px 44px -28px rgba(0,0,0,.9);16}17:root[data-theme="light"]{18  --bg:#F2F6F8; --bg-2:#E8EFF3; --panel:#FFFFFF; --panel-2:#EDF3F6; --line:#C9DAE2;19  --ink:#0C1B22; --ink-2:#3E5A66; --ink-3:#66818D;20  --shadow:0 12px 30px -24px rgba(12,27,34,.45);21}22 23*{box-sizing:border-box}24html,body{margin:0;height:100%;overflow:hidden}25body{26  background:27    radial-gradient(1100px 600px at 82% -8%, rgba(79,140,255,.16), transparent 60%),28    radial-gradient(900px 500px at 4% 104%, rgba(47,214,138,.13), transparent 62%),29    var(--bg);30  color:var(--ink); font-family:var(--sans); line-height:1.5;31  font-size:clamp(12.5px,.95vw + 6px,14.5px);32  -webkit-font-smoothing:antialiased;33}34h1,h2,h3{margin:0 0 .4rem; font-weight:600; letter-spacing:-.012em}35h1{font-size:1.15rem} h2{font-size:1rem} h3{font-size:.9rem}36p{margin:.2rem 0 .6rem; max-width:72ch; color:var(--ink-2)}37a{color:var(--triaged)}38code,.mono{font-family:var(--mono); font-size:.82em}39 40:focus-visible{outline:2.5px solid var(--received); outline-offset:2px; border-radius:6px}41.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}42 43/* ---------- shell ----------44   Fixed 100dvh app frame, no page-level scroll: nav and main each scroll45   internally so the whole console fits one PC viewport, like a native46   dashboard rather than a long web page. */47#app{display:grid; grid-template-columns:min(232px,15vw) 1fr; height:100vh; height:100dvh}48nav.rail{49  background:linear-gradient(180deg,var(--panel),var(--bg-2));50  border-right:1px solid var(--line); padding:12px 8px; display:flex; flex-direction:column; gap:1px;51  height:100%; overflow-y:auto;52}53.brand{display:flex; align-items:center; gap:9px; padding:6px 8px 14px}54.brand b{font-size:.97rem; letter-spacing:-.02em}55.brand small{display:block; color:var(--ink-3); font-size:.68rem; letter-spacing:.06em}56.pulse{width:11px;height:11px;border-radius:50%;background:var(--executing);57  box-shadow:0 0 0 0 rgba(25,194,201,.6); animation:beat 2.6s infinite}58@keyframes beat{70%{box-shadow:0 0 0 11px rgba(25,194,201,0)}100%{box-shadow:0 0 0 0 rgba(25,194,201,0)}}59.rail button{60  all:unset; display:flex; align-items:center; gap:9px; padding:7px 10px; border-radius:9px;61  color:var(--ink-2); cursor:pointer; font-size:.86rem;62}63.rail button:hover{background:var(--panel-2); color:var(--ink)}64.rail button[aria-current="page"]{background:var(--panel-2); color:var(--ink);65  box-shadow:inset 3px 0 0 var(--received)}66.rail .tag{margin-left:auto; font-size:.66rem; padding:1px 6px; border-radius:99px;67  background:var(--validation); color:#1A0410; font-weight:700}68.rail .grp{color:var(--ink-3); font-size:.64rem; letter-spacing:.14em; padding:12px 10px 4px}69 70main{height:100%; overflow-y:auto; padding:14px 20px 30px; max-width:1800px}71.topbar{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:12px;72  position:sticky; top:0; z-index:5; padding:6px 0; background:linear-gradient(var(--bg) 72%, transparent);}73.topbar .spacer{flex:1}74 75/* ---------- primitives ---------- */76.card{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius-lg);77  padding:12px; box-shadow:var(--shadow)}78.grid{display:grid; gap:10px}79.g2{grid-template-columns:repeat(2,minmax(0,1fr))}80.g3{grid-template-columns:repeat(3,minmax(0,1fr))}81.g4{grid-template-columns:repeat(4,minmax(0,1fr))}82.row{display:flex; gap:8px; align-items:center; flex-wrap:wrap}83.muted{color:var(--ink-3)}84.small{font-size:.8rem}85 86button.btn{all:unset; cursor:pointer; padding:7px 13px; border-radius:9px; font-size:.84rem;87  background:var(--panel-2); border:1px solid var(--line); color:var(--ink)}88button.btn:hover{border-color:var(--received)}89button.btn[disabled]{opacity:.45; cursor:not-allowed}90button.primary{background:linear-gradient(135deg,var(--received),var(--triaged)); color:#04141A;91  border:none; font-weight:650}92button.danger{border-color:var(--failed); color:var(--failed)}93button.good{border-color:var(--approved); color:var(--approved)}94input,select,textarea{background:var(--bg-2); border:1px solid var(--line); color:var(--ink);95  border-radius:9px; padding:8px 10px; font:inherit; font-size:.85rem; width:100%}96label{display:block; font-size:.76rem; color:var(--ink-2); margin:6px 0 3px}97 98.kpi{display:flex; flex-direction:column; gap:2px}99.kpi b{font-size:1.5rem; font-variant-numeric:tabular-nums; letter-spacing:-.03em}100.kpi span{font-size:.74rem; color:var(--ink-3)}101 102table{width:100%; border-collapse:collapse; font-size:.82rem}103th{text-align:left; color:var(--ink-3); font-weight:500; padding:6px 8px; border-bottom:1px solid var(--line)}104td{padding:7px 8px; border-bottom:1px solid var(--line); vertical-align:top}105tr:hover td{background:var(--panel-2)}106 107/* status chips — glyph + word + colour */108.chip{display:inline-flex; align-items:center; gap:5px; padding:2px 8px; border-radius:99px;109  font-size:.71rem; border:1px solid currentColor; background:color-mix(in srgb,currentColor 12%,transparent);110  white-space:nowrap}111.chip .gl{font-family:var(--mono); font-weight:700}112.s-RECEIVED{color:var(--received)} .s-TRIAGED{color:var(--triaged)}113.s-INVESTIGATING{color:var(--investigating)} .s-PROPOSED{color:var(--proposed)}114.s-VALIDATION_REQUIRED{color:var(--validation)} .s-APPROVED{color:var(--approved)}115.s-EXECUTING{color:var(--executing)} .s-VERIFIED{color:var(--verified)}116.s-CLOSED{color:var(--closed)} .s-BLOCKED{color:var(--blocked)}117.s-REJECTED{color:var(--failed)} .s-CANCELLED{color:var(--closed)}118.s-FAILED{color:var(--failed)} .s-ESCALATED{color:var(--escalated)}119.r-low{color:var(--approved)} .r-medium{color:var(--proposed)}120.r-high{color:var(--blocked)} .r-critical{color:var(--failed)} .r-unknown{color:var(--closed)}121 122.banner{border-radius:var(--radius); padding:10px 13px; border:1px solid; display:flex;123  gap:10px; align-items:flex-start; font-size:.83rem}124.banner.demo{color:var(--proposed)}125.banner.emergency{color:var(--escalated); background:color-mix(in srgb,var(--escalated) 12%,transparent)}126.banner.mock{color:var(--investigating)}127 128/* ---------- topology ---------- */129.topo{width:100%; height:auto; display:block}130.topo .node{fill:var(--panel-2); stroke:var(--line)}131.topo .node.hot{stroke:var(--received); stroke-width:2.5}132.topo text{fill:var(--ink-2); font-size:9.5px; font-family:var(--sans)}133.topo .core{fill:url(#coreg); stroke:var(--received); stroke-width:2}134.topo .link{stroke:var(--line); stroke-width:1.2}135.topo .spark{stroke:var(--received); stroke-width:2.4; stroke-linecap:round}136 137/* ---------- kanban ---------- */138.kanban{display:grid; grid-auto-flow:column; grid-auto-columns:230px; gap:10px; overflow-x:auto;139  padding-bottom:8px}140.col{background:var(--bg-2); border:1px solid var(--line); border-radius:var(--radius); padding:8px}141.col h3{font-size:.74rem; color:var(--ink-2); display:flex; justify-content:space-between}142.wfcard{background:var(--panel); border:1px solid var(--line); border-radius:9px; padding:8px;143  margin-top:7px; cursor:pointer; border-left:3px solid currentColor}144.wfcard b{font-size:.8rem; color:var(--ink); display:block; font-weight:600}145 146/* ---------- voice ---------- */147.callstate{display:flex; gap:10px; align-items:center; font-size:.8rem}148.dot{width:9px;height:9px;border-radius:50%;background:var(--closed)}149.dot.live{background:var(--approved)} .dot.connecting{background:var(--proposed)}150.dot.error{background:var(--failed)}151canvas.wave{width:100%; height:74px; display:block; background:var(--bg-2);152  border:1px solid var(--line); border-radius:var(--radius)}153.captions{background:var(--bg-2); border:1px solid var(--line); border-radius:var(--radius);154  padding:10px; height:230px; overflow:auto; font-size:.85rem}155.cap{margin-bottom:8px} .cap .who{font-size:.68rem; color:var(--ink-3)}156.cap.user .what{color:var(--received)} .cap.agent .what{color:var(--ink)}157.cap.partial .what{opacity:.62; font-style:italic}158 159/* ---------- misc ---------- */160.bars{display:flex; align-items:flex-end; gap:3px; height:80px}161.bars i{flex:1; background:linear-gradient(180deg,var(--received),var(--triaged)); border-radius:3px 3px 0 0}162.bars i.hot{background:linear-gradient(180deg,var(--failed),var(--blocked))}163.heat{display:grid; grid-template-columns:repeat(12,1fr); gap:3px}164.heat i{aspect-ratio:1; border-radius:3px; background:var(--panel-2)}165.gauge{height:8px; background:var(--panel-2); border-radius:99px; overflow:hidden}166.gauge > i{display:block; height:100%; background:linear-gradient(90deg,var(--approved),var(--received))}167.map{position:relative; background:var(--bg-2); border:1px solid var(--line);168  border-radius:var(--radius); height:260px; overflow:hidden}169.map .pin{position:absolute; transform:translate(-50%,-100%); font-size:.68rem; color:var(--ink-2);170  text-align:center}171.map .pin b{display:block; width:12px;height:12px;border-radius:50% 50% 50% 0; rotate:-45deg;172  margin:0 auto 3px; background:var(--received)}173.empty{border:1px dashed var(--line); border-radius:var(--radius); padding:24px; text-align:center;174  color:var(--ink-3); font-size:.85rem}175dialog{border:1px solid var(--line); background:var(--panel); color:var(--ink);176  border-radius:var(--radius-lg); max-width:760px; width:92vw; padding:16px}177dialog::backdrop{background:rgba(3,8,11,.72)}178.pill{font-size:.68rem; padding:1px 7px; border-radius:99px; border:1px solid var(--line);179  color:var(--ink-3)}180.flagged{border:1px dashed var(--investigating); color:var(--investigating);181  padding:1px 7px; border-radius:99px; font-size:.66rem}182 183@media (max-width:900px){184  html,body{overflow:auto}185  #app{grid-template-columns:1fr; height:auto; min-height:100vh; min-height:100dvh}186  nav.rail{position:sticky; top:0; height:auto; flex-direction:row; overflow-x:auto;187    overflow-y:visible; gap:4px; z-index:6}188  nav.rail .grp,.brand small{display:none}189  main{height:auto; overflow-y:visible}190  .g2,.g3,.g4{grid-template-columns:1fr}191}192@media (prefers-reduced-motion:reduce){193  *{animation:none !important; transition:none !important}194}195