:root {
  --bg: #0b1220;
  --panel: #111b2e;
  --panel-soft: #0f1728;
  --border: rgba(148, 163, 184, 0.18);
  --text: #dbe6f3;
  --muted: #8fa3b8;
  --ok: #22c55e;
  --warn: #f59e0b;
  --err: #ef4444;
  --cold: #38bdf8;
}

body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,sans-serif}
.layout{display:flex;min-height:100vh}
.sidebar{min-width:220px;background:#111827;padding:16px;display:flex;flex-direction:column;gap:10px}
.sidebar a,.sidebar button{color:#dbe6f3;background:#1f2937;border:0;padding:11px;text-decoration:none;border-radius:8px}
.content{flex:1;padding:20px}
.card{background:#16202d;padding:16px;border-radius:10px;margin-bottom:12px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.badges span{display:inline-block;background:#193144;padding:6px 10px;border-radius:999px;margin:0 6px 8px 0;font-size:.75rem}
.flash.error{background:#5a1f2e;padding:10px}.flash.warn{background:#5b4c1d;padding:10px}.narrow{max-width:420px;margin:5vh auto}

.page-head {display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:22px}
.page-head h1 {margin:0 0 6px}
.muted {color:var(--muted);font-size:.92rem;margin:0}

.market-page-status {display:grid;gap:8px;justify-items:end}
.status-line {font-size:.84rem;color:var(--muted)}
.status-line strong{display:block;color:var(--text);margin-top:4px;font-variant-numeric:tabular-nums}
.status-chip{border-radius:999px;padding:6px 10px;font-size:.8rem;font-weight:700}
.status-live{background:rgba(34,197,94,.18);color:#bbf7d0}
.status-updating{background:rgba(14,165,233,.18);color:#bae6fd}
.status-error{background:rgba(239,68,68,.18);color:#fecaca}
.status-stale{background:rgba(245,158,11,.18);color:#fde68a}

.markets-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(430px,1fr));gap:18px;align-items:start}
.market-card {background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:18px;overflow:hidden}
.market-card-head {display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:16px}
.market-card h2 {margin:0 0 4px;font-size:1.05rem;letter-spacing:.02em}
.market-freshness{padding:5px 9px;border-radius:999px;font-size:.75rem;font-weight:700}
.fresh-ok{background:rgba(34,197,94,.16);color:#bbf7d0}
.fresh-stale{background:rgba(245,158,11,.16);color:#fde68a}
.fresh-none{background:rgba(148,163,184,.18);color:#cbd5e1}

.market-table-wrap {width:100%;overflow-x:auto;border-radius:10px;border:1px solid rgba(148,163,184,.12);background:var(--panel-soft)}
.market-table {width:100%;border-collapse:collapse;min-width:860px;font-size:.86rem}
.market-table th {position:sticky;top:0;text-align:left;color:var(--muted);font-weight:600;padding:10px 12px;background:rgba(15,23,42,.95);border-bottom:1px solid rgba(148,163,184,.14);white-space:nowrap}
.market-table td {padding:11px 12px;border-bottom:1px solid rgba(148,163,184,.08);vertical-align:middle}
.market-table tbody tr:last-child td {border-bottom:none}

.tf-pill {display:inline-flex;align-items:center;justify-content:center;min-width:38px;padding:4px 8px;border-radius:999px;background:rgba(14,165,233,.13);color:#bae6fd;font-weight:700;font-size:.78rem}
.num {font-variant-numeric:tabular-nums;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;color:#dbeafe;white-space:nowrap}
.price {color:#f8fafc;font-weight:700}
.updated {color:#94a3b8;font-size:.78rem;white-space:nowrap}
.empty-cell {color:#94a3b8;font-style:italic}
.rsi-cold{color:var(--cold)!important;font-weight:700}
.rsi-hot{color:#fb923c!important;font-weight:700}
.trend-up td{background:rgba(34,197,94,.05)}
.trend-down td{background:rgba(239,68,68,.05)}

@media (max-width: 900px) {
  .sidebar{min-width:88px}
  .content{padding:14px}
  .page-head {flex-direction:column}
  .market-page-status{justify-items:start}
  .markets-grid {grid-template-columns:1fr}
  .market-card {padding:14px}
}

/* --- Signals readability --- */

.signals-list {
  display: grid;
  gap: 16px;
}

.signal-card {
  border: 1px solid rgba(148, 163, 184, 0.12);
}

.signal-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  margin-bottom: 16px;
}

.signal-head h2 {
  margin: 0 0 4px;
}

.signal-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.direction,
.regime {
  display: inline-flex;
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
  background: rgba(148, 163, 184, 0.12);
}

.direction-no-trade {
  color: #cbd5e1;
}

.direction-watch {
  color: #fde68a;
  background: rgba(245, 158, 11, 0.15);
}

.direction-long-candidate {
  color: #bbf7d0;
  background: rgba(34, 197, 94, 0.14);
}

.direction-short-candidate {
  color: #fecaca;
  background: rgba(239, 68, 68, 0.14);
}

.confidence-wrap {
  margin: 12px 0 18px;
}

.confidence-meta {
  display: flex;
  justify-content: space-between;
  color: #94a3b8;
  font-size: 0.85rem;
  margin-bottom: 6px;
}

.confidence-bar {
  height: 8px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.12);
  overflow: hidden;
}

.confidence-bar span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #0ea5e9, #22c55e);
  border-radius: inherit;
}

.signal-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.signal-grid h3 {
  margin: 0 0 8px;
  font-size: 0.92rem;
  color: #cbd5e1;
}

.signal-grid ul {
  margin: 0;
  padding-left: 18px;
  color: #dbeafe;
}

.signal-grid li {
  margin-bottom: 5px;
}

.signal-levels {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.signal-levels span {
  padding: 6px 9px;
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.75);
  color: #cbd5e1;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 760px) {
  .signal-head,
  .signal-grid {
    grid-template-columns: 1fr;
    flex-direction: column;
  }

  .signal-badges {
    justify-content: flex-start;
  }
}

/* --- Paper trades readability --- */

.trade-table-wrap {
  width: 100%;
  overflow-x: auto;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.10);
}

.trade-table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
  font-size: 0.88rem;
}

.trade-table th {
  text-align: left;
  color: #8fa3b8;
  font-weight: 600;
  padding: 10px 12px;
  background: rgba(15, 23, 42, 0.75);
  border-bottom: 1px solid rgba(148, 163, 184, 0.10);
  white-space: nowrap;
}

.trade-table td {
  padding: 11px 12px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.08);
  vertical-align: middle;
}

.trade-table tbody tr:last-child td {
  border-bottom: none;
}

.trade-side,
.trade-status {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
}

.side-long {
  color: #bbf7d0;
  background: rgba(34, 197, 94, 0.14);
}

.side-short {
  color: #fecaca;
  background: rgba(239, 68, 68, 0.14);
}

.status-open {
  color: #bae6fd;
  background: rgba(14, 165, 233, 0.14);
}

.pnl-positive {
  color: #86efac;
}

.pnl-negative {
  color: #fca5a5;
}

.perf-metrics-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}

.perf-metric {
  margin-bottom: 0;
  border: 1px solid rgba(148, 163, 184, 0.10);
}

.perf-metric h3 {
  margin: 0 0 6px;
  color: #8fa3b8;
  font-size: 0.84rem;
}

.perf-metric p {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.risk-warning{color:#fdba74;font-weight:700}


.grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1rem; }

.backtesting-page .muted{color:#9fb2c7}.bt-header{display:flex;justify-content:space-between;align-items:center;gap:1rem}.badges{display:flex;gap:.5rem;flex-wrap:wrap}.badge{background:#1f2937;border:1px solid #334155;color:#cbd5e1;padding:.2rem .55rem;border-radius:999px;font-size:.75rem}.bt-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.7rem;margin:.7rem 0 1rem}.metric{border:1px solid #334155;background:#111827;padding:.6rem .7rem;border-radius:10px}.metric label{display:block;color:#93a4b8;font-size:.78rem}.metric strong{font-size:.95rem}.metric.good{border-color:#166534}.metric.warn{border-color:#a16207}.metric.bad{border-color:#991b1b}.panel{border:1px solid #7c2d12;background:#1f2937;border-radius:10px;padding:.75rem}

.profile-badge{padding:.2rem .45rem;border-radius:999px;border:1px solid #334155;font-size:.72rem}.profile-badge.strict{background:#1f2937;color:#cbd5e1}.profile-badge.balanced{background:#1e3a8a;color:#bfdbfe}.profile-badge.aggressive{background:#7f1d1d;color:#fecaca}
