/* =====================================================================
   AURUM — Production UI
   ===================================================================== */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg:       #080d17;
  --panel:    #0f1623;
  --panel-2:  #131c2b;
  --border:   #1e2d42;
  --border-2: #253347;
  --text:     #e2e8f0;
  --muted:    #64748b;
  --muted-2:  #475569;
  --up:       #10b981;
  --down:     #ef4444;
  --gold:     #f59e0b;
  --gold-dim: #78491a;
  --blue:     #3b82f6;
  --purple:   #8b5cf6;

  --font:     "Inter", system-ui, sans-serif;
  --mono:     "JetBrains Mono", monospace;
  --radius:   8px;
  --radius-sm: 5px;
  --topbar-h: 52px;
}

html, body { height: 100%; background: var(--bg); color: var(--text); font-family: var(--font); font-size: 14px; overflow-x: hidden; }
.mono { font-family: var(--mono) !important; }
a { color: var(--blue); text-decoration: none; }

/* ── Scrollbar ─────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border-2); border-radius: 3px; }

/* =====================================================================
   TOP BAR
   ===================================================================== */
.topbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  height: var(--topbar-h);
  display: flex; align-items: center; gap: 0;
  background: var(--panel);
  border-bottom: 1px solid var(--border);
  padding: 0 16px;
}
.topbar-left  { display: flex; align-items: center; gap: 14px; flex-shrink: 0; }
.topbar-center{ flex: 1; display: flex; justify-content: center; }
.topbar-right { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }

/* Brand */
.brand { display: flex; align-items: center; gap: 7px; }
.brand-mark {
  width: 28px; height: 28px; background: var(--gold); color: #000;
  border-radius: 6px; display: grid; place-items: center;
  font-weight: 800; font-size: 13px; letter-spacing: -0.5px; flex-shrink: 0;
}
.brand-name { font-weight: 700; font-size: 15px; letter-spacing: 0.04em; }

/* Price block */
.price-block  { display: flex; align-items: baseline; gap: 7px; }
.price-symbol { font-size: 11px; color: var(--muted); font-weight: 600; letter-spacing: 0.06em; }
.price-val    { font-size: 18px; font-weight: 700; letter-spacing: -0.5px; }
.price-delta  { font-size: 12px; }
.price-delta.up   { color: var(--up); }
.price-delta.down { color: var(--down); }

/* Global symbol selector */
.symbol-selector      { position: relative; }
.symbol-selector-btn   {
  display: flex; align-items: center; gap: 5px; background: none;
  border: 1px solid var(--border); border-radius: 5px; padding: 3px 8px;
  cursor: pointer; color: var(--text);
}
.symbol-selector-btn:hover { border-color: var(--gold); }
.symbol-caret { font-size: 9px; color: var(--muted); }
.symbol-dropdown {
  position: absolute; top: calc(100% + 6px); left: 0; z-index: 210;
  background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius);
  min-width: 190px; padding: 4px; box-shadow: 0 8px 24px rgba(0,0,0,0.4);
}
.symbol-option {
  display: flex; align-items: center; gap: 8px; padding: 7px 10px;
  border-radius: 4px; cursor: pointer; font-size: 13px;
}
.symbol-option:hover  { background: rgba(255,255,255,0.06); }
.symbol-option.active { color: var(--gold); font-weight: 700; }
.symbol-option .mono  { margin-left: auto; color: var(--muted); font-size: 11px; }

/* Feed badge */
.feed-badge {
  display: flex; align-items: center; gap: 6px;
  padding: 4px 10px; border-radius: 20px;
  font-size: 11px; font-weight: 600; letter-spacing: 0.04em;
  border: 1px solid var(--border);
  background: transparent; transition: all 0.2s;
}
.feed-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); flex-shrink: 0; }
.feed-mode { font-size: 10px; color: var(--muted); font-weight: 400; }
.feed-badge.live   { border-color: rgba(16,185,129,0.4); background: rgba(16,185,129,0.08); color: var(--up); }
.feed-badge.live .feed-dot { background: var(--up); box-shadow: 0 0 6px var(--up); animation: pulse 2s infinite; }
.feed-badge.sim    { border-color: rgba(239,68,68,0.4);  background: rgba(239,68,68,0.08);  color: var(--down); }
.feed-badge.sim .feed-dot { background: var(--down); }
.feed-badge.checking .feed-dot { background: var(--gold); animation: pulse 1s infinite; }
@keyframes pulse { 0%,100%{ opacity:1; } 50%{ opacity:0.4; } }

/* Navigation */
.main-nav { display: flex; gap: 2px; background: var(--bg); border-radius: var(--radius); padding: 3px; }
.nav-btn {
  padding: 5px 16px; border-radius: 5px; border: none; cursor: pointer;
  font-size: 13px; font-weight: 500; font-family: var(--font);
  color: var(--muted); background: transparent; transition: all 0.15s;
}
.nav-btn:hover  { color: var(--text); background: var(--border); }
.nav-btn.active { color: var(--text); background: var(--panel-2); box-shadow: 0 1px 3px rgba(0,0,0,0.3); }

/* Account chips */
.acct-chip {
  display: flex; flex-direction: column; align-items: flex-end;
  padding: 3px 10px; border-radius: var(--radius-sm);
  border: 1px solid var(--border); background: var(--bg);
  line-height: 1.2;
}
.acct-chip.paper { border-color: rgba(245,158,11,0.3); background: rgba(245,158,11,0.05); }
.acct-chip-label { font-size: 9px; color: var(--muted); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; }
.acct-chip-val   { font-size: 13px; font-weight: 700; }
.acct-chip-val.up   { color: var(--up); }
.acct-chip-val.down { color: var(--down); }

/* Connection pill */
.conn-pill { display: flex; align-items: center; gap: 5px; font-size: 11px; color: var(--muted); }
.conn-dot  { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
.conn-dot.on { background: var(--up); box-shadow: 0 0 5px var(--up); }

/* =====================================================================
   MAIN CONTENT
   ===================================================================== */
.main-content { margin-top: var(--topbar-h); height: calc(100vh - var(--topbar-h)); overflow: hidden; }

/* Pages */
.page { display: none; height: 100%; overflow-y: auto; padding: 20px 24px; }
.page.active { display: block; }

/* Page header */
.page-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.page-header h1 { font-size: 20px; font-weight: 700; }

/* =====================================================================
   TRADING PAGE
   ===================================================================== */
#page-trading { padding: 0; overflow: hidden; }

.trading-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  height: 100%;
  overflow: hidden;
}

/* Chart column */
.chart-col { display: flex; flex-direction: column; overflow: hidden; border-right: 1px solid var(--border); }

.chart-header {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 14px; border-bottom: 1px solid var(--border);
  background: var(--panel); flex-shrink: 0;
}
.chart-state-badge {
  font-size: 11px; font-weight: 700; letter-spacing: 0.07em;
  padding: 3px 10px; border-radius: 20px;
  background: rgba(16,185,129,0.15); color: var(--up);
  border: 1px solid rgba(16,185,129,0.3);
}
.chart-state-badge.paused   { background: rgba(239,68,68,0.15); color: var(--down); border-color: rgba(239,68,68,0.3); }
.chart-state-badge.caution  { background: rgba(245,158,11,0.15); color: var(--gold); border-color: rgba(245,158,11,0.3); }
.chart-state-badge.recovery { background: rgba(139,92,246,0.15); color: var(--purple); border-color: rgba(139,92,246,0.3); }
.chart-msg       { font-size: 12px; color: var(--muted); flex: 1; }
.chart-header-right { flex-shrink: 0; display:flex; align-items:center; gap:10px; }
.chart-spread    { font-size: 10px; color: var(--muted-2); }
.chart-clock     { font-size: 11px; color: var(--muted); letter-spacing: 0.05em; }

/* ── Quick Trade Bar ────────────────────────────────────────────────────── */
.qt-bar { display:flex; align-items:center; gap:8px; padding:6px 10px; background:var(--panel); border-bottom:1px solid var(--border); flex-shrink:0; }
.qt-buy  { padding:5px 18px; background:#16a34a; color:#fff; border:none; border-radius:5px; font-size:13px; font-weight:800; cursor:pointer; letter-spacing:0.05em; transition:opacity 0.1s; font-family:var(--font); }
.qt-sell { padding:5px 18px; background:#dc2626; color:#fff; border:none; border-radius:5px; font-size:13px; font-weight:800; cursor:pointer; letter-spacing:0.05em; transition:opacity 0.1s; font-family:var(--font); }
.qt-ai-btn { padding:5px 14px; background:linear-gradient(135deg,#7c3aed,#4f46e5); color:#fff; border:none; border-radius:5px; font-size:12px; font-weight:700; cursor:pointer; font-family:var(--font); transition:opacity 0.1s; white-space:nowrap; }
.qt-buy:hover,.qt-sell:hover,.qt-ai-btn:hover { opacity:0.85; }
.qt-buy:disabled,.qt-sell:disabled,.qt-ai-btn:disabled { opacity:0.5; cursor:not-allowed; }
.qt-ctrl { display:flex; align-items:center; gap:5px; flex-shrink:0; }
.qt-ctrl-lbl { font-size:10px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; white-space:nowrap; }
.qt-sl-est { margin-left:4px; font-size:10px; color:#f87171; font-family:var(--mono); font-weight:600; white-space:nowrap; }
.qt-tp-est { margin-left:4px; font-size:10px; color:#4ade80; font-family:var(--mono); font-weight:600; white-space:nowrap; }
.qt-stepper { display:flex; align-items:center; border:1px solid var(--border); border-radius:4px; overflow:hidden; }
.qt-step-btn { width:20px; height:22px; background:var(--input); border:none; color:var(--muted); font-size:15px; cursor:pointer; line-height:1; padding:0; flex-shrink:0; font-family:var(--font); transition:background .1s; }
.qt-step-btn:hover { background:var(--border); color:var(--text); }
.qt-step-val { width:50px; height:22px; background:var(--bg); border:none; border-left:1px solid var(--border); border-right:1px solid var(--border); color:var(--text); font-size:11px; text-align:center; font-family:var(--mono); padding:0; }
.qt-step-val:focus { outline:none; background:rgba(255,255,255,.05); }
.qt-step-val::-webkit-outer-spin-button,.qt-step-val::-webkit-inner-spin-button { -webkit-appearance:none; }
.qt-sl-val { color:#f87171 !important; }
.qt-tp-val { color:#4ade80 !important; }
.qt-chips { display:flex; gap:3px; }
.qt-chip { padding:2px 6px; background:var(--input); border:1px solid var(--border); color:var(--muted); border-radius:3px; font-size:10px; cursor:pointer; font-family:var(--mono); line-height:1.5; transition:all .1s; }
.qt-chip:hover { border-color:rgba(255,255,255,.3); color:var(--text); }
.qt-chip.active { background:rgba(99,102,241,.18); border-color:#6366f1; color:#a5b4fc; }
.qt-vsep { width:1px; height:26px; background:var(--border); flex-shrink:0; }
.qt-status { font-size:11px; font-family:var(--mono); color:var(--muted); margin-left:4px; }
.qt-status.ok  { color:var(--up); }
.qt-status.err { color:var(--down); }
/* qt-actions group — BUY/SELL + AI buttons */
.qt-actions { display:flex; align-items:center; gap:6px; flex-shrink:0; }
/* Chips and labels visible by default (large monitors ≥1600px) */
.qt-chips-hide { display:flex; }
.qt-btn-label  { display:inline; }

/* ── Responsive breakpoints ─────────────────────────────────────── */

/* Large desktop ≤1900px: hide preset chips (keep all else) */
@media (max-width:1900px) {
  .qt-chips-hide { display:none; }
}

/* Laptop ≤1500px:
   - Hide SL/TP price estimates (they're wide, especially for BTC)
   - Move actions (BUY/SELL/AI) to front so they're never clipped
   - Add right border to visually separate from controls that follow */
@media (max-width:1500px) {
  .qt-sl-est, .qt-tp-est { display:none; }
  .qt-actions { order:-1; border-right:1px solid var(--border); padding-right:8px; }
  .qt-vsep-act { display:none; }
}

/* Tablet ≤960px: icon-only buttons to save width */
@media (max-width:960px) {
  .qt-btn-label { display:none; }
  .qt-buy  { padding:5px 10px; }
  .qt-sell { padding:5px 10px; }
  .qt-ai-btn { padding:5px 8px; }
}

/* Mobile ≤640px: wrap to two rows, allow horizontal scroll as fallback */
@media (max-width:640px) {
  .qt-bar { flex-wrap:wrap; overflow-x:auto; gap:5px; padding:5px 8px; }
  .qt-ctrl { flex-shrink:0; }
  .qt-step-val { width:36px; }
  .qt-vsep { display:none; }
  .qt-actions { border-right:none; padding-right:0; flex-basis:100%; }
}

.chart-wrap { flex: 1; min-height: 80px; position: relative; }

/* ── Trade Alert Widgets (draggable, on-chart) ───────────────────── */
.trade-alert-widget {
  position: absolute; top: 10px; left: 10px;
  z-index: 50; display: flex; align-items: center; gap: 8px;
  min-width: 300px; max-width: 440px;
  padding: 8px 10px 8px 6px; border-radius: 8px;
  backdrop-filter: blur(12px);
  box-shadow: 0 4px 24px rgba(0,0,0,0.55);
  border: 1px solid rgba(255,255,255,0.08);
  animation: taw-in 0.2s ease;
  user-select: none;
}
.trade-alert-widget.exit-alert { background: rgba(239,68,68,0.2);   border-color: rgba(239,68,68,0.5);   top: 10px;  left: 10px; }
.trade-alert-widget.sl-alert   { background: rgba(251,146,60,0.2);  border-color: rgba(251,146,60,0.5);  top: 58px;  left: 10px; }
.trade-alert-widget.sl-hold    { background: rgba(34,197,94,0.15);  border-color: rgba(34,197,94,0.45);  top: 58px;  left: 10px; }
.trade-alert-widget.tp-alert   { background: rgba(245,158,11,0.15); border-color: rgba(245,158,11,0.45); top: 106px; left: 10px; }
.trade-alert-widget.tp-hold    { background: rgba(34,197,94,0.15);  border-color: rgba(34,197,94,0.45);  top: 106px; left: 10px; }
.trade-alert-widget.tp-exit    { background: rgba(239,68,68,0.18);  border-color: rgba(239,68,68,0.45);  top: 106px; left: 10px; }
.sl-hold .taw-title   { color: #86efac; }
.tp-alert .taw-title  { color: #fbbf24; }
.tp-hold  .taw-title  { color: #86efac; }
.tp-exit  .taw-title  { color: #fca5a5; }
.taw-drag-handle {
  cursor: grab; color: #475569; font-size: 16px; padding: 0 4px; flex-shrink: 0; line-height: 1;
}
.taw-drag-handle:active { cursor: grabbing; }
.taw-icon { font-size: 18px; flex-shrink: 0; }
.taw-body { flex: 1; min-width: 0; }
.taw-title { font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; margin-bottom: 2px; }
.exit-alert .taw-title { color: #fca5a5; }
.sl-alert   .taw-title { color: #fdba74; }
.taw-msg { font-size: 11px; color: #cbd5e1; line-height: 1.4; }
.taw-close {
  flex-shrink: 0; background: none; border: none; color: #475569;
  cursor: pointer; font-size: 13px; padding: 2px 4px; line-height: 1;
}
.taw-close:hover { color: #94a3b8; }
@keyframes taw-in {
  from { opacity: 0; translateY(-6px); }
  to   { opacity: 1; }
}

.tf-slider {
  display: flex; gap: 3px; padding: 3px 6px;
  overflow-x: auto; overflow-y: hidden;
  scrollbar-width: none; /* Firefox */
  -webkit-overflow-scrolling: touch;
  white-space: nowrap;
}
.tf-slider::-webkit-scrollbar { display: none; }

.tf-btn {
  flex-shrink: 0;
  padding: 2px 8px; font-size: 11px; font-weight: 600;
  border-radius: 3px; border: 1px solid #334155;
  background: #1e293b; color: #94a3b8; cursor: pointer;
  transition: background 0.1s, color 0.1s;
}
.tf-btn:hover { background: #273549; color: #e2e8f0; }
.tf-btn.active { background: #1e3a5f; border-color: #3b82f6; color: #e2e8f0; }

.candle-timer {
  position: absolute;
  bottom: 28px;
  left: 8px;
  z-index: 10;
  background: rgba(15,23,42,0.85);
  border: 1px solid var(--gold);
  border-radius: 4px;
  padding: 2px 7px;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  color: var(--gold);
  letter-spacing: 0.05em;
  pointer-events: none;
  backdrop-filter: blur(2px);
  transition: color 0.3s, border-color 0.3s;
}

.pos-drag-handle { height: 5px; background: var(--border); cursor: row-resize; flex-shrink: 0; position: relative; transition: background 0.15s; }
.pos-drag-handle:hover, .pos-drag-handle.dragging { background: var(--gold); }
.pos-drag-handle::after { content: ''; position: absolute; left: 50%; top: 1px; transform: translateX(-50%); width: 40px; height: 3px; background: rgba(255,255,255,0.2); border-radius: 2px; }

.positions-card { flex-shrink: 0; border-top: none; background: var(--panel); height: 180px; min-height: 60px; max-height: 60vh; overflow: hidden; display: flex; flex-direction: column; }
.pos-tabs { display: flex; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.pos-tab  { padding: 8px 16px; font-size: 12px; font-weight: 500; cursor: pointer; border: none; background: none; color: var(--muted); font-family: var(--font); border-bottom: 2px solid transparent; }
.pos-tab.active { color: var(--text); border-bottom-color: var(--gold); }

/* Log column */
.log-col { display: flex; flex-direction: column; overflow: hidden; background: var(--panel); }
.log-header { display: flex; align-items: center; justify-content: space-between; padding: 6px 10px; border-bottom: 1px solid var(--border); flex-shrink: 0; gap: 6px; }
.log-title  { font-size: 12px; font-weight: 600; letter-spacing: 0.03em; }
.log-col-tabs { display: flex; gap: 2px; flex-shrink: 0; }
.log-col-tab { padding: 3px 10px; border-radius: 4px; border: 1px solid var(--border); background: transparent; color: var(--muted); font-size: 11px; font-weight: 600; cursor: pointer; transition: all .15s; }
.log-col-tab.active { background: rgba(245,158,11,0.12); color: var(--gold); border-color: rgba(245,158,11,0.35); }
.log-col-tab:hover:not(.active) { background: rgba(255,255,255,0.04); color: var(--text); }
/* Live Trade Log */
/* ── News Panel ─────────────────────────────────────────────────────── */
a.news-item {
  display: block; padding: 8px 10px;
  border-bottom: 1px solid rgba(30,45,66,0.6);
  text-decoration: none; cursor: pointer;
  transition: background .15s;
}
a.news-item:hover { background: rgba(255,255,255,0.04); }
a.news-item.important { border-left: 2px solid #f59e0b; }
.news-meta { display: flex; justify-content: space-between; align-items: center; margin-bottom: 3px; gap: 4px; }
.news-src  { font-size: 9px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.news-ago  { font-size: 9px; color: var(--muted); }
.news-imp-badge { font-size: 8px; font-weight:700; color:#f59e0b; background:rgba(245,158,11,.15); border:1px solid rgba(245,158,11,.3); border-radius:3px; padding:1px 4px; letter-spacing:.04em; }
.news-title{ font-size: 11px; color: #e2e8f0; line-height: 1.4; }
.log-col-tab-badge { display:inline-block; background:#ef4444; color:#fff; border-radius:8px; font-size:8px; font-weight:700; padding:1px 5px; margin-left:3px; vertical-align:middle; animation: badge-pulse 1.5s infinite; }
@keyframes badge-pulse { 0%,100%{opacity:1} 50%{opacity:.5} }

/* ── News Detail Popup ───────────────────────────────────────────────── */
.news-popup {
  position: fixed; bottom: 80px; right: 320px;
  width: 340px; z-index: 200;
  background: rgba(10,14,26,0.97); border: 1px solid rgba(245,158,11,0.35);
  border-radius: 10px; box-shadow: 0 8px 32px rgba(0,0,0,0.7);
  backdrop-filter: blur(14px);
  display: flex; flex-direction: column;
  animation: taw-in .2s ease; user-select: none;
}
.news-popup-header {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px; border-bottom: 1px solid rgba(255,255,255,0.07);
  cursor: grab; flex-shrink: 0;
}
.news-popup-header:active { cursor: grabbing; }
.news-popup-drag  { font-size: 11px; color: var(--muted); flex: 1; font-weight:600; letter-spacing:.03em; }
.news-popup-impact{ font-size: 9px; font-weight:700; padding:2px 7px; border-radius:4px; letter-spacing:.05em; }
.news-popup-title { font-size: 11px; color: #e2e8f0; padding: 8px 12px; line-height:1.5; border-bottom:1px solid rgba(255,255,255,0.06); flex-shrink:0; }
.news-popup-loading{ font-size:11px; color:var(--muted); padding:14px 12px; text-align:center; }
.news-popup-body  { padding: 0; }
.news-popup-section{ padding: 8px 12px; border-bottom: 1px solid rgba(255,255,255,0.05); font-size:11px; color:#cbd5e1; line-height:1.5; }
.news-popup-lang  { font-size: 9px; font-weight:700; color:var(--muted); letter-spacing:.05em; text-transform:uppercase; margin-bottom:4px; }
.en-section { color: #e2e8f0; }
.hi-section { color: #c4b5fd; font-style: italic; }
.news-popup-footer{ padding: 8px 12px; flex-shrink:0; }
.news-popup-read-btn {
  display:block; text-align:center; padding:6px; border-radius:6px;
  background:rgba(245,158,11,0.12); border:1px solid rgba(245,158,11,0.3);
  color:#fbbf24; font-size:11px; font-weight:600; text-decoration:none;
  transition: background .15s;
}
.news-popup-read-btn:hover { background:rgba(245,158,11,0.22); }

.ltl-row { display: flex; flex-direction: column; gap: 2px; padding: 7px 10px; border-bottom: 1px solid rgba(30,45,66,0.5); font-size: 11px; }
.ltl-row:hover { background: rgba(255,255,255,0.03); }
.ltl-row.trade-win  { border-left: 2px solid var(--up); }
.ltl-row.trade-loss { border-left: 2px solid var(--down); }
.ltl-row.signal-row { border-left: 2px solid var(--blue); }
.ltl-row.filtered-row { border-left: 2px solid var(--muted); opacity: .7; }
.ltl-top { display: flex; gap: 6px; align-items: center; }
.ltl-time { color: var(--muted-2); font-family: var(--mono); font-size: 10px; flex-shrink: 0; }
.ltl-badge { font-size: 9px; font-weight: 700; padding: 1px 5px; border-radius: 3px; text-transform: uppercase; }
.ltl-badge.buy  { background: rgba(16,185,129,.15); color: var(--up); }
.ltl-badge.sell { background: rgba(239,68,68,.15); color: var(--down); }
.ltl-badge.sig  { background: rgba(59,130,246,.15); color: var(--blue); }
.ltl-badge.filt { background: rgba(100,116,139,.15); color: var(--muted); }
.ltl-pnl { font-family: var(--mono); font-weight: 700; font-size: 12px; margin-left: auto; }
.ltl-detail { font-size: 10px; color: var(--muted); font-family: var(--mono); }
.lf {
  padding: 2px 7px; border-radius: 10px; border: 1px solid var(--border);
  font-size: 10px; cursor: pointer; background: none; color: var(--muted); font-family: var(--font);
}
.lf.on { background: var(--border); color: var(--text); }
.lf-clear { color: var(--down) !important; border-color: rgba(239,68,68,0.3) !important; margin-left: 4px; }
.lf-clear:hover { background: rgba(239,68,68,0.1) !important; }
.cred-saved-bar { display: flex; align-items: center; justify-content: space-between; padding: 8px 0; color: var(--up); font-size: 12px; }
.btn-xs { padding: 2px 8px !important; font-size: 11px !important; }
.log-body { flex: 1; overflow-y: auto; padding: 4px 0; font-size: 11.5px; }
.log-body .row { display: flex; gap: 6px; padding: 4px 12px; border-bottom: 1px solid rgba(30,45,66,0.5); line-height: 1.4; }
.log-body .row:hover { background: rgba(255,255,255,0.03); }
.log-body .t    { color: var(--muted-2); font-family: var(--mono); flex-shrink: 0; font-size: 10px; padding-top: 1px; }
.log-body .who  { font-size: 10px; font-weight: 600; letter-spacing: 0.04em; flex-shrink: 0; min-width: 50px; padding-top: 1px; }
.log-body .msg  { color: var(--text); flex: 1; word-break: break-word; }
.log-body .who.market   { color: var(--blue); }
.log-body .who.analyst  { color: var(--purple); }
.log-body .who.risk     { color: var(--gold); }
.log-body .who.execution{ color: var(--up); }
.log-body .who.system   { color: var(--muted); }
.log-body .row.signal   { background: rgba(59,130,246,0.06); }
.log-body .row.trade    { background: rgba(16,185,129,0.06); }
.log-body .row.error    { background: rgba(239,68,68,0.06); }
.log-body .row.warn     { background: rgba(245,158,11,0.06); }

/* Mode pill in top bar */
.mode-pill {
  padding: 4px 12px; border-radius: 20px; font-size: 11px;
  font-weight: 700; letter-spacing: 0.06em; border: 1px solid var(--border);
}
.mode-pill.paper { background: rgba(245,158,11,0.12); color: var(--gold); border-color: rgba(245,158,11,0.3); }
.mode-pill.live  { background: rgba(239,68,68,0.12);  color: var(--down); border-color: rgba(239,68,68,0.3); animation: danger-pulse 2s infinite; }

/* Single account card in Analytics */
.an-account-single {
  display: flex; justify-content: space-between; align-items: center;
  background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 16px 20px; margin-bottom: 16px;
  border-left: 4px solid var(--gold);
}
.an-account-single.live-mode { border-left-color: var(--down); }
.aas-left  { display: flex; flex-direction: column; gap: 4px; }
.aas-right { display: flex; gap: 20px; align-items: center; }
.aas-mode    { font-size: 11px; font-weight: 700; letter-spacing: 0.08em; color: var(--gold); text-transform: uppercase; }
.aas-mode.live-mode { color: var(--down); }
.aas-balance { font-size: 28px; font-weight: 800; }
.aas-sub     { font-size: 12px; color: var(--muted); }
.aas-stat  { display: flex; flex-direction: column; gap: 2px; }
.aas-label { font-size: 10px; color: var(--muted); font-weight: 600; text-transform: uppercase; }
.aas-val   { font-size: 12px; font-weight: 600; }

/* =====================================================================
   ANALYTICS PAGE
   ===================================================================== */
#page-analytics { overflow-y: auto; }
.an-select { padding: 6px 10px; background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius-sm); color: var(--text); font-family: var(--font); font-size: 12px; }

/* Account row */
.an-account-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 16px; }
.an-account-card { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px 18px; }
.an-account-card.xm    { border-color: rgba(59,130,246,0.3); background: rgba(59,130,246,0.04); }
.an-account-card.paper { border-color: rgba(245,158,11,0.3); background: rgba(245,158,11,0.04); }
.aac-label { font-size: 11px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; }
.aac-val   { font-size: 26px; font-weight: 800; margin: 4px 0 2px; }
.aac-sub   { font-size: 11px; color: var(--muted); }

/* KPI grid */
.an-stats-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin-bottom: 16px; }
.an-kpi { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 14px; }
.an-kpi.green { border-color: rgba(16,185,129,0.3); }
.an-kpi.red   { border-color: rgba(239,68,68,0.3); }
.an-kpi.purple{ border-color: rgba(139,92,246,0.3); }
.kpi-label { font-size: 10px; color: var(--muted); font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; }
.kpi-val   { font-size: 18px; font-weight: 800; margin-top: 3px; }

/* Two column */
.an-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 16px; }

/* Early exit */
.ee-row  { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 10px; }
.ee-item { padding: 12px 14px; border-radius: var(--radius-sm); }
.ee-item.green { background: rgba(16,185,129,0.08); border: 1px solid rgba(16,185,129,0.2); }
.ee-item.red   { background: rgba(239,68,68,0.08);  border: 1px solid rgba(239,68,68,0.2); }
.ee-label { font-size: 10px; color: var(--muted); font-weight: 600; text-transform: uppercase; }
.ee-val   { font-size: 20px; font-weight: 800; margin: 4px 0; }
.ee-sub   { font-size: 10px; color: var(--muted); }
.ee-verdict { font-size: 12px; color: var(--text); padding: 8px 10px; background: var(--bg); border-radius: var(--radius-sm); border: 1px solid var(--border); line-height: 1.5; }

/* Best/worst hours */
.bw-row  { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.bw-item { padding: 12px 14px; border-radius: var(--radius-sm); font-size: 13px; line-height: 1.6; }
.bw-item.green { background: rgba(16,185,129,0.08); border: 1px solid rgba(16,185,129,0.2); }
.bw-item.red   { background: rgba(239,68,68,0.08);  border: 1px solid rgba(239,68,68,0.2); }

/* Hourly heatmap */
.hourly-grid { display: grid; grid-template-columns: repeat(24, 1fr); gap: 3px; margin-bottom: 8px; }
.hourly-cell { border-radius: 4px; padding: 6px 3px; text-align: center; cursor: pointer; transition: opacity 0.15s; position: relative; }
.hourly-cell:hover { opacity: 0.85; }
.hourly-cell .hc-hour { font-size: 9px; color: var(--muted); }
.hourly-cell .hc-pnl  { font-size: 9px; font-weight: 700; margin-top: 2px; }
.hourly-cell .hc-cnt  { font-size: 8px; color: rgba(255,255,255,0.5); }
.hourly-cell.positive { background: rgba(16,185,129,0.2); border: 1px solid rgba(16,185,129,0.3); }
.hourly-cell.negative { background: rgba(239,68,68,0.2);  border: 1px solid rgba(239,68,68,0.3); }
.hourly-cell.empty    { background: var(--panel); border: 1px solid var(--border); }
.hourly-legend { display: flex; gap: 12px; font-size: 10px; }
.hl-item { display: flex; align-items: center; gap: 5px; color: var(--muted); }
.hl-item::before { content: ""; width: 10px; height: 10px; border-radius: 2px; }
.hl-item.green::before { background: rgba(16,185,129,0.3); }
.hl-item.red::before   { background: rgba(239,68,68,0.3); }
.hl-item.muted::before { background: var(--panel); border: 1px solid var(--border); }

/* Daily table */
.daily-pnl-pos { color: var(--up); font-weight: 600; }
.daily-pnl-neg { color: var(--down); font-weight: 600; }

/* Strategy Advisor */
.advisor-status { font-size: 11px; color: var(--muted); }

.advisor-summary {
  background: rgba(245,158,11,0.06); border: 1px solid rgba(245,158,11,0.2);
  border-radius: var(--radius-sm); padding: 14px 16px; margin-bottom: 16px;
}
.as-health { font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 6px; }
.as-health.excellent { color: var(--up); }
.as-health.good      { color: #34d399; }
.as-health.needs_attention { color: var(--gold); }
.as-health.poor      { color: var(--down); }
.as-text  { font-size: 13px; line-height: 1.6; color: var(--text); margin-bottom: 8px; }
.as-top   { font-size: 12px; color: var(--gold); font-weight: 600; padding: 6px 10px; background: rgba(245,158,11,0.1); border-radius: var(--radius-sm); }

.advisor-recs { display: flex; flex-direction: column; gap: 10px; }

.rec-card {
  background: var(--panel-2); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 14px 16px;
  border-left: 3px solid var(--border);
  transition: border-color 0.15s;
}
.rec-card.critical { border-left-color: var(--down); }
.rec-card.high     { border-left-color: var(--gold); }
.rec-card.medium   { border-left-color: var(--blue); }
.rec-card.low      { border-left-color: var(--muted); }

.rec-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.rec-priority { font-size: 10px; font-weight: 700; letter-spacing: 0.06em; padding: 2px 8px; border-radius: 10px; text-transform: uppercase; }
.rec-priority.critical { background: rgba(239,68,68,0.15); color: var(--down); }
.rec-priority.high     { background: rgba(245,158,11,0.15); color: var(--gold); }
.rec-priority.medium   { background: rgba(59,130,246,0.15); color: var(--blue); }
.rec-priority.low      { background: rgba(100,116,139,0.15); color: var(--muted); }
.rec-category { font-size: 10px; color: var(--muted); font-weight: 600; text-transform: uppercase; }
.rec-title  { font-size: 13px; font-weight: 700; margin-left: auto; flex: 1; }

.rec-body { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; font-size: 12px; }
.rec-finding  { color: var(--muted); line-height: 1.5; }
.rec-finding strong { color: var(--text); }
.rec-suggest  { background: rgba(16,185,129,0.06); border: 1px solid rgba(16,185,129,0.2); border-radius: var(--radius-sm); padding: 8px 10px; line-height: 1.5; }

.rec-change { display: flex; align-items: center; gap: 6px; margin-top: 8px; font-size: 11px; }
.rec-param  { background: var(--bg); border: 1px solid var(--border); border-radius: 4px; padding: 2px 8px; font-family: var(--mono); font-size: 10px; }
.rec-arrow  { color: var(--muted); }
.rec-from   { color: var(--down); font-family: var(--mono); font-size: 10px; }
.rec-to     { color: var(--up);   font-family: var(--mono); font-size: 10px; font-weight: 700; }
.rec-impact { font-size: 10px; color: var(--muted); margin-left: auto; }
.rec-confidence { font-size: 10px; color: var(--muted); }

/* =====================================================================
   STRATEGIES PAGE
   ===================================================================== */
.strat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }

.strat-card {
  background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 14px 16px; cursor: pointer; transition: border-color 0.15s;
}
.strat-card:hover  { border-color: var(--border-2); }
.strat-card.selected { border-color: var(--gold); }

.sc-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.sc-name { font-size: 14px; font-weight: 600; }
.sc-status { font-size: 10px; font-weight: 700; letter-spacing: 0.06em; padding: 2px 8px; border-radius: 10px; }
.sc-status.running  { background: rgba(16,185,129,0.15); color: var(--up);  border: 1px solid rgba(16,185,129,0.3); }
.sc-status.stopped  { background: rgba(100,116,139,0.15); color: var(--muted); border: 1px solid var(--border); }
.sc-status.scheduled{ background: rgba(59,130,246,0.15); color: var(--blue); border: 1px solid rgba(59,130,246,0.3); }

.sc-meta { font-size: 11.5px; color: var(--muted); line-height: 1.6; margin-bottom: 10px; }
.sc-meta b { color: var(--text); font-weight: 600; }

.sc-bot-state { display: inline-flex; align-items: center; gap: 4px; font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 10px; margin-bottom: 8px; }
.sc-bot-state.active   { background: rgba(16,185,129,0.1); color: var(--up); }
.sc-bot-state.caution  { background: rgba(245,158,11,0.1); color: var(--gold); }
.sc-bot-state.paused   { background: rgba(239,68,68,0.1);  color: var(--down); }
.sc-bot-state.recovery { background: rgba(139,92,246,0.1); color: var(--purple); }
.sc-bot-state.high_conf{ background: rgba(59,130,246,0.1); color: var(--blue); }

.sc-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.sc-conf-row { display:flex; align-items:center; gap:10px; padding:6px 0; border-top:1px solid rgba(255,255,255,0.05); margin-top:6px; flex-wrap:wrap; }
.sc-conf-label { font-size:10px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; white-space:nowrap; }
.sc-conf-slider-wrap { display:flex; align-items:center; gap:6px; }
.sc-conf-slider { -webkit-appearance:none; appearance:none; width:140px; height:4px; border-radius:2px; outline:none; cursor:pointer; background: linear-gradient(to right, var(--gold) 0%, var(--gold) var(--pct, 0%), var(--border) var(--pct, 0%)); }
.sc-conf-slider::-webkit-slider-thumb { -webkit-appearance:none; width:14px; height:14px; border-radius:50%; background:var(--gold); cursor:pointer; border:2px solid var(--bg); }
.sc-conf-val { font-size:12px; font-weight:700; color:var(--gold); font-family:var(--mono); min-width:34px; }
.sc-conf-desc { font-size:11px; color:var(--muted); font-style:italic; }
.guard-on  { color: var(--up)   !important; border-color: rgba(16,185,129,0.4) !important; }
.guard-off { color: var(--gold) !important; border-color: rgba(245,158,11,0.4) !important; background: rgba(245,158,11,0.07) !important; }

/* ── Trading Sessions (strategy card) ──────────────────────────────────── */
.sc-sessions { padding: 8px 0 2px; border-top: 1px solid rgba(255,255,255,0.05); margin-top: 6px; }
.sc-sessions-title {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
  color: var(--muted); margin-bottom: 6px;
}
.sc-sessions-restore {
  background: none; border: 1px solid var(--gold); color: var(--gold);
  border-radius: 4px; padding: 2px 7px; font-size: 9px; font-weight: 700;
  text-transform: none; letter-spacing: 0; cursor: pointer; transition: background .15s ease;
}
.sc-sessions-restore:hover { background: rgba(255, 200, 50, 0.12); }

.session-block { padding: 4px 0; border-bottom: 1px solid rgba(255,255,255,0.04); }
.session-block:last-child { border-bottom: none; }
.session-main { display: flex; align-items: center; gap: 8px; }
.session-label { font-size: 12px; color: var(--text); min-width: 58px; font-weight: 600; }
.session-range { font-size: 11px; color: var(--muted); font-family: var(--mono); flex: 1; }
.session-customize-btn {
  background: none; border: none; color: var(--gold); font-size: 10px;
  cursor: pointer; padding: 2px 4px; opacity: .75; transition: opacity .15s ease;
}
.session-customize-btn:hover { opacity: 1; }

.session-custom { display: flex; align-items: center; gap: 10px; padding: 6px 0 2px 40px; flex-wrap: wrap; }
.session-use-default { display: flex; align-items: center; gap: 5px; font-size: 11px; color: var(--muted); cursor: pointer; }
.session-time-row { display: flex; align-items: center; gap: 6px; }
.session-sep { color: var(--muted); font-size: 11px; }
.session-custom input[type="time"] {
  background: var(--bg); border: 1px solid var(--border); color: var(--text);
  border-radius: 4px; padding: 2px 4px; font-size: 11px; font-family: var(--mono);
  color-scheme: dark;
}
.session-toggle { position: relative; display: inline-block; width: 32px; height: 18px; flex: 0 0 auto; cursor: pointer; }
.session-toggle input { position: absolute; opacity: 0; width: 0; height: 0; }
.session-toggle-track { position: absolute; inset: 0; background: var(--border); border-radius: 999px; transition: background .15s ease; }
.session-toggle-track::before {
  content: ""; position: absolute; width: 14px; height: 14px; left: 2px; top: 2px;
  background: var(--text); border-radius: 50%; transition: transform .15s ease;
}
.session-toggle input:checked + .session-toggle-track { background: var(--gold); }
.session-toggle input:checked + .session-toggle-track::before { transform: translateX(14px); background: #1a1200; }

/* ── Closed trade SL/TP schedule (expandable row) ──────────────────────── */
.sched-row td { background: var(--panel-2); padding: 8px 12px; }
.sched-list { display: flex; flex-direction: column; gap: 4px; }
.sched-entry { font-size: 11.5px; color: var(--text); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.sched-entry b { color: var(--gold); font-size: 10px; letter-spacing: .03em; }
.sched-empty { color: var(--muted); font-style: italic; }
.rl-achieved     { background: rgba(16,185,129,0.1); border: 1px solid rgba(16,185,129,0.3); color: var(--up); padding: 8px 12px; border-radius: 6px; font-size: 13px; font-weight: 600; }
.rl-not-achieved { background: rgba(245,158,11,0.1); border: 1px solid rgba(245,158,11,0.3); color: var(--gold); padding: 8px 12px; border-radius: 6px; font-size: 13px; }
.rl-table th, .rl-table td { padding: 5px 8px; border-bottom: 1px solid var(--border); text-align: left; }
.rl-table thead tr { background: var(--bg); }

/* ── RL Loop Log Popup ──────────────────────────────────────────────────── */
.rl-log-overlay { position: fixed; bottom: 24px; right: 24px; z-index: 8000; display: flex; }
.rl-log-box     { width: 480px; max-height: 420px; background: var(--panel); border: 1px solid var(--border-2); border-radius: 10px; box-shadow: 0 12px 40px rgba(0,0,0,0.5); display: flex; flex-direction: column; overflow: hidden; }
.rl-log-header  { display: flex; justify-content: space-between; align-items: flex-start; padding: 12px 14px 10px; border-bottom: 1px solid var(--border); background: rgba(245,158,11,0.06); }
.rl-log-title   { font-size: 13px; font-weight: 700; color: var(--gold); }
.rl-log-sub     { font-size: 10px; color: var(--muted); margin-top: 2px; max-width: 380px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rl-log-close   { background: none; border: none; color: var(--muted); cursor: pointer; font-size: 14px; padding: 0 2px; line-height: 1; }
.rl-log-close:hover { color: var(--text); }
.rl-log-body    { flex: 1; overflow-y: auto; padding: 8px 12px; font-family: var(--mono); font-size: 11px; display: flex; flex-direction: column; gap: 2px; }
.rl-log-row     { color: var(--muted); }
.rl-log-row.ok  { color: var(--up); font-weight: 600; }
.rl-log-row.warn{ color: var(--gold); }

/* ── AI Chart Analyzer Popup ─────────────────────────────────────────────── */
.aia-overlay { position:fixed; right:16px; top:70px; z-index:8500; display:flex; pointer-events:none; opacity:0; transform:translateX(20px); transition:opacity 0.28s,transform 0.28s; }
.aia-overlay.open { opacity:1; transform:translateX(0); pointer-events:all; }
.aia-box { width:340px; max-height:calc(100vh - 90px); background:var(--panel); border:1px solid var(--border-2); border-radius:12px; box-shadow:0 16px 60px rgba(0,0,0,0.6); display:flex; flex-direction:column; overflow:hidden; }
.aia-body { flex:1; overflow-y:auto; overscroll-behavior:contain; }
.aia-body::-webkit-scrollbar { width:4px; }
.aia-body::-webkit-scrollbar-track { background:transparent; }
.aia-body::-webkit-scrollbar-thumb { background:rgba(255,255,255,0.12); border-radius:2px; }
.aia-body::-webkit-scrollbar-thumb:hover { background:rgba(255,255,255,0.22); }
.aia-header { display:flex; align-items:center; justify-content:space-between; padding:12px 14px 10px; background:linear-gradient(135deg,rgba(124,58,237,0.18),transparent); border-bottom:1px solid var(--border); flex-shrink:0; }
.aia-header-left { display:flex; align-items:center; gap:10px; }
.aia-logo { width:32px; height:32px; border-radius:7px; background:linear-gradient(135deg,#7c3aed,#4f46e5); color:#fff; display:grid; place-items:center; font-size:16px; font-weight:900; flex-shrink:0; }
.aia-title { font-size:13px; font-weight:700; color:var(--text); }
.aia-sub { font-size:10px; color:var(--muted); margin-top:1px; }
.aia-close { background:none; border:none; color:var(--muted); cursor:pointer; font-size:14px; padding:2px; }
.aia-close:hover { color:var(--text); }
.aia-signal-row { display:flex; align-items:center; gap:10px; padding:10px 14px; }
.aia-signal-badge { font-size:14px; font-weight:900; padding:4px 14px; border-radius:16px; letter-spacing:.08em; }
.aia-signal-badge.buy  { background:rgba(34,197,94,0.15); color:#22c55e; border:1px solid rgba(34,197,94,0.3); }
.aia-signal-badge.sell { background:rgba(239,68,68,0.15);  color:#ef4444; border:1px solid rgba(239,68,68,0.3); }
.aia-signal-badge.hold { background:rgba(255,255,255,0.06); color:var(--muted); border:1px solid var(--border); }
.aia-conf-wrap { flex:1; display:flex; align-items:center; gap:6px; }
.aia-conf-bar-bg { flex:1; height:4px; background:var(--border); border-radius:2px; }
.aia-conf-bar { height:100%; background:var(--gold); border-radius:2px; transition:width 0.5s; }
.aia-conf-val { font-size:11px; font-family:var(--mono); color:var(--gold); }
.aia-trend { font-size:10px; font-weight:700; letter-spacing:.05em; color:var(--muted); text-transform:uppercase; }
.aia-trend.uptrend   { color:var(--up); }
.aia-trend.downtrend { color:var(--down); }
.aia-levels { display:grid; grid-template-columns:1fr 1fr; gap:6px; padding:0 14px 10px; }
.aia-level-item { background:rgba(255,255,255,0.04); border-radius:6px; padding:6px 8px; }
.aia-level-label { font-size:9px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; margin-bottom:2px; }
.aia-level-val { font-size:14px; font-weight:700; font-family:var(--mono); color:var(--text); }
.aia-level-val.gold { color:var(--gold); }
.aia-reasoning { font-size:11.5px; color:var(--muted); padding:8px 14px; line-height:1.6; border-top:1px solid var(--border); }
.aia-chip-row { display:flex; flex-wrap:wrap; gap:4px; padding:6px 14px; }
.aia-chip { font-size:10.5px; padding:2px 8px; border-radius:10px; background:rgba(255,255,255,0.06); border:1px solid var(--border); color:var(--text); }
.aia-chip.resistance { background:rgba(239,68,68,0.1); border-color:rgba(239,68,68,0.3); color:#ef4444; }
.aia-chip.support    { background:rgba(34,197,94,0.1);  border-color:rgba(34,197,94,0.3);  color:#22c55e; }
.aia-warnings { padding:0 14px 8px; }
.aia-warn-item { font-size:11px; color:var(--gold); padding:3px 0; }
.aia-actions { display:flex; align-items:center; gap:10px; padding:10px 14px 12px; border-top:1px solid var(--border); flex-shrink:0; background:var(--panel); }
.aia-execute-btn { flex:1; background:linear-gradient(90deg,#7c3aed,#4f46e5); color:#fff; border:none; border-radius:8px; padding:11px 8px; font-size:13px; font-weight:800; cursor:pointer; font-family:var(--font); transition:all 0.15s; letter-spacing:.04em; box-shadow:0 4px 18px rgba(124,58,237,0.4); }
.aia-execute-btn:hover { box-shadow:0 6px 24px rgba(124,58,237,0.6); transform:translateY(-1px); opacity:0.92; }
.aia-execute-btn:disabled { opacity:0.5; cursor:not-allowed; }
.aia-exec-status { font-size:11px; font-family:var(--mono); }

/* Editable level inputs */
.aia-level-input { width:100%; background:rgba(255,255,255,0.07); border:1px solid var(--border); border-radius:4px; color:var(--text); font-size:13px; font-weight:700; font-family:var(--mono); padding:2px 4px; outline:none; }
.aia-level-input:focus { border-color:var(--gold); }
.aia-level-input.gold { color:var(--gold); }
.aia-level-input.down { color:var(--down); }
.aia-level-input.up   { color:var(--up);   }

/* SL Mode toggle row */
.aia-sl-ctrl { display:flex; align-items:center; gap:8px; padding:0 14px 10px; }
.aia-sl-ctrl-label { font-size:9px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; white-space:nowrap; }
.aia-sl-mode-btns { display:flex; gap:0; border:1px solid var(--border); border-radius:6px; overflow:hidden; }
.aia-sl-mode-btn { font-size:10px; font-weight:700; padding:4px 10px; background:transparent; border:none; color:var(--muted); cursor:pointer; font-family:var(--mono); letter-spacing:.04em; transition:all 0.15s; }
.aia-sl-mode-btn + .aia-sl-mode-btn { border-left:1px solid var(--border); }
.aia-sl-mode-btn.active { background:rgba(234,179,8,0.18); color:var(--gold); }
.aia-sl-mode-btn:hover:not(.active) { background:rgba(255,255,255,0.06); color:#fff; }
.aia-maxloss-wrap { display:flex; align-items:center; gap:4px; margin-left:4px; }
.aia-maxloss-input { width:60px !important; text-align:center; color:var(--down) !important; border-color:rgba(239,68,68,0.4) !important; }
.aia-maxloss-input:focus { border-color:var(--down) !important; }

/* Lot + Risk row */
.aia-lot-row  { display:grid; grid-template-columns:1fr 1fr; gap:6px; padding:0 14px 10px; }
.aia-lot-item { background:rgba(255,255,255,0.04); border-radius:6px; padding:6px 8px; }
.aia-lot-suggest { display:block; font-size:9px; color:var(--gold); margin-top:3px; letter-spacing:.02em; font-family:var(--mono); font-weight:600; opacity:.85; }

/* Staircase Trailing SL */
.aia-staircase { border-top:1px solid var(--border); padding:8px 14px; }
.aia-stair-toggle { display:flex; align-items:center; gap:6px; cursor:pointer; font-size:11.5px; font-weight:700; color:var(--text); }
.aia-stair-toggle input[type=checkbox] { accent-color:#7c3aed; }
.aia-stair-steps { margin-top:6px; display:flex; flex-direction:column; gap:4px; }
.aia-stair-row { display:flex; align-items:center; gap:4px; }
.aia-stair-label { font-size:10px; color:var(--muted); white-space:nowrap; }
.aia-stair-input { width:38px; background:rgba(255,255,255,0.07); border:1px solid var(--border); border-radius:3px; color:var(--text); font-size:11px; font-family:var(--mono); padding:2px 3px; outline:none; text-align:center; }
.aia-stair-input:focus { border-color:#7c3aed; }

/* ── AI Indicator Gauges ────────────────────────────────────────────────── */
.aia-indicators { border-top:1px solid var(--border); padding:8px 14px 10px; }
.aia-ind-title  { font-size:10px; color:var(--muted); text-transform:uppercase; letter-spacing:.08em; font-weight:700; margin-bottom:7px; }
.aia-ind-row    { display:flex; align-items:center; gap:6px; margin-bottom:5px; min-height:18px; }
.aia-ind-name   { font-size:10px; color:var(--muted); width:46px; flex-shrink:0; font-family:var(--mono); }
.aia-ind-reading { font-size:11px; font-family:var(--mono); color:var(--text); white-space:nowrap; }
.mono-sm        { font-size:10px; font-family:var(--mono); color:var(--muted); }
.aia-ind-badge  { font-size:9px; font-weight:700; padding:1px 6px; border-radius:10px; letter-spacing:.04em; white-space:nowrap; flex-shrink:0; text-transform:uppercase; }
.aia-ind-badge.bullish,.aia-ind-badge.bullish_crossover { background:rgba(34,197,94,.15);color:#22c55e;border:1px solid rgba(34,197,94,.3); }
.aia-ind-badge.bearish,.aia-ind-badge.bearish_crossover { background:rgba(239,68,68,.15);color:#ef4444;border:1px solid rgba(239,68,68,.3); }
.aia-ind-badge.overbought,.aia-ind-badge.above_upper,.aia-ind-badge.touching_upper { background:rgba(239,68,68,.15);color:#ef4444;border:1px solid rgba(239,68,68,.3); }
.aia-ind-badge.oversold,.aia-ind-badge.below_lower,.aia-ind-badge.touching_lower   { background:rgba(34,197,94,.15);color:#22c55e;border:1px solid rgba(34,197,94,.3); }
.aia-ind-badge.approaching_overbought,.aia-ind-badge.approaching_oversold,.aia-ind-badge.squeeze { background:rgba(234,179,8,.15);color:#eab308;border:1px solid rgba(234,179,8,.3); }
.aia-ind-badge.trending   { background:rgba(124,58,237,.15);color:#a78bfa;border:1px solid rgba(124,58,237,.3); }
.aia-ind-badge.neutral,.aia-ind-badge.normal,.aia-ind-badge.ranging,.aia-ind-badge.weak_trend { background:rgba(255,255,255,.06);color:var(--muted);border:1px solid var(--border); }
/* RSI track: green zone left (OS), grey middle, red zone right (OB) */
.aia-rsi-track  { flex:1; height:6px; border-radius:3px; position:relative;
  background:linear-gradient(90deg,rgba(34,197,94,.35) 0%,rgba(34,197,94,.35) 30%,rgba(255,255,255,.08) 30%,rgba(255,255,255,.08) 70%,rgba(239,68,68,.35) 70%); }
.aia-rsi-needle { position:absolute; top:-4px; width:3px; height:14px; background:#fff; border-radius:2px; transform:translateX(-50%); transition:left .5s cubic-bezier(.4,0,.2,1); pointer-events:none; }
/* BB track: price position dot */
.aia-bb-track   { flex:1; height:6px; background:linear-gradient(90deg,rgba(34,197,94,.3) 0%,rgba(255,255,255,.08) 20%,rgba(255,255,255,.12) 50%,rgba(255,255,255,.08) 80%,rgba(239,68,68,.3) 100%); border-radius:3px; position:relative; }
.aia-bb-dot     { position:absolute; top:-4px; width:10px; height:10px; background:var(--gold); border-radius:50%; transform:translateX(-50%); transition:left .5s cubic-bezier(.4,0,.2,1); border:2px solid rgba(0,0,0,.6); pointer-events:none; }
/* EMA pills row */
.aia-ema-row    { display:flex; gap:3px; flex-wrap:wrap; flex:1; align-items:center; }
.aia-ema-pill   { font-size:9px; padding:1px 5px; border-radius:8px; font-family:var(--mono); }
.aia-ema-pill.above { background:rgba(34,197,94,.12);color:#22c55e;border:1px solid rgba(34,197,94,.25); }
.aia-ema-pill.below { background:rgba(239,68,68,.12);color:#ef4444;border:1px solid rgba(239,68,68,.25); }
.aia-ema-align  { font-size:9px; color:var(--muted); margin-left:3px; white-space:nowrap; }

/* ── AI Analyze capture animation ───────────────────────────────────────── */
.chart-col { position: relative; }
.aia-capturing::before {
  content: "📷 Capturing chart…";
  position: absolute; inset: 0; z-index: 100;
  background: rgba(124,58,237,0.12);
  border: 2px solid #7c3aed;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 700; color: #c4b5fd;
  letter-spacing: 0.08em;
  animation: aia-flash 0.15s ease-out, aia-scan 0.7s ease-in-out;
  pointer-events: none; border-radius: 2px;
}
@keyframes aia-flash {
  0%   { background: rgba(255,255,255,0.35); }
  100% { background: rgba(124,58,237,0.12); }
}
@keyframes aia-scan {
  0%   { background-position: 0 -100%; }
  100% { background-position: 0 200%; }
}

/* ── Autopilot Button ───────────────────────────────────────────────────── */
.qt-ap-btn { background:linear-gradient(135deg,rgba(16,185,129,.18),rgba(6,78,59,.25)); color:#10b981; border:1px solid rgba(16,185,129,.35); border-radius:6px; padding:5px 11px; font-size:12px; font-weight:700; cursor:pointer; font-family:var(--font); transition:all .15s; white-space:nowrap; }
.qt-ap-btn:hover { background:linear-gradient(135deg,rgba(16,185,129,.28),rgba(6,78,59,.4)); border-color:#10b981; }
.qt-ap-btn.ap-running { background:linear-gradient(135deg,rgba(16,185,129,.3),rgba(6,78,59,.45)); color:#34d399; border-color:#34d399; animation:ap-pulse 2s ease-in-out infinite; }
@keyframes ap-pulse { 0%,100%{box-shadow:0 0 0 0 rgba(16,185,129,.4)} 50%{box-shadow:0 0 0 5px rgba(16,185,129,.0)} }

/* ── Autopilot Panel ────────────────────────────────────────────────────── */
.ap-overlay { position:fixed; right:16px; top:70px; z-index:8400; pointer-events:none; opacity:0; transform:translateX(20px); transition:opacity .28s,transform .28s; }
.ap-overlay.open { opacity:1; transform:translateX(0); pointer-events:all; }
.ap-ins-overlay { right:auto; left:16px; top:70px; transform:translateX(-20px); }
.ap-ins-overlay.open { transform:translateX(0); }
.ap-box { width:300px; max-height:calc(100vh - 90px); background:var(--panel); border:1px solid var(--border-2); border-radius:12px; box-shadow:0 16px 60px rgba(0,0,0,.6); display:flex; flex-direction:column; overflow:hidden; }
.ap-ins-box { width:280px; }
.ap-header { display:flex; align-items:center; justify-content:space-between; padding:12px 14px 10px; background:linear-gradient(135deg,rgba(16,185,129,.15),transparent); border-bottom:1px solid var(--border); flex-shrink:0; }
.ap-header-left { display:flex; align-items:center; gap:10px; }
.ap-header-right { display:flex; align-items:center; gap:6px; }
.ap-logo { width:30px; height:30px; border-radius:7px; background:linear-gradient(135deg,#059669,#047857); display:grid; place-items:center; font-size:16px; flex-shrink:0; }
.ap-title { font-size:13px; font-weight:700; color:var(--text); }
.ap-subtitle { font-size:10px; color:var(--muted); margin-top:1px; }
.ap-insights-btn { background:rgba(16,185,129,.12); border:1px solid rgba(16,185,129,.25); color:#10b981; border-radius:6px; padding:3px 8px; font-size:11px; cursor:pointer; transition:all .15s; }
.ap-insights-btn:hover { background:rgba(16,185,129,.22); }
.ap-close { background:none; border:none; color:var(--muted); cursor:pointer; font-size:14px; padding:2px; }
.ap-close:hover { color:var(--text); }

/* Body rows */
.ap-body { padding:10px 0; overflow-y:auto; }
.ap-row { display:flex; align-items:center; justify-content:space-between; padding:6px 14px; gap:8px; }
.ap-label { font-size:11.5px; color:var(--muted); flex-shrink:0; }
.ap-select { background:rgba(255,255,255,.06); border:1px solid var(--border); border-radius:5px; color:var(--text); font-size:12px; padding:4px 6px; outline:none; cursor:pointer; min-width:110px; }
.ap-select:focus { border-color:#10b981; }
.ap-input-wrap { display:flex; align-items:center; gap:4px; }
.ap-input { background:rgba(255,255,255,.07); border:1px solid var(--border); border-radius:4px; color:var(--text); font-size:12px; font-family:var(--mono); padding:4px 6px; outline:none; width:56px; text-align:right; }
.ap-input-sm { width:46px; }
.ap-input:focus { border-color:#10b981; }
.ap-unit { font-size:11px; color:var(--muted); }
.ap-toggle-group { display:flex; border:1px solid var(--border); border-radius:6px; overflow:hidden; }
.ap-mode-btn { background:none; border:none; color:var(--muted); font-size:11.5px; padding:4px 12px; cursor:pointer; transition:all .15s; font-family:var(--font); }
.ap-mode-btn.active { background:rgba(16,185,129,.2); color:#10b981; font-weight:700; }
.ap-switch { position:relative; display:inline-block; width:36px; height:20px; flex-shrink:0; }
.ap-switch input { opacity:0; width:0; height:0; }
.ap-switch-slider { position:absolute; cursor:pointer; inset:0; background:rgba(255,255,255,.1); border-radius:20px; transition:.3s; border:1px solid var(--border); }
.ap-switch-slider::before { content:""; position:absolute; width:14px; height:14px; left:2px; bottom:2px; background:var(--muted); border-radius:50%; transition:.3s; }
.ap-switch input:checked + .ap-switch-slider { background:rgba(16,185,129,.3); border-color:#10b981; }
.ap-switch input:checked + .ap-switch-slider::before { transform:translateX(16px); background:#10b981; }

/* Status bar */
.ap-status-bar { display:flex; align-items:center; gap:6px; padding:6px 14px; background:rgba(255,255,255,.03); border-top:1px solid var(--border); flex-shrink:0; }
.ap-status-dot { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.2); flex-shrink:0; transition:background .3s; }
.ap-status-dot.idle    { background:rgba(255,255,255,.2); }
.ap-status-dot.running { background:#10b981; box-shadow:0 0 6px #10b981; animation:ap-dot-pulse 1.5s ease-in-out infinite; }
.ap-status-dot.scanning { background:#f59e0b; box-shadow:0 0 6px #f59e0b; }
@keyframes ap-dot-pulse { 0%,100%{opacity:1} 50%{opacity:.4} }
.ap-status-text { font-size:11px; color:var(--muted); flex:1; }
.ap-countdown { font-size:11px; color:#10b981; font-family:var(--mono); font-weight:700; flex-shrink:0; }

/* Mini log */
.ap-log { max-height:72px; overflow-y:auto; padding:4px 14px; border-top:1px solid var(--border); }
.ap-log-row { font-size:10.5px; color:var(--muted); padding:1px 0; font-family:var(--mono); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ap-log-row.ok   { color:#10b981; }
.ap-log-row.warn { color:#f59e0b; }
.ap-log-row.err  { color:#ef4444; }

/* Footer */
.ap-footer { padding:10px 14px 12px; flex-shrink:0; border-top:1px solid var(--border); }
.ap-start-btn { width:100%; background:linear-gradient(90deg,#059669,#047857); color:#fff; border:none; border-radius:8px; padding:10px; font-size:13px; font-weight:800; cursor:pointer; font-family:var(--font); transition:all .15s; letter-spacing:.04em; }
.ap-start-btn:hover { opacity:.9; transform:translateY(-1px); }
.ap-start-btn.stopping { background:linear-gradient(90deg,#dc2626,#b91c1c); }
.ap-start-btn:disabled { opacity:.5; cursor:not-allowed; transform:none; }

/* Staircase step editor */
.ap-stair-rows { background:rgba(16,185,129,.05); border:1px solid rgba(16,185,129,.18); border-radius:8px; padding:6px 10px 8px; margin:0 14px 8px; }
.ap-stair-header { display:grid; grid-template-columns:46px 1fr 1fr; gap:4px; font-size:10px; color:var(--muted); padding-bottom:4px; border-bottom:1px solid var(--border); margin-bottom:4px; text-align:center; }
.ap-stair-header span:first-child { text-align:left; }
.ap-stair-row { display:grid; grid-template-columns:46px 1fr 18px 1fr; gap:4px; align-items:center; padding:3px 0; }
.ap-stair-lbl { font-size:10.5px; color:var(--muted); }
.ap-stair-arr { font-size:11px; color:var(--muted); text-align:center; }
.ap-stair-in { width:100% !important; min-width:0 !important; padding:4px 6px !important; font-size:11px !important; text-align:center; }

/* Insights body */
.ap-ins-body { padding:8px 0 4px; overflow-y:auto; }
.ap-ins-row { display:flex; align-items:center; justify-content:space-between; padding:5px 16px; }
.ap-ins-highlight { background:rgba(16,185,129,.06); border-left:2px solid #10b981; padding-left:14px; }
.ap-ins-indent { padding-left:28px; }
.ap-ins-label { font-size:11.5px; color:var(--muted); }
.ap-ins-val { font-size:13px; font-weight:700; font-family:var(--mono); color:var(--text); }
.ap-ins-buy  { color:#22c55e; }
.ap-ins-sell { color:#ef4444; }
.ap-ins-muted { color:var(--muted); font-weight:400; font-size:12px; }
.ap-ins-profit { color:#22c55e; }
.ap-ins-loss   { color:#ef4444; }
.ap-ins-divider { height:1px; background:var(--border); margin:6px 16px; }
.ap-reset-btn { width:calc(100% - 32px); margin:8px 16px 12px; background:rgba(239,68,68,.1); border:1px solid rgba(239,68,68,.25); color:#ef4444; border-radius:6px; padding:7px; font-size:11.5px; font-weight:700; cursor:pointer; font-family:var(--font); transition:all .15s; }
.ap-reset-btn:hover { background:rgba(239,68,68,.2); }

/* ── AI Strategy Builder ─────────────────────────────────────────────────── */
.sb-card { border-color: rgba(245,158,11,0.25) !important; }
.sb-head { display:flex; align-items:center; gap:12px; cursor:pointer; }
.sb-chevron { margin-left:auto; font-size:11px; color:var(--muted); }
.sb-body { padding: 16px; }
.sb-tabs { display:flex; gap:6px; margin-bottom:14px; }
.sb-tab { padding:5px 14px; border-radius:16px; border:1px solid var(--border); background:none; color:var(--muted); font-size:12px; cursor:pointer; font-family:var(--font); transition:all 0.15s; }
.sb-tab.active { background:var(--gold); border-color:var(--gold); color:#000; font-weight:700; }
.sb-shared { margin-bottom:10px; }
.sb-input-label { font-size:10px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; display:block; margin-bottom:6px; }
.sb-textarea { width:100%; background:var(--input); border:1px solid var(--border); color:var(--text); padding:10px 12px; border-radius:var(--radius-sm); font-size:12px; font-family:var(--font); resize:vertical; box-sizing:border-box; }
.sb-mono { font-family:var(--mono); font-size:11.5px; }
.sb-textarea:focus { border-color:var(--gold); outline:none; }
.sb-drop-zone { border:2px dashed var(--border); border-radius:8px; padding:24px 20px; text-align:center; cursor:pointer; transition:border-color 0.15s; }
.sb-drop-zone.drag-over { border-color:var(--gold); background:rgba(245,158,11,0.05); }
.sb-browse-link { color:var(--gold); cursor:pointer; text-decoration:underline; }
.sb-preview { margin-top:16px; border:1px solid var(--border-2); border-radius:8px; overflow:hidden; }
.sb-preview-header { display:flex; align-items:center; justify-content:space-between; padding:10px 14px; background:rgba(245,158,11,0.06); border-bottom:1px solid var(--border); }
.sb-preview-title { font-size:13px; font-weight:700; color:var(--gold); }
.sb-preview-body { padding:12px 14px; }
.sb-logic-row { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:10px; }
.sb-logic-box { background:rgba(255,255,255,0.04); border:1px solid var(--border); border-radius:6px; padding:8px 10px; font-size:11.5px; color:var(--text); }
.sb-logic-label { font-size:10px; font-weight:700; text-transform:uppercase; color:var(--muted); margin-bottom:4px; }
.sb-exp { font-size:12px; color:var(--muted); margin-bottom:8px; line-height:1.6; }
.sb-chips-label { font-size:10px; font-weight:600; text-transform:uppercase; color:var(--muted); margin:8px 0 4px; }
.sb-chips { display:flex; flex-wrap:wrap; gap:5px; }
.sb-chip { background:rgba(255,255,255,0.06); border:1px solid var(--border); border-radius:10px; padding:2px 9px; font-size:11px; color:var(--text); }
.sb-chip.warn { border-color:rgba(245,158,11,0.4); color:var(--gold); }
.sb-warn-box { background:rgba(245,158,11,0.08); border:1px solid rgba(245,158,11,0.3); border-radius:6px; padding:7px 10px; font-size:11.5px; color:var(--gold); margin-top:8px; }
.sb-preview-actions { display:flex; gap:8px; padding:10px 14px; border-top:1px solid var(--border); background:rgba(0,0,0,0.1); }
.sb-generating { display:flex; align-items:center; gap:6px; }

/* =====================================================================
   TABLES
   ===================================================================== */
.tbl { width: 100%; border-collapse: collapse; font-size: 12px; }
.tbl th { padding: 6px 10px; text-align: left; font-size: 10px; font-weight: 600; letter-spacing: 0.05em; color: var(--muted); border-bottom: 1px solid var(--border); text-transform: uppercase; }
.tbl td { padding: 7px 10px; border-bottom: 1px solid rgba(30,45,66,0.5); vertical-align: middle; }
.tbl tr:hover td { background: rgba(255,255,255,0.02); }
.tbl-empty { padding: 20px; text-align: center; color: var(--muted); font-size: 12px; }
#posWrap, #closedWrap { overflow-y: auto; flex: 1; }
.tbl-mt5 td { padding: 5px 8px; }
.pos-close-btn { background: rgba(239,68,68,0.15); border: 1px solid rgba(239,68,68,0.35); color: var(--down); border-radius: 3px; padding: 1px 6px; font-size: 11px; cursor: pointer; line-height: 1.4; }
.pos-close-btn:hover { background: rgba(239,68,68,0.3); }
.up   { color: var(--up) !important; }
.down { color: var(--down) !important; }

/* Tags */
.tag { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 10px; font-weight: 700; letter-spacing: 0.04em; }
.tag.BUY  { background: rgba(16,185,129,0.15); color: var(--up); }
.tag.SELL { background: rgba(239,68,68,0.15);  color: var(--down); }
.tag.tp   { background: rgba(16,185,129,0.15); color: var(--up); }
.tag.sl   { background: rgba(239,68,68,0.15);  color: var(--down); }
.tag.early_exit { background: rgba(139,92,246,0.15); color: var(--purple); }
.tag.manual     { background: rgba(100,116,139,0.15); color: var(--muted); }
.tag.end_of_data{ background: rgba(100,116,139,0.15); color: var(--muted); }
.tag.active   { background: rgba(16,185,129,0.1); color: var(--up); }
.tag.caution  { background: rgba(245,158,11,0.1); color: var(--gold); }
.tag.paused   { background: rgba(239,68,68,0.1); color: var(--down); }
.tag.recovery { background: rgba(139,92,246,0.1); color: var(--purple); }
.tag.high_conf{ background: rgba(59,130,246,0.1); color: var(--blue); }

/* =====================================================================
   SECTION CARDS
   ===================================================================== */
.section-card { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; margin-bottom: 16px; }
.section-head {
  padding: 12px 16px; font-size: 13px; font-weight: 600;
  border-bottom: 1px solid var(--border); background: var(--panel-2);
  display: flex; align-items: center; justify-content: space-between;
}
.section-head.with-tabs { display: flex; align-items: center; justify-content: space-between; }
.section-body { padding: 14px 16px; }

/* =====================================================================
   FORMS
   ===================================================================== */
.form-row { display: flex; gap: 10px; flex-wrap: wrap; }
.form-field { display: flex; flex-direction: column; gap: 5px; min-width: 140px; flex: 1; }
.form-field.full { flex-basis: 100%; }
.form-field.form-field-btn { justify-content: flex-end; min-width: auto; }
.form-field label { font-size: 11px; font-weight: 600; color: var(--muted); letter-spacing: 0.04em; }
.form-field input, .form-field select {
  padding: 7px 10px; background: var(--bg); border: 1px solid var(--border);
  border-radius: var(--radius-sm); color: var(--text); font-family: var(--font);
  font-size: 13px; outline: none; transition: border-color 0.15s;
  appearance: none; -webkit-appearance: none;
}
.form-field input:focus, .form-field select:focus { border-color: var(--blue); }
.form-field .check-field { flex-direction: row; align-items: center; gap: 7px; }
.check-field input[type="checkbox"] {
  width: 15px; height: 15px; accent-color: var(--gold); flex-shrink: 0;
  appearance: none; -webkit-appearance: none;
  border: 2px solid rgba(255,255,255,0.55); border-radius: 3px;
  background: rgba(255,255,255,0.08); cursor: pointer;
  position: relative; transition: border-color 0.15s, background 0.15s;
}
.check-field input[type="checkbox"]:checked {
  background: var(--gold); border-color: var(--gold);
}
.check-field input[type="checkbox"]:checked::after {
  content: "✓"; position: absolute; top: -2px; left: 1px;
  font-size: 11px; color: #000; font-weight: 900;
}
.check-field label { font-size: 12px; color: var(--text); letter-spacing: 0; font-weight: 400; }
.form-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--border); }
.hint { font-size: 11px; color: var(--muted); line-height: 1.5; padding: 4px 0; }

/* Builder groups */
.builder-form  { display: flex; flex-direction: column; gap: 18px; }
.builder-group { display: flex; flex-direction: column; gap: 10px; }
.bg-label { font-size: 10px; font-weight: 700; letter-spacing: 0.08em; color: var(--muted); text-transform: uppercase; }

/* =====================================================================
   BUTTONS
   ===================================================================== */
.btn-primary, .btn-secondary, .btn-ghost, .btn-danger {
  padding: 7px 14px; border-radius: var(--radius-sm); border: none; cursor: pointer;
  font-size: 12px; font-weight: 600; font-family: var(--font);
  transition: all 0.15s; white-space: nowrap; display: inline-flex; align-items: center; gap: 5px;
}
.btn-primary   { background: var(--gold); color: #000; }
.btn-primary:hover { background: #fbbf24; }
.btn-secondary { background: var(--panel-2); color: var(--text); border: 1px solid var(--border); }
.btn-secondary:hover { border-color: var(--border-2); background: var(--border); }
.btn-ghost     { background: transparent; color: var(--muted); border: 1px solid var(--border); }
.btn-ghost:hover { color: var(--text); border-color: var(--border-2); }
.btn-danger    { background: rgba(239,68,68,0.15); color: var(--down); border: 1px solid rgba(239,68,68,0.3); }
.btn-danger:hover { background: rgba(239,68,68,0.25); }
.btn-sm { padding: 4px 10px; font-size: 11px; }

/* =====================================================================
   BACKTEST PAGE
   ===================================================================== */
#page-backtest { overflow-y: auto; }
.bt-stats-row { display: flex; gap: 8px; flex-wrap: wrap; margin: 16px 0; }
.bt-stat { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 10px 14px; flex: 1; min-width: 100px; }
.bt-stat-streak-win  { border-color: rgba(16,185,129,0.3); min-width:140px; }
.bt-stat-streak-loss { border-color: rgba(239,68,68,0.3);  min-width:140px; }
.streak-list  { margin-top:6px; display:flex; flex-direction:column; gap:2px; }
.streak-item  { font-size:10px; font-family:var(--mono); padding:2px 4px; border-radius:3px; }
.streak-item.up   { background:rgba(16,185,129,0.08); color:var(--up); }
.streak-item.down { background:rgba(239,68,68,0.08);  color:var(--down); }
.streak-item span { color:var(--muted); margin-left:4px; text-transform:uppercase; font-size:9px; }
.bs-sub { font-size: 9px; color: var(--muted); margin-top: 3px; font-family: var(--mono); }
.bs-label { font-size: 10px; color: var(--muted); font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; }
.bs-val   { font-size: 16px; font-weight: 700; margin-top: 2px; }
.bt-date-field input[type="date"] { cursor: pointer; font-size: 13px; }
.bt-progress-wrap { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 16px; margin: 12px 0; }
.bt-progress-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.bt-progress-title { font-size: 12px; font-weight: 600; color: var(--gold); }
.bt-progress-eta { font-size: 11px; color: var(--muted); font-family: var(--mono); }
.bt-progress-log { max-height: 160px; overflow-y: auto; font-family: var(--mono); font-size: 11px; display: flex; flex-direction: column; gap: 2px; }
.bt-prog-row { color: var(--muted); padding: 1px 0; }
.bt-prog-row.ok   { color: var(--up); }
.bt-prog-row.warn { color: var(--gold); }
.bt-chart-wrap { height: 320px; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); margin-bottom: 16px; position: relative; }
.bt-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 16px; }
.bt-summary-lines { font-size: 12px; line-height: 1.9; color: var(--muted); }
.bt-summary-lines .line { display: block; }
.bt-summary-lines .line.head { color: var(--text); font-weight: 600; }
.bt-summary-lines .line.good { color: var(--up); }
.bt-summary-lines .line.bad  { color: var(--down); }
.bt-summary-lines .line.warn { color: var(--gold); }
.bt-funnel { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.bt-funnel-step { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.bt-funnel-box { padding: 8px 12px; border-radius: 6px; font-size: 12px; font-weight: 700; text-align: center; min-width: 70px; }
.bt-funnel-box.detected { background: rgba(59,130,246,0.15); color: #93c5fd; border: 1px solid rgba(59,130,246,0.3); }
.bt-funnel-box.no-wick  { background: rgba(100,116,139,0.15); color: var(--muted); border: 1px solid var(--border); }
.bt-funnel-box.filtered { background: rgba(239,68,68,0.15); color: var(--down); border: 1px solid rgba(239,68,68,0.3); }
.bt-funnel-box.executed { background: rgba(16,185,129,0.15); color: var(--up); border: 1px solid rgba(16,185,129,0.3); }
.bt-funnel-label { font-size: 10px; color: var(--muted); }
.bt-funnel-arrow { color: var(--muted); font-size: 16px; margin-top: -12px; }
.bt-filter-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.bt-filter-pill { display: flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 20px; font-size: 11px; background: rgba(239,68,68,0.08); border: 1px solid rgba(239,68,68,0.2); color: #fca5a5; }
.bt-filter-count { background: rgba(239,68,68,0.25); border-radius: 10px; padding: 1px 6px; font-weight: 700; font-size: 10px; }
.bt-events { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 3px; }
.bt-event-chip { font-size: 10px; padding: 1px 7px; border-radius: 10px; white-space: nowrap; }
.bt-event-chip.break_even { background: rgba(245,158,11,0.2); color: var(--gold); }
.bt-event-chip.trail_sl   { background: rgba(16,185,129,0.2); color: var(--up); }
.bt-event-chip.extend_tp  { background: rgba(59,130,246,0.2); color: #93c5fd; }
.bt-event-chip.early_exit { background: rgba(139,92,246,0.2); color: var(--purple); }
.tab-group { display: flex; gap: 2px; background: var(--bg); border-radius: var(--radius-sm); padding: 2px; }
.tg-btn { padding: 4px 12px; border-radius: 4px; border: none; cursor: pointer; font-size: 11px; font-weight: 500; color: var(--muted); background: transparent; font-family: var(--font); }
.tg-btn.active { color: var(--text); background: var(--panel-2); }

/* =====================================================================
   SETTINGS PAGE
   ===================================================================== */
.settings-grid { display: grid; grid-template-columns: 380px 1fr; gap: 16px; align-items: start; }

/* Mode switch */
.mode-switch { display: flex; gap: 8px; margin-bottom: 14px; }
.mode-btn {
  flex: 1; padding: 10px 8px; border-radius: var(--radius); border: 1px solid var(--border);
  background: var(--bg); cursor: pointer; text-align: center; transition: all 0.15s; font-family: var(--font);
}
.mode-btn:hover { border-color: var(--border-2); }
.mode-btn.active[data-profile="paper"] { border-color: rgba(245,158,11,0.5); background: rgba(245,158,11,0.06); }
.mode-btn.active[data-profile="live"]  { border-color: rgba(239,68,68,0.5);  background: rgba(239,68,68,0.06); }
.mode-icon  { font-size: 1.3rem; margin-bottom: 3px; }
.mode-label { font-size: 12px; font-weight: 600; color: var(--text); }
.mode-sub   { font-size: 10px; color: var(--muted); }

/* Connection status bar */
.conn-status-bar {
  display: flex; align-items: center; gap: 6px;
  background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 7px 12px; margin-bottom: 14px; font-size: 12px; flex-wrap: wrap;
}
.csb-dot  { width: 8px; height: 8px; border-radius: 50%; background: var(--down); flex-shrink: 0; }
.csb-dot.on { background: var(--up); box-shadow: 0 0 5px var(--up); }
.csb-sep  { color: var(--border-2); }

/* Mode notices */
.mode-notice { padding: 10px 14px; border-radius: var(--radius-sm); font-size: 12px; line-height: 1.6; margin-bottom: 12px; }
.mode-notice.paper { background: rgba(245,158,11,0.08); border: 1px solid rgba(245,158,11,0.25); color: #fde68a; }
.mode-notice.live  { background: rgba(239,68,68,0.08);  border: 1px solid rgba(239,68,68,0.25);  color: #fca5a5; }

/* Cred forms */
.cred-form        { display: none; }
.cred-form.active { display: block; }
.cred-result { padding: 8px 12px; border-radius: var(--radius-sm); font-size: 12px; font-family: var(--mono); margin-top: 8px; }
.cred-result.ok   { background: rgba(16,185,129,0.08); border: 1px solid rgba(16,185,129,0.25); color: var(--up); }
.cred-result.fail { background: rgba(239,68,68,0.08);  border: 1px solid rgba(239,68,68,0.25);  color: var(--down); }

/* Live gate */
.live-gate { margin-top: 10px; }
.gate-row  { display: flex; gap: 8px; align-items: center; }
.gate-row input { flex: 1; }

/* Account mode badge */
.acct-mode-badge { font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 20px; }
.acct-mode-badge.paper { background: rgba(245,158,11,0.15); color: var(--gold); border: 1px solid rgba(245,158,11,0.3); }
.acct-mode-badge.live  { background: rgba(239,68,68,0.15);  color: var(--down); border: 1px solid rgba(239,68,68,0.3); animation: danger-pulse 2s infinite; }
@keyframes danger-pulse { 0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,0.3);} 50%{box-shadow:0 0 0 4px rgba(239,68,68,0);} }

/* =====================================================================
   ANALYTICS MODAL
   ===================================================================== */
.modal-overlay {
  display: none; position: fixed; inset: 0; z-index: 200;
  background: rgba(0,0,0,0.7); backdrop-filter: blur(4px);
  align-items: center; justify-content: center;
}
.modal-overlay.show { display: flex; }
.modal { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); width: 680px; max-width: 95vw; max-height: 85vh; overflow-y: auto; }
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--border); position: sticky; top: 0; background: var(--panel); }
.modal-head h2 { font-size: 16px; font-weight: 700; }
.modal-close { background: none; border: 1px solid var(--border); border-radius: 4px; color: var(--muted); cursor: pointer; font-size: 14px; padding: 3px 8px; }
.modal-body  { padding: 20px; }
.an-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 20px; }
.an-stat  { background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 10px 12px; }
.an-stat .lbl { font-size: 10px; color: var(--muted); font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; }
.an-stat .val { font-size: 15px; font-weight: 700; margin-top: 2px; font-family: var(--mono); }
.an-section h3 { font-size: 13px; font-weight: 600; margin-bottom: 10px; }
.an-log { max-height: 260px; overflow-y: auto; }
.an-log .row { display: flex; gap: 8px; padding: 5px 8px; font-size: 11.5px; border-bottom: 1px solid rgba(30,45,66,0.4); }
.an-log .k { font-weight: 600; color: var(--muted); flex-shrink: 0; min-width: 80px; }
.an-log .v { flex: 1; word-break: break-word; }

/* =====================================================================
   SCHEDULE LIST
   ===================================================================== */
.schedule-list { font-size: 12px; color: var(--muted); margin: 10px 0; }
.schedule-item { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--border); gap: 10px; }

/* =====================================================================
   LOADING / EMPTY STATES
   ===================================================================== */
.loading-state { padding: 40px; text-align: center; color: var(--muted); font-size: 13px; grid-column: 1/-1; }

/* =====================================================================
   TOAST
   ===================================================================== */
.toast {
  position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%) translateY(20px);
  background: var(--panel-2); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 10px 18px; font-size: 13px; z-index: 999; opacity: 0;
  transition: all 0.25s; pointer-events: none; white-space: nowrap;
}
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.toast.ok   { border-color: rgba(16,185,129,0.5); }
.toast.err  { border-color: rgba(239,68,68,0.5); }

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width: 1100px) {
  .trading-layout { grid-template-columns: 1fr 260px; }
  .settings-grid  { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
  .trading-layout { grid-template-columns: 1fr; }
  .log-col { display: none; }
  .topbar-right .acct-chip:not(#chipPaper):not(#chipPnL) { display: none; }
  .bt-two-col { grid-template-columns: 1fr; }
}

/* =====================================================================
   LOGIN OVERLAY
   ===================================================================== */
.login-overlay {
  position: fixed; inset: 0; z-index: 9000;
  background: var(--bg);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  transition: opacity 0.35s, visibility 0.35s;
}
.login-overlay.hidden {
  opacity: 0; visibility: hidden; pointer-events: none;
}
.login-box {
  width: 100%; max-width: 560px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 36px 40px 32px;
  box-shadow: 0 24px 80px rgba(0,0,0,0.6);
}
.login-brand {
  display: flex; align-items: center; gap: 14px;
  margin-bottom: 28px;
}
.login-title { font-size: 22px; font-weight: 800; letter-spacing: 0.06em; color: var(--gold); }
.login-sub   { font-size: 11px; color: var(--muted); margin-top: 2px; letter-spacing: 0.04em; }
.login-heading {
  font-size: 17px; font-weight: 700; margin-bottom: 6px; color: var(--text);
}
.login-hint {
  font-size: 12px; color: var(--muted); margin-bottom: 20px; line-height: 1.5;
}

/* Demo / Live toggle on login */
.login-type-row {
  display: flex; gap: 8px; margin-bottom: 20px;
}
.login-type-btn {
  flex: 1; padding: 9px 12px; border-radius: var(--radius);
  border: 1px solid var(--border); background: transparent;
  font-size: 12px; font-weight: 600; color: var(--muted);
  cursor: pointer; font-family: var(--font); transition: all 0.15s;
}
.login-type-btn:hover { border-color: var(--border-2); color: var(--text); }
.login-type-btn.active {
  border-color: var(--gold); background: rgba(245,158,11,0.1);
  color: var(--gold);
}

/* Fields */
.login-form { display: flex; flex-direction: column; gap: 10px; margin-bottom: 18px; }
.login-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.login-field { display: flex; flex-direction: column; gap: 5px; }
.login-field label { font-size: 11px; font-weight: 600; color: var(--muted); letter-spacing: 0.04em; text-transform: uppercase; }
.login-field input {
  padding: 9px 12px; border-radius: var(--radius-sm);
  border: 1px solid var(--border); background: var(--bg);
  color: var(--text); font-size: 13px; font-family: var(--font);
  transition: border-color 0.15s; outline: none;
}
.login-field input:focus { border-color: var(--gold); }
.req { color: var(--gold); }

/* Connect button */
.login-connect-btn {
  width: 100%; padding: 12px; font-size: 14px; font-weight: 700;
  margin-bottom: 12px;
}

/* Result */
.login-result {
  padding: 10px 14px; border-radius: var(--radius-sm);
  font-size: 12px; line-height: 1.5; margin-bottom: 14px;
  border: 1px solid var(--border);
}
.login-result.ok   { border-color: rgba(16,185,129,0.4); background: rgba(16,185,129,0.08); color: var(--up); }
.login-result.fail { border-color: rgba(239,68,68,0.4);  background: rgba(239,68,68,0.08);  color: var(--down); }

/* Steps */
.login-steps {
  display: flex; flex-direction: column; gap: 8px;
  border-top: 1px solid var(--border); padding-top: 18px; margin-top: 6px;
}
.ls-item {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 11.5px; color: var(--muted); line-height: 1.5;
}
.ls-num {
  flex-shrink: 0; width: 18px; height: 18px;
  border-radius: 50%; background: var(--border-2);
  display: grid; place-items: center;
  font-size: 10px; font-weight: 700; color: var(--text);
}
.login-simple-note { background:rgba(245,158,11,0.1); border:1px solid rgba(245,158,11,0.3); border-radius:6px; padding:8px 12px; font-size:12px; color:var(--gold); margin-bottom:12px; }

/* ── AI Analysis Panel ──────────────────────────────────────────────────── */
.bt-ai-placeholder, .bt-ai-loading { color: var(--muted); font-size: 12px; padding: 12px 0; }
.bt-ai-loading { color: var(--gold); }
.bt-ai-error   { color: var(--down); font-size: 12px; padding: 8px 0; }
.ai-diagnosis  { font-size: 12px; color: var(--text); background: rgba(255,255,255,0.03); border-left: 3px solid var(--gold); padding: 8px 12px; border-radius: 0 4px 4px 0; margin-bottom: 14px; }
.ai-section-head { font-size: 10px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); margin: 14px 0 6px; }
.ai-issues, .ai-recs { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; }
.ai-issue { border-radius: 6px; padding: 8px 10px; font-size: 11.5px; border: 1px solid var(--border); }
.ai-issue-high   { border-color: rgba(239,68,68,0.4); background: rgba(239,68,68,0.06); }
.ai-issue-medium { border-color: rgba(245,158,11,0.4); background: rgba(245,158,11,0.06); }
.ai-issue-low    { border-color: var(--border); }
.ai-issue-label  { font-weight: 600; color: var(--text); }
.ai-issue-impact { font-size: 10px; margin-left: 8px; opacity: 0.7; text-transform: uppercase; letter-spacing: 0.05em; }
.ai-issue-detail { color: var(--muted); margin-top: 3px; font-size: 11px; }
.ai-rec { display: grid; grid-template-columns: 160px 120px 1fr; gap: 8px; align-items: start; padding: 7px 0; border-bottom: 1px solid rgba(255,255,255,0.05); font-size: 11.5px; }
.ai-rec-param code { background: rgba(255,255,255,0.07); padding: 1px 5px; border-radius: 3px; font-family: var(--mono); font-size: 10.5px; }
.ai-rec-change { display: flex; align-items: center; gap: 6px; font-family: var(--mono); }
.ai-rec-old    { color: var(--down); text-decoration: line-through; }
.ai-rec-new    { color: var(--up); font-weight: 700; }
.ai-rec-arrow  { color: var(--muted); }
.ai-rec-reason { color: var(--muted); font-size: 11px; }
.ai-expected   { font-size: 12px; color: var(--text); margin-top: 12px; padding: 8px 10px; background: rgba(16,185,129,0.06); border-radius: 6px; border: 1px solid rgba(16,185,129,0.2); }
.ai-applied    { margin-top: 12px; padding: 10px 12px; background: rgba(16,185,129,0.08); border: 1px solid rgba(16,185,129,0.3); border-radius: 6px; font-size: 12px; }
.ai-applied ul { margin: 6px 0 0 16px; color: var(--muted); font-size: 11px; }

/* ── Date input with calendar button ───────────────────────────────────── */
.date-input-wrap { display: flex; align-items: center; gap: 0; }
.date-input-wrap input[type="date"] { flex: 1; border-radius: var(--radius-sm) 0 0 var(--radius-sm) !important; }
.date-cal-btn { padding: 0 9px; height: 34px; border: 1px solid var(--border); border-left: none; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: var(--border); color: var(--text); cursor: pointer; font-size: 14px; transition: background 0.15s; }
.date-cal-btn:hover { background: var(--border-2); }

/* ── Backtest Run Modal ─────────────────────────────────────────────────── */
.btm-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.75); z-index: 9000; display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.25s; }
.btm-overlay.open { opacity: 1; }
.btm-box { width: 640px; max-width: 95vw; background: var(--panel); border: 1px solid var(--border-2); border-radius: 12px; overflow: hidden; transform: scale(0.95); transition: transform 0.25s; box-shadow: 0 24px 80px rgba(0,0,0,0.5); }
.btm-overlay.open .btm-box { transform: scale(1); }
.btm-header { display: flex; align-items: center; gap: 14px; padding: 18px 20px 14px; border-bottom: 1px solid var(--border); }
.btm-anim { display: flex; gap: 5px; align-items: center; }
.btm-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--gold); animation: btm-pulse 1.2s ease-in-out infinite; }
.btm-dot:nth-child(2) { animation-delay: 0.2s; }
.btm-dot:nth-child(3) { animation-delay: 0.4s; }
@keyframes btm-pulse { 0%,100% { opacity: 0.3; transform: scale(0.8); } 50% { opacity: 1; transform: scale(1.2); } }
.btm-title-wrap { flex: 1; }
.btm-title  { font-size: 14px; font-weight: 700; color: var(--text); }
.btm-status { font-size: 11px; color: var(--muted); margin-top: 2px; }
.btm-eta    { font-family: var(--mono); font-size: 12px; color: var(--gold); }
.btm-progress-track { height: 3px; background: var(--border); }
.btm-progress-fill  { height: 100%; background: linear-gradient(90deg, var(--gold), #f59e0b); width: 0%; transition: width 0.6s ease; }
.btm-log { height: 260px; overflow-y: auto; padding: 12px 16px; font-family: var(--mono); font-size: 11.5px; display: flex; flex-direction: column; gap: 3px; }
.btm-row      { color: var(--muted); }
.btm-row.ok   { color: var(--up); font-weight: 600; }
.btm-row.warn { color: var(--gold); }
.btm-row.err  { color: var(--down); }
.btm-footer { padding: 10px 20px 14px; border-top: 1px solid var(--border); text-align: center; }

/* ── AurumAI Analysis Modal ─────────────────────────────────────────────── */
.aurum-ai-box     { width: 700px; }
.aurum-ai-header  { background: linear-gradient(135deg, rgba(245,158,11,0.12), rgba(0,0,0,0)); }
.aurum-ai-brand   { display: flex; align-items: center; gap: 12px; flex: 1; }
.aurum-ai-logo    { width: 36px; height: 36px; border-radius: 8px; background: var(--gold); color: #000; display: grid; place-items: center; font-weight: 900; font-size: 18px; flex-shrink: 0; }
.aurum-ai-progress-fill { height: 100%; background: linear-gradient(90deg, var(--gold), #f97316, #ec4899); width: 0%; transition: width 0.8s ease; }
.aurum-ai-steps   { display: flex; flex-direction: column; gap: 8px; padding: 14px 20px; border-bottom: 1px solid var(--border); }
.ai-step          { font-size: 12px; color: var(--text); transition: opacity 0.4s, color 0.4s; display: flex; align-items: center; gap: 8px; }
.ai-step::before  { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); flex-shrink: 0; }
.aurum-ai-log     { height: 160px; }

/* ── AI Info button + Send Info Popup ───────────────────────────────────── */
.qt-ai-info-btn { width:22px;height:22px;border-radius:50%;border:1px solid rgba(124,58,237,0.5);background:rgba(124,58,237,0.12);color:#c4b5fd;font-size:12px;cursor:pointer;line-height:1;padding:0;flex-shrink:0; }
.qt-ai-info-btn:hover { background:rgba(124,58,237,0.25); }
.ai-info-overlay { position:fixed; top:70px; left:50%; transform:translateX(-50%); z-index:9100; display:flex; opacity:0; pointer-events:none; transition:opacity 0.22s; }
.ai-info-overlay.open { opacity:1; pointer-events:all; }
.ai-info-box { width:420px; background:var(--panel); border:1px solid var(--border-2); border-radius:10px; box-shadow:0 16px 50px rgba(0,0,0,0.55); overflow:hidden; }
.ai-info-header { display:flex; justify-content:space-between; align-items:center; padding:12px 14px; background:rgba(124,58,237,0.1); border-bottom:1px solid var(--border); font-size:13px; font-weight:700; color:#c4b5fd; }
.ai-info-body { padding:12px 14px; display:flex; flex-direction:column; gap:10px; max-height:70vh; overflow-y:auto; }
.ai-info-label { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin-bottom:5px; }
.ai-info-val { font-size:12px; color:var(--text); }
.ai-info-rows { display:flex; flex-direction:column; gap:3px; }
.ai-info-row { display:flex; justify-content:space-between; font-size:11.5px; padding:3px 6px; background:rgba(255,255,255,0.04); border-radius:4px; }
.ai-info-row span:first-child { color:var(--muted); }
.ai-info-note { background:rgba(16,185,129,0.07); border:1px solid rgba(16,185,129,0.2); border-radius:6px; padding:8px 10px; font-size:11px; color:var(--muted); }

/* ── Auth Overlay ─────────────────────────────────────────────────────── */
.auth-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.85); z-index:9999; display:flex; align-items:center; justify-content:center; }
.auth-box     { width:420px; background:var(--panel); border:1px solid var(--border-2); border-radius:14px; padding:32px; box-shadow:0 24px 80px rgba(0,0,0,0.6); }
.auth-form    { display:flex; flex-direction:column; gap:12px; margin:16px 0; }
.auth-field   { display:flex; flex-direction:column; gap:5px; }
.auth-field label { font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.auth-field input { background:var(--input); border:1px solid var(--border); color:var(--text); padding:9px 12px; border-radius:var(--radius-sm); font-size:14px; font-family:var(--font); }
.auth-field input:focus { border-color:var(--gold); outline:none; }
.auth-submit-btn { width:100%; padding:10px; font-size:14px; font-weight:700; }
.auth-links   { display:flex; justify-content:space-between; margin-top:14px; }
.auth-links a { font-size:12px; color:var(--gold); text-decoration:none; }
.auth-links a:hover { text-decoration:underline; }
.auth-result  { padding:8px 12px; border-radius:6px; font-size:12px; margin-top:10px; }
.auth-result.ok   { background:rgba(16,185,129,0.1); border:1px solid rgba(16,185,129,0.3); color:var(--up); }
.auth-result.fail { background:rgba(239,68,68,0.1);  border:1px solid rgba(239,68,68,0.3);  color:var(--down); }

.ai-on  { color: #a78bfa !important; border-color: rgba(167,139,250,0.4) !important; background: rgba(167,139,250,0.08) !important; }
.ai-off { color: var(--muted) !important; border-color: var(--border) !important; }

/* ── Predict Button ───────────────────────────────────────────────────── */
.qt-pred-btn { padding:5px 10px; font-size:12px; font-weight:600; border-radius:6px; cursor:pointer; border:1px solid rgba(251,191,36,0.35); background:rgba(251,191,36,0.07); color:#fbbf24; transition:all .2s; white-space:nowrap; }
.qt-pred-btn:hover { background:rgba(251,191,36,0.15); border-color:#fbbf24; }
.qt-pred-btn.running { opacity:.6; cursor:not-allowed; }

/* ── Predict Panel ────────────────────────────────────────────────────── */
.pred-panel { position:fixed; left:16px; top:120px; width:320px; background:var(--panel); border:1px solid rgba(251,191,36,0.3); border-radius:12px; box-shadow:0 8px 32px rgba(0,0,0,0.5); z-index:500; font-size:12px; overflow:hidden; }
.pred-header { display:flex; align-items:center; justify-content:space-between; padding:10px 14px 8px; border-bottom:1px solid var(--border); }
.pred-title  { font-weight:700; font-size:13px; color:#fbbf24; }
.pred-close  { background:none; border:none; color:var(--muted); cursor:pointer; font-size:14px; padding:0 2px; }
.pred-close:hover { color:var(--text); }

/* Probability bar */
.pred-prob-row { padding:10px 14px 6px; }
.pred-bar-wrap { display:flex; height:10px; border-radius:5px; overflow:hidden; margin-bottom:4px; }
.pred-bar-bull { background:var(--up);   height:100%; transition:width .4s; }
.pred-bar-bear { background:var(--down); height:100%; transition:width .4s; }
.pred-bar-labels { display:flex; justify-content:space-between; }
.pred-bull-pct { color:var(--up);   font-weight:700; font-size:11px; }
.pred-bear-pct { color:var(--down); font-weight:700; font-size:11px; }

/* Candle boxes */
.pred-candles { display:flex; gap:6px; padding:8px 14px; }
.pred-candle-box,.pred-conf-box { flex:1; background:rgba(255,255,255,0.04); border:1px solid var(--border); border-radius:7px; padding:7px 6px; text-align:center; }
.pred-candle-label { font-size:10px; color:var(--muted); margin-bottom:3px; }
.pred-candle-dir   { font-size:14px; font-weight:800; }
.pred-candle-dir.bull { color:var(--up); }
.pred-candle-dir.bear { color:var(--down); }
.pred-candle-dir.neut { color:var(--muted); }
.pred-conf-val { font-size:14px; font-weight:700; color:#fbbf24; }

/* LLM reasoning */
.pred-reasoning { margin:0 14px 8px; padding:8px 10px; background:rgba(167,139,250,0.07); border:1px solid rgba(167,139,250,0.2); border-radius:7px; color:#c4b5fd; font-size:11px; line-height:1.5; }

/* Signals */
.pred-signals { padding:4px 14px 8px; }
.pred-sig-title { font-size:10px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; margin-bottom:5px; }
.pred-sig-row { display:flex; align-items:center; gap:6px; margin-bottom:4px; }
.pred-sig-name { width:70px; font-size:10px; font-weight:700; color:var(--muted); }
.pred-sig-bar-wrap { flex:1; height:5px; background:rgba(255,255,255,0.07); border-radius:3px; overflow:hidden; }
.pred-sig-bar { height:100%; border-radius:3px; transition:width .3s; }
.pred-sig-bar.bull { background:var(--up); }
.pred-sig-bar.bear { background:var(--down); }
.pred-sig-label { font-size:10px; color:var(--muted); width:130px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Options + actions */
.pred-opts { padding:4px 14px 6px; }
.pred-opt-label { display:flex; align-items:center; gap:6px; color:var(--muted); font-size:11px; cursor:pointer; }
.pred-actions { display:flex; gap:8px; padding:0 14px 10px; }
.pred-run-btn { flex:1; padding:7px; font-size:12px; font-weight:700; border-radius:7px; cursor:pointer; border:1px solid rgba(251,191,36,0.4); background:rgba(251,191,36,0.1); color:#fbbf24; transition:all .2s; }
.pred-run-btn:hover:not(:disabled) { background:rgba(251,191,36,0.2); }
.pred-run-btn:disabled { opacity:.5; cursor:not-allowed; }
.pred-bt-btn  { padding:7px 10px; font-size:11px; font-weight:600; border-radius:7px; cursor:pointer; border:1px solid var(--border); background:var(--input); color:var(--muted); transition:all .2s; }
.pred-bt-btn:hover:not(:disabled) { color:var(--text); border-color:rgba(255,255,255,0.3); }
.pred-bt-btn:disabled { opacity:.5; cursor:not-allowed; }

/* Backtest results */
.pred-bt-results { border-top:1px solid var(--border); padding:10px 14px; max-height:220px; overflow-y:auto; }
.pred-bt-title   { font-size:10px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; margin-bottom:8px; }
.pred-bt-stat    { display:flex; justify-content:space-between; margin-bottom:4px; font-size:11px; }
.pred-bt-stat span:last-child { font-weight:700; }
.pred-bt-stat .up   { color:var(--up); }
.pred-bt-stat .gold { color:#fbbf24; }
.pred-bt-combo-title { font-size:10px; color:var(--muted); margin:8px 0 4px; }
.pred-bt-combo { font-size:10px; color:var(--text); padding:5px 7px; background:rgba(255,255,255,0.04); border-radius:5px; margin-bottom:3px; }
.pred-bt-combo .acc { font-weight:700; }
.pred-bt-combo .acc.good { color:var(--up); }
.pred-bt-combo .acc.ok   { color:#fbbf24; }
.pred-bt-combo .acc.low  { color:var(--muted); }
.pred-bt-sig-row { display:flex; justify-content:space-between; font-size:10px; margin-bottom:2px; }
.pred-bt-sig-row .name  { color:var(--muted); }
.pred-bt-sig-row .bull-acc { color:var(--up); }
.pred-bt-sig-row .bear-acc { color:var(--down); }

/* Confidence badge */
/* Drawing toolbar */
.dt-toolbar { position:absolute; left:50%; top:8px; transform:translateX(-50%); z-index:40; display:flex; flex-direction:row; gap:4px; }
.dt-btn { width:28px; height:28px; border:1px solid rgba(255,255,255,0.1); border-radius:5px; background:rgba(15,15,26,0.82); color:#94a3b8; font-size:13px; cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; transition:background .15s,border-color .15s,color .15s; }
.dt-btn:hover { background:rgba(255,255,255,0.08); border-color:rgba(255,255,255,0.2); color:#e2e8f0; }
.dt-btn.active { background:rgba(245,158,11,0.18); border-color:#f59e0b; color:#fbbf24; }
.dt-clear { border-color:rgba(239,68,68,0.25); color:#f87171; }
.dt-clear:hover { background:rgba(239,68,68,0.12); border-color:#ef4444; }

.pred-no-edge-banner { margin:0 14px 8px; padding:10px 12px; border-radius:8px; font-size:11px; line-height:1.6; background:rgba(100,116,139,0.12); border:1px solid rgba(100,116,139,0.3); color:#94a3b8; font-weight:600; letter-spacing:.02em; }
.pred-conf-badge { margin:0 14px 6px; padding:6px 9px; border-radius:7px; font-size:11px; line-height:1.5; background:rgba(255,255,255,0.04); border:1px solid var(--border); }
.pred-badge { display:inline-block; padding:1px 7px; border-radius:4px; font-size:10px; font-weight:800; letter-spacing:.06em; margin-right:5px; }
.pred-badge.high { background:rgba(52,211,153,0.18); color:#34d399; border:1px solid rgba(52,211,153,0.3); }
.pred-badge.med  { background:rgba(251,191,36,0.15); color:#fbbf24; border:1px solid rgba(251,191,36,0.3); }
.pred-badge.low  { background:rgba(148,163,184,0.1); color:var(--muted); border:1px solid var(--border); }

/* Session badge */
.pred-session { margin:0 14px 6px; font-size:10px; color:var(--muted); padding:3px 9px; }

/* Signal weight badge */
.pred-sig-weight { font-size:9px; color:#fbbf24; min-width:28px; text-align:right; }

/* Accuracy color classes used in backtest */
.pred-acc-high { color:var(--up); font-weight:700; }
.pred-acc-med  { color:#fbbf24; font-weight:700; }
.pred-acc-low  { color:var(--muted); }

/* Confidence bands table */
.pred-band-table { width:100%; border-collapse:collapse; font-size:10px; margin-top:4px; }
.pred-band-table th { color:var(--muted); text-align:left; padding:3px 4px; border-bottom:1px solid var(--border); }
.pred-band-table td { padding:3px 4px; border-bottom:1px solid rgba(255,255,255,0.04); }
.pred-bt-best-row td { background:rgba(52,211,153,0.07); }

/* Status */
.pred-status { padding:0 14px 10px; font-size:11px; color:var(--muted); min-height:16px; }

/* ── AI Intelligence Blocks ─────────────────────────────────────────────── */
.aia-conf-breakdown { padding:10px 14px 4px; }
.aia-conf-bd-title { font-size:9px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin-bottom:6px; }
.aia-conf-bd-grid { display:grid; grid-template-columns:1fr 1fr; gap:4px 12px; }
.aia-conf-bd-row { display:flex; align-items:center; gap:6px; }
.aia-conf-bd-label { font-size:9px; color:var(--muted); width:58px; text-transform:uppercase; letter-spacing:.04em; }
.aia-conf-bd-bar-bg { flex:1; height:4px; background:rgba(255,255,255,0.08); border-radius:2px; overflow:hidden; }
.aia-conf-bd-bar { height:100%; border-radius:2px; transition:width .3s; }
.aia-conf-bd-val { font-size:9px; font-family:var(--mono); color:var(--muted); width:26px; text-align:right; }

.aia-counter-arg { margin:6px 14px 0; padding:8px 10px; background:rgba(234,179,8,0.07); border-left:2px solid rgba(234,179,8,0.4); border-radius:0 4px 4px 0; }
.aia-counter-arg-label { font-size:8px; color:var(--gold); text-transform:uppercase; letter-spacing:.08em; margin-bottom:3px; }
.aia-counter-arg-text { font-size:10px; color:rgba(255,255,255,0.7); line-height:1.5; }

.aia-invalidation { display:flex; align-items:center; gap:8px; padding:6px 14px; }
.aia-inv-label { font-size:9px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; white-space:nowrap; }
.aia-inv-price { font-size:11px; font-family:var(--mono); color:var(--down); font-weight:700; }
.aia-inv-cond { font-size:9px; color:rgba(255,255,255,0.5); }

.aia-alt-scenario { margin:4px 14px 8px; padding:8px 10px; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.07); border-radius:6px; }
.aia-alt-label { font-size:8px; color:var(--muted); text-transform:uppercase; letter-spacing:.08em; margin-bottom:4px; }
.aia-alt-row { display:flex; align-items:center; gap:8px; }
.aia-alt-signal { font-size:10px; font-weight:700; font-family:var(--mono); }
.aia-alt-signal.buy  { color:var(--up); }
.aia-alt-signal.sell { color:var(--down); }
.aia-alt-signal.hold { color:var(--muted); }
.aia-alt-prob { font-size:9px; color:var(--muted); font-family:var(--mono); }
.aia-alt-trigger { font-size:9px; color:rgba(255,255,255,0.5); flex:1; }