/* dexfarm dashboard : Bloomberg Dense (v2) */
@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap");
:root{
  --bg:#000;--pan:#070707;--pan2:#0d0d0d;--ln:#1a1a1a;--ln2:#262626;
  --ink:#d8dee9;--dim:#6a6a6a;--amber:#f5a623;--green:#33e0a1;--red:#ff6a6a;--cy:#5fd0ff;--yellow:#ffd479;
  --mo:"JetBrains Mono",ui-monospace,Menlo,monospace;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--mo);font-size:12.5px}
.hidden{display:none!important}
button,input,select{font-family:var(--mo)}

.hd{display:flex;justify-content:space-between;align-items:center;gap:8px;background:#101010;border-bottom:2px solid var(--amber);padding:7px 12px;position:sticky;top:0;z-index:5;flex-wrap:wrap}
.hd .m{color:var(--amber);font-weight:700;letter-spacing:.16em}.hd .m b{color:#fff}
.hd .r{display:flex;gap:14px;align-items:center;font-size:11px}
.conn{display:flex;gap:6px;align-items:center;text-transform:uppercase;letter-spacing:.06em;color:var(--dim)}
.conn .d{width:7px;height:7px;border-radius:50%;background:var(--dim)}
.conn.live .d{background:var(--green);box-shadow:0 0 6px var(--green)}.conn.live{color:var(--green)}
.conn.stale .d{background:var(--red)}.conn.stale{color:var(--red)}
.btn{background:#161616;border:1px solid #333;color:var(--ink);padding:4px 9px;cursor:pointer;text-transform:uppercase;letter-spacing:.05em;font-size:11px}
.btn:hover{border-color:#555}
.btn.danger{color:var(--red);border-color:#5a2626}.btn.danger:hover{background:var(--red);color:#150707}
.btn.k{color:var(--yellow);border-color:#5a4a1e}.btn.k:hover{background:var(--yellow);color:#1a1402}
.btn.sm{padding:2px 7px;font-size:10px}

.venue{border-bottom:2px solid var(--ln)}
.vbar{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:6px 12px;background:#0c0c0c;border-bottom:1px solid var(--ln);flex-wrap:wrap}
.vbar .vid{font-weight:700;letter-spacing:.08em}.vbar .vid .ex{color:var(--dim);font-weight:400;font-size:10px;margin-left:8px}
.vtag{font-size:9px;text-transform:uppercase;letter-spacing:.08em;padding:1px 6px;border:1px solid var(--ln2);color:var(--dim);margin-left:6px}
.vtag.run{color:var(--green);border-color:#1c4a39}.vtag.halt{color:var(--red);border-color:#5a2626}
.vbar .vr{display:flex;gap:12px;align-items:center}.vbar .bal{color:var(--green);font-weight:700;font-size:14px}

.kpis{display:grid;grid-template-columns:repeat(4,1fr)}
.kpi{padding:8px 12px;border-right:1px solid var(--ln);border-bottom:1px solid var(--ln)}
.kpi .k{color:var(--dim);font-size:9.5px;text-transform:uppercase;letter-spacing:.12em}
.kpi .v{font-size:18px;font-weight:700;margin-top:3px;font-variant-numeric:tabular-nums}
.up{color:var(--green)}.dn{color:var(--red)}.cyv{color:var(--cy)}
.fb{height:5px;background:#161616;margin-top:7px}.fb i{display:block;height:100%;background:linear-gradient(90deg,var(--green),var(--amber))}

.grid{display:grid;grid-template-columns:1.35fr 1fr;gap:2px;background:var(--ln);padding:2px}
@media(max-width:760px){.grid{grid-template-columns:1fr}.kpis{grid-template-columns:1fr 1fr}}
.box{background:var(--bg);border:1px solid #161616}
.bxh{display:flex;justify-content:space-between;align-items:center;background:#0d0d0d;color:var(--amber);font-size:10px;letter-spacing:.14em;text-transform:uppercase;padding:4px 10px;border-bottom:1px solid var(--ln)}
.bxh .seg{display:flex;border:1px solid var(--ln2)}.bxh .seg b{font-size:10px;padding:1px 8px;color:var(--dim);cursor:pointer}.bxh .seg b.on{background:var(--amber);color:#150d01}

table{width:100%;border-collapse:collapse}
th,td{padding:5px 10px;text-align:right;border-bottom:1px solid #131313;font-variant-numeric:tabular-nums;white-space:nowrap}
th{color:var(--dim);font-size:9px;text-transform:uppercase;letter-spacing:.1em}
td:first-child,th:first-child{text-align:left}
.sym{color:#fff;font-weight:700}
.tag{font-size:9px;padding:1px 5px;border:1px solid;letter-spacing:.06em;margin-left:6px}
.tag.live{color:var(--green);border-color:#1c4a39}.tag.rd{color:var(--cy);border-color:#1c3a4a}.tag.ps{color:var(--yellow);border-color:#4a3a1e}.tag.off{color:var(--dim);border-color:var(--ln2)}
.mini{width:48px;background:#0a0a0a;border:1px solid #2a2a2a;color:#fff;text-align:right;padding:2px 5px;font-size:11px}
.mini:focus{outline:none;border-color:var(--amber)}
.ctd{display:flex;gap:5px;justify-content:flex-end;align-items:center}
.tg{font-size:9px;text-transform:uppercase;padding:2px 6px;border:1px solid var(--ln2);color:var(--dim);cursor:pointer;user-select:none}
.tg.on{background:var(--green);color:#04140d;border-color:var(--green)}.tg.on.w{background:var(--cy);border-color:var(--cy);color:#04141f}
.x{cursor:pointer;color:var(--amber);border:1px solid #4a3a1e;padding:1px 7px;font-size:10px;text-transform:uppercase}.x:hover{background:var(--amber);color:#150d01}

svg.chart{width:100%;height:150px;display:block}
.carea{fill:var(--green);opacity:.10}.cline{stroke:var(--green)}
.chart-wrap.bleed .carea{fill:var(--red)}.chart-wrap.bleed .cline{stroke:var(--red)}
.empty{height:150px;display:flex;align-items:center;justify-content:center;color:#333;font-size:11px}

.log{font-size:11px;line-height:1.7;color:#8a8a8a;padding:8px 10px;max-height:160px;overflow:auto;white-space:pre-wrap;word-break:break-word}
.log .t{color:#4a4a4a}.log b{color:var(--cy)}
.simr{display:flex;gap:7px;align-items:center;padding:8px 10px;flex-wrap:wrap;border-bottom:1px solid #131313}
.simr select,.simr input{background:#0a0a0a;border:1px solid #2a2a2a;color:#fff;padding:3px 6px;font-size:11px}.simr input{width:54px}
.simlist{padding:6px 10px;font-size:11px}
.simrow{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:3px 0;border-bottom:1px solid #111}
.adv{border-bottom:1px solid var(--ln)}
.adv summary{cursor:pointer;color:var(--dim);font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:7px 12px;background:#0a0a0a}
.adv .body{display:flex;gap:14px;flex-wrap:wrap;align-items:flex-end;padding:10px 12px}
.fld{display:flex;flex-direction:column;gap:4px}.fld label{font-size:9px;text-transform:uppercase;color:var(--dim);letter-spacing:.08em}
.fld input,.fld select{background:#0a0a0a;border:1px solid #2a2a2a;color:#fff;padding:4px 6px;font-size:11px}

.fkeys{display:flex;border-top:2px solid var(--amber);background:#0a0a0a;position:sticky;bottom:0}
.fk{flex:1;text-align:center;padding:6px 0;font-size:10px;color:var(--dim);border-right:1px solid #161616;letter-spacing:.04em;cursor:pointer}
.fk:hover{background:#111;color:var(--ink)}.fk b{color:var(--amber)}

.gate{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;background:#000000e6}
.gate form{display:flex;flex-direction:column;gap:11px;width:300px;padding:26px;border:1px solid var(--ln2);background:#0a0a0a}
.gate .gm{color:var(--amber);font-weight:700;letter-spacing:.18em;text-align:center}.gate .gs{color:var(--dim);font-size:10px;text-transform:uppercase;letter-spacing:.1em;text-align:center;margin:-4px 0 2px}
.gate input{background:#000;border:1px solid #2a2a2a;color:#fff;padding:9px 10px}.gate input:focus{outline:none;border-color:var(--amber)}
.gate button{background:var(--amber);color:#150d01;border:none;padding:9px;text-transform:uppercase;letter-spacing:.1em;cursor:pointer}
.gate .err{color:var(--red);font-size:11px;text-align:center;min-height:13px;margin:0}
.modal{position:fixed;inset:0;z-index:25;display:flex;align-items:center;justify-content:center;background:#000000cc}
.modal .c{width:330px;padding:20px;border:1px solid #5a2626;background:#0a0a0a}.modal p{margin:0 0 16px;line-height:1.5}.modal .a{display:flex;gap:10px;justify-content:flex-end}
.toast{position:fixed;left:50%;bottom:46px;transform:translateX(-50%);z-index:30;padding:9px 15px;background:#0d0d0d;border:1px solid var(--ln2);font-size:12px;max-width:90vw}
.toast.ok{border-color:#1c4a39;color:var(--green)}.toast.err{border-color:#5a2626;color:var(--red)}

/* fully mobile-friendly: stacked position cards, big tap targets */
@media(max-width:640px){
  body{font-size:13px}
  .hd{padding:8px 10px}.hd .r{gap:9px}
  .vbar{padding:8px 10px}.vbar .bal{font-size:15px}
  .kpi{padding:9px 11px}.kpi .v{font-size:17px}
  table,tbody,tr,td{display:block;width:100%}
  thead,th{display:none}
  tr[data-sym]{border:1px solid var(--ln);margin:8px;background:#070707}
  td{display:flex;justify-content:space-between;align-items:center;text-align:right;border-bottom:1px solid #131313;padding:10px 12px}
  td.sym{justify-content:flex-start;font-size:15px;background:#0d0d0d}
  td[data-label]::before{content:attr(data-label);color:var(--dim);font-size:9px;text-transform:uppercase;letter-spacing:.1em}
  td:last-child{border-bottom:none}
  .ctd{gap:12px}
  .tg{padding:8px 13px;font-size:11px}
  .x{padding:7px 14px;font-size:12px}
  .mini{width:90px;padding:8px 9px;font-size:14px;text-align:right}
  .simr{gap:8px}.simr select,.simr input{padding:8px 9px;font-size:14px}.simr select{flex:1;min-width:110px}.simr input{flex:0 0 64px}.simr button{flex:1}
  .simrow{flex-wrap:wrap}.simrow .x{padding:6px 14px}
  .bxh .seg b{padding:4px 11px;font-size:11px}
  .fkeys{font-size:9px}.fk{padding:10px 2px;white-space:nowrap;letter-spacing:0}.fk b{font-size:10px}
  .adv summary{padding:11px 12px;font-size:11px}
  .gate form{width:88vw;max-width:320px}
}
