/* TradeAgent Desk — dark OLED terminal × iOS restraint. Data clear, never flashy. */
:root{
  --bg:#0A0B0F; --surface:#13151B; --surface2:#1A1D25; --border:#262A33; --border-soft:#1E222A;
  --text:#EAECEF; --text2:#9AA0AB; --muted:#6B7280;
  --accent:#0A84FF; --pos:#2EBD85; --neg:#F6465D; --warn:#F0B90B;
  --ui:'Inter',-apple-system,system-ui,sans-serif; --mono:'JetBrains Mono','SF Mono',ui-monospace,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:var(--ui);
  -webkit-font-smoothing:antialiased;font-size:14px}
.app{max-width:1280px;margin:0 auto;padding:0 24px 64px}

/* top bar */
.topbar{display:flex;align-items:center;justify-content:space-between;padding:20px 4px 16px;
  position:sticky;top:0;background:linear-gradient(var(--bg) 70%,transparent);z-index:20}
.brand{font-size:18px;letter-spacing:-.2px}
.brand-1{font-weight:700;color:var(--text)} .brand-2{font-weight:500;color:var(--accent);margin-left:6px}
.topright{display:flex;align-items:center;gap:12px}
.badges{display:flex;gap:8px}
.badge{font:600 10px/1 var(--mono);letter-spacing:.8px;padding:6px 9px;border-radius:6px;text-transform:uppercase}
.badge.demo{color:var(--warn);background:#F0B90B18;border:1px solid #F0B90B33}
.badge.live{color:var(--pos);background:#2EBD8518;border:1px solid #2EBD8533}
.badge.soft{color:var(--text2);background:var(--surface);border:1px solid var(--border)}
.badge.active{color:var(--pos);background:#2EBD8518;border:1px solid #2EBD8344;box-shadow:0 0 12px #2EBD8526}
.refresh-btn{display:flex;align-items:center;gap:7px;background:var(--surface);border:1px solid var(--border);
  border-radius:8px;color:var(--text2);font:600 12px var(--ui);padding:7px 12px;cursor:pointer;transition:all .18s}
.refresh-btn:hover{border-color:var(--accent);color:var(--text)}
.refresh-ic{width:15px;height:15px;display:block}

/* tabs */
.tabs{border-bottom:1px solid var(--border)!important}
.tab{background:transparent!important;border:0!important;color:var(--muted)!important;
  font:600 13px var(--ui)!important;padding:12px 18px!important;cursor:pointer}
.tab-on{color:var(--text)!important;border-bottom:2px solid var(--accent)!important;background:transparent!important}
.tabwrap{padding-top:22px;display:flex;flex-direction:column;gap:18px}

/* KPI cards */
.kpi-row{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.kpi{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px 16px 14px}
.kpi-label{font:600 10px var(--mono);letter-spacing:.8px;text-transform:uppercase;color:var(--muted)}
.kpi-value{font:600 24px/1.1 var(--mono);margin-top:10px;letter-spacing:-.5px;color:var(--text)}
.kpi-value.pos{color:var(--pos)} .kpi-value.neg{color:var(--neg)}
.kpi-sub{font:500 11px var(--ui);color:var(--text2);margin-top:6px}

/* cards */
.card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:18px}
.chart-card{padding:14px 10px 6px}
.card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;padding:0 6px}
.card-title{font:600 14px var(--ui);color:var(--text)}
.card-note{font:500 11px var(--ui);color:var(--muted)}
.card-foot{font:500 11px var(--ui);color:var(--muted);margin-top:10px}

/* search */
.search{background:var(--surface2);border:1px solid var(--border);border-radius:8px;color:var(--text);
  font:500 12px var(--mono);padding:8px 12px;width:240px;outline:none}
.search:focus{border-color:var(--accent)}
.search::placeholder{color:var(--muted)}

/* data table */
.dash-table-container{font-family:var(--mono)!important}
.dash-spreadsheet-container .dash-spreadsheet-inner table{border-collapse:separate}
.dash-header{background:var(--surface2)!important}
.dash-header .column-header-name{font:600 11px var(--ui)!important;color:var(--text2)!important;text-transform:uppercase;letter-spacing:.4px}
.dash-spreadsheet td,.dash-spreadsheet th{background:var(--surface)!important;border:0!important;
  border-bottom:1px solid var(--border-soft)!important;color:var(--text)!important;
  font:500 12.5px var(--mono)!important;padding:11px 10px!important}
.dash-spreadsheet tr:hover td{background:var(--surface2)!important}
.dash-spreadsheet .dash-filter input{background:var(--bg)!important;color:var(--text)!important;
  border:1px solid var(--border)!important;border-radius:6px!important;font:500 11px var(--mono)!important}
.dash-table-container .row--selected td{opacity:.4;text-decoration:line-through}
.dash-cell-value{cursor:default}
input[type="checkbox"]{accent-color:var(--accent);cursor:pointer;width:15px;height:15px}

/* select bar / dropdowns */
.selectbar{display:flex;gap:16px}
.sel{display:flex;flex-direction:column;gap:6px;min-width:240px}
.sel-label{font:600 10px var(--mono);letter-spacing:.8px;text-transform:uppercase;color:var(--muted)}
.dd .Select-control,.dd .Select-menu-outer{background:var(--surface)!important;border-color:var(--border)!important;
  color:var(--text)!important;border-radius:10px!important;font:500 13px var(--ui)}
.dd .Select-value-label,.dd .Select-placeholder{color:var(--text)!important}
.dd .VirtualizedSelectOption{background:var(--surface)!important;color:var(--text2)!important}
.dd .VirtualizedSelectFocusedOption{background:var(--surface2)!important;color:var(--text)!important}

/* evaluator */
.ev-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:4px;padding:2px 4px}
.ev-tk{font:700 22px var(--mono);letter-spacing:-.5px}
.ev-meta{font:500 12px var(--mono);color:var(--text2);margin-left:12px}
.ev-pnl{font:600 22px var(--mono);margin-left:8px} .ev-pnl.pos{color:var(--pos)} .ev-pnl.neg{color:var(--neg)}
.ev-ret{font:500 13px var(--mono)} .ev-ret.pos{color:var(--pos)} .ev-ret.neg{color:var(--neg)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;margin-top:14px}
.handoff{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-top:12px}
.hf{background:var(--surface2);border:1px solid var(--border-soft);border-radius:10px;padding:12px}
.hf-label{font:600 10px var(--mono);letter-spacing:.6px;text-transform:uppercase;color:var(--muted)}
.hf-value{font:600 15px var(--mono);margin-top:6px}
.thesis{font:400 13.5px/1.6 var(--ui);color:var(--text);margin:10px 0 8px}
.src{font:500 12px var(--mono);color:var(--text2);margin-top:12px} .muted{color:var(--muted)}
/* structured idea-detail (label : text rows, like the A/B/C block) */
.detail-list{display:flex;flex-direction:column;gap:1px;margin-top:12px;border-top:1px solid var(--border-soft)}
.detail-row{display:grid;grid-template-columns:170px 1fr;gap:18px;padding:11px 2px;border-bottom:1px solid var(--border-soft)}
.detail-label{font:600 11px var(--mono);letter-spacing:.4px;text-transform:uppercase;color:var(--accent);padding-top:1px}
.detail-text{font:400 13px/1.6 var(--ui);color:var(--text)}

/* A/B/C */
.seg .rc-radio-input,.seg label{font:600 11px var(--ui)!important;color:var(--text2);margin-right:14px;cursor:pointer}
.abc-scores{display:flex;gap:24px;align-items:center;margin:12px 4px}
.bscore{font:600 18px var(--mono);color:var(--accent);margin-left:8px}
.cfeed{font:400 12.5px/1.5 var(--ui);color:var(--text);margin-left:8px}
.pt-title{font:600 12px var(--ui);text-transform:uppercase;letter-spacing:.6px;margin-bottom:8px}
.pt-title.pos{color:var(--pos)} .pt-title.neg{color:var(--neg)} .pt-title.warn{color:var(--warn)}
.pt-list{margin:0;padding-left:16px} .pt-list li{font:400 12.5px/1.6 var(--ui);color:var(--text2);margin-bottom:7px}

/* aspect bars */
.aspect-list{display:flex;flex-direction:column;gap:11px;margin-top:14px}
.aspect{display:grid;grid-template-columns:160px 1fr 44px;align-items:center;gap:14px}
.aspect-name{font:500 12px var(--ui);color:var(--text2);text-transform:capitalize}
.aspect-track{height:7px;background:var(--surface2);border-radius:4px;overflow:hidden}
.aspect-fill{height:100%;border-radius:4px;transition:width .25s ease}
.aspect-val{font:600 13px var(--mono);text-align:right}
.empty{color:var(--muted);padding:40px;text-align:center}

@media (max-width:980px){.kpi-row{grid-template-columns:repeat(2,1fr)}.grid2,.grid3{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}