* { margin:0; padding:0; box-sizing:border-box; }
html, body { width:100%; max-width:100%; overflow-x:hidden; }
body { font-family:system-ui,'Segoe UI',Tahoma,sans-serif; background:#0a0e17; color:#e6edf3; min-height:100vh; }
.topbar { display:flex; justify-content:space-between; align-items:center; padding:14px 20px; background:#101624; border-bottom:1px solid #1e2740; flex-wrap:wrap; gap:10px; }
.brand { display:flex; align-items:center; gap:12px; }
.logo { width:44px; height:44px; border-radius:12px; background:linear-gradient(135deg,#f59e0b,#ef4444); color:#fff; font-weight:800; font-size:22px; display:flex; align-items:center; justify-content:center; }
h1 { font-size:17px; }
.status { font-size:12px; color:#8b98ad; margin-top:2px; }
.actions { display:flex; gap:8px; flex-wrap:wrap; }
.btn { padding:8px 14px; border-radius:9px; border:1px solid #2c3b55; background:#16202f; color:#e6edf3; font-size:13px; cursor:pointer; }
.btn:hover { filter:brightness(1.15); }
.btn.primary { background:linear-gradient(135deg,#f59e0b,#ef4444); border:0; color:#fff; font-weight:700; }
.btn.ghost { background:transparent; }
.btn.small { padding:7px 12px; font-size:12px; }
.timeframe-bar { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:10px 20px 0; flex-wrap:wrap; }
.timeframe-control { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.timeframe-control label { font-size:12px; color:#8b98ad; }
.timeframe-control select { padding:7px 30px 7px 10px; border-radius:8px; border:1px solid #2c3b55; background:#101624; color:#e6edf3; font-size:13px; }
.model-notice { color:#fbbf24; background:#2a2110; border:1px solid #5c4514; border-radius:9px; padding:7px 10px; font-size:12px; }
.hidden { display:none; }
.stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; padding:14px 20px; }
.card { background:#131a2b; border:1px solid #1e2740; border-radius:12px; padding:14px; text-align:center; }
.card .num { font-size:24px; font-weight:800; }
.card .lbl { font-size:12px; color:#8b98ad; margin-top:4px; }
.tabs { display:flex; gap:6px; padding:0 20px; border-bottom:1px solid #1e2740; }
.tab { padding:10px 16px; background:transparent; border:0; color:#8b98ad; font-size:14px; cursor:pointer; border-bottom:2px solid transparent; }
.tab.active { color:#f59e0b; border-bottom-color:#f59e0b; font-weight:700; }
main { padding:16px 20px; width:100%; max-width:1600px; margin:0 auto; }
.view { display:none; }
.view.active { display:block; }
.filters { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:12px; }
.filters label { font-size:12px; color:#8b98ad; }
.filters input { padding:7px 10px; border-radius:8px; border:1px solid #2c3b55; background:#101624; color:#e6edf3; font-size:13px; width:120px; }
#btSymbols { width:260px; max-width:100%; }
.hint { font-size:12px; color:#8b98ad; }
.table-wrap { width:100%; max-width:100%; overflow:hidden; border:1px solid #1e2740; border-radius:12px; }
table { width:100%; max-width:100%; border-collapse:collapse; font-size:12px; }
th, td { padding:8px 6px; text-align:center; white-space:nowrap; border-bottom:1px solid #161e31; }
th { background:#101624; color:#8b98ad; font-weight:600; font-size:12px; }
tr:hover td { background:#141c2e; }
.sym { font-weight:800; color:#f59e0b; }
.name { color:#aab4c6; display:inline-block; max-width:150px; overflow:hidden; text-overflow:ellipsis; }
.score { font-weight:800; }
.score.hi { color:#22c55e; }
.score.mid { color:#eab308; }
.score.lo { color:#f87171; }
.up { color:#22c55e; }
.down { color:#f87171; }
.chip { display:inline-block; padding:2px 8px; border-radius:999px; font-size:11px; margin:1px; background:#1c2740; color:#93a3c4; }
.chip.hot { background:#3a2a10; color:#fbbf24; }
.chip.reason { background:#101b2e; color:#7dd3fc; }
.chip.positive { background:#102d22; color:#6ee7a3; }
.chip.negative { background:#351a22; color:#fda4af; }
.pro-cell { min-width:0; max-width:250px; white-space:normal; overflow-wrap:anywhere; text-align:start; line-height:1.55; font-size:10px; color:#aab4c6; }
.risk-note { color:#fbbf24; margin-top:4px; }
button.link { background:none; border:1px solid #2c3b55; color:#7dd3fc; border-radius:7px; padding:4px 10px; font-size:12px; cursor:pointer; }
button.link:hover { background:#16263d; }
.fav { background:none; border:0; color:#5b6b86; font-size:16px; cursor:pointer; padding:2px 6px; }
.fav:hover { color:#fbbf24; }
.fav.on { color:#fbbf24; }
.inline-check { display:inline-flex; align-items:center; gap:5px; font-size:12px; color:#8b98ad; cursor:pointer; }
.inline-check input { width:auto; accent-color:#f59e0b; }
th[data-sort] { cursor:pointer; user-select:none; }
th[data-sort]:hover { color:#f59e0b; }
.modal { position:fixed; inset:0; background:rgba(0,0,0,.7); display:flex; align-items:center; justify-content:center; z-index:50; }
.modal.hidden { display:none; }
.modal-box { background:#121828; border:1px solid #26304a; border-radius:14px; padding:16px; width:min(840px,94vw); }
.modal-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.modal-head h2 { font-size:16px; }
canvas { width:100%; height:auto; background:#0e1420; border-radius:10px; }
.chart-meta { margin-top:10px; font-size:12px; color:#8b98ad; line-height:1.7; }
.rules pre { background:#0e1420; border:1px solid #1e2740; border-radius:10px; padding:16px; font-size:12px; overflow-x:auto; line-height:1.6; color:#c3cee0; white-space:pre-wrap; }
.rules-head { display:flex; align-items:center; gap:12px; margin-bottom:8px; flex-wrap:wrap; }
#alertBTResult { background:#0e1420; border:1px solid #1e2740; border-radius:10px; padding:16px; font-size:12px; overflow-x:auto; line-height:1.7; color:#c3cee0; white-space:pre-wrap; }
#btResult { margin-bottom:12px; font-size:13px; line-height:1.8; }
@media (max-width:1280px) {
  .table-wrap { overflow:visible; border:0; }
  table, tbody, tr, td { display:block; width:100%; }
  table thead { display:none; }
  table tbody { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:12px; }
  table tr { min-width:0; overflow:hidden; background:#111827; border:1px solid #1e2740; border-radius:12px; }
  table td { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; min-width:0; padding:8px 10px; white-space:normal; text-align:end; }
  table td::before { content:attr(data-label); flex:0 0 38%; color:#8b98ad; font-size:11px; font-weight:600; text-align:start; }
  table td > * { max-width:62%; }
  table td.empty-row { display:block; text-align:center; padding:18px; }
  table td.empty-row::before { content:none; }
  .pro-cell { width:100%; max-width:none; font-size:11px; }
  .name { max-width:100%; white-space:normal; overflow-wrap:anywhere; }
}
@media (max-width:640px) {
  .topbar, .timeframe-bar, .stats, main { padding-left:10px; padding-right:10px; }
  .tabs { padding:0 8px; flex-wrap:wrap; }
  .tab { flex:1 1 calc(50% - 6px); padding:9px 7px; white-space:normal; }
  .actions { width:100%; }
  .actions .btn { flex:1 1 auto; }
  .timeframe-control { width:100%; }
  .timeframe-control select { flex:1 1 120px; }
  .model-notice { width:100%; }
  .modal-box { padding:10px; width:98vw; max-height:96vh; overflow-y:auto; }
  .filters input { max-width:100%; }
  table tbody { grid-template-columns:minmax(0,1fr); }
  table td::before { flex-basis:42%; }
  table td > * { max-width:58%; }
}