*{box-sizing:border-box;margin:0;padding:0}
/* responsive-mode: applied on small viewports */
@media(max-width:768px){
  .responsive-mode #tabbar{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .responsive-mode .ctrl-btn{min-height:44px;min-width:44px}
  #mobile-nav{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--panel);border-top:1px solid var(--border);z-index:100}
}
/* 44px touch targets for mobile buttons */
.ctrl-btn{min-height:44px}
:root{
  --bg:#131722;--panel:#1e222d;--border:#2a2e39;--border2:#363a45;
  --txt:#d1d4dc;--txt2:#787b86;--txt3:#434651;
  --green:#26a69a;--red:#ef5350;--blue:#2196f3;--orange:#ff9800;--purple:#ab47bc;
  /* Updated for the bigger chrome: top bar 60 + tabs 48 = 108 (was 88). */
  --panel-h:calc(100vh - 108px);
  --panel-h-nomode:calc(100vh - 108px);
  --panel-h-withmode:calc(100vh - 158px);  /* + mode toggle bar 50px */
}
html,body{width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--txt);font-family:'Segoe UI',system-ui,sans-serif;font-size:16px;line-height:1.45}

/* TOP BAR — taller + more padding to fit the bumped fonts (44 → 60). */
#topbar{
  height:60px;background:var(--panel);border-bottom:1px solid var(--border);
  display:flex;align-items:center;padding:0 22px;gap:26px;flex-shrink:0;overflow:hidden;
}
#topbar .brand{font-size:19px;font-weight:700;color:#fff;letter-spacing:.5px;margin-right:8px}
#topbar .brand span{color:var(--blue)}
.topstat{display:flex;flex-direction:column;line-height:1.3}
.topstat .lbl{font-size:14px;color:var(--txt2);text-transform:uppercase;letter-spacing:.4px}
.topstat .val{font-size:17px;font-weight:600}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:5px}
.dot.green{background:var(--green)}.dot.red{background:var(--red)}.dot.orange{background:var(--orange)}
#topbar .spacer{flex:1}
#topbar .ctrl-btns{display:flex;gap:6px}
.ctrl-btn{padding:8px 18px;border:none;border-radius:4px;cursor:pointer;font-size:15px;font-weight:600;letter-spacing:.3px}
.ctrl-btn.start{background:var(--green);color:#000}
.ctrl-btn.stop{background:var(--red);color:#fff}
.ctrl-btn.pause{background:var(--orange);color:#000}
.ctrl-btn:hover{filter:brightness(1.15)}

/* TABS — taller (36 → 48) + more padding so the larger labels breathe. */
#tabbar{
  height:48px;background:var(--panel);border-bottom:1px solid var(--border);
  display:flex;align-items:stretch;padding:0 22px;gap:4px;flex-shrink:0;
}
.tab{
  padding:0 22px;cursor:pointer;display:flex;align-items:center;
  font-size:16px;font-weight:500;color:var(--txt2);border-bottom:3px solid transparent;
  transition:color .15s;user-select:none;
}
.tab:hover{color:var(--txt)}
.tab.active{color:#fff;border-bottom-color:var(--blue)}
.tab .tbadge{
  margin-left:5px;background:var(--red);color:#fff;
  font-size:14px;padding:1px 5px;border-radius:8px;font-weight:700;
}

/* LAYOUT */
#panes{height:var(--panel-h);position:relative}
body.has-mode-bar #panes{height:var(--panel-h-withmode)}
.pane{position:absolute;inset:0;display:none;padding:10px;gap:10px;overflow:hidden}
.pane.active{display:flex;overflow:hidden}

/* PANELS — bumped header + body padding for the larger fonts. */
.card{background:var(--panel);border:1px solid var(--border);border-radius:6px;overflow:hidden;display:flex;flex-direction:column}
.card-hd{
  padding:10px 16px;border-bottom:1px solid var(--border);flex-shrink:0;
  font-size:15px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--txt2);
  display:flex;align-items:center;gap:8px;
}
.card-hd .title{flex:1}
.card-body{padding:14px 16px;overflow:hidden}
.card-body.scrollable{overflow-y:auto;overflow-x:hidden}
.card-body.scroll-y{overflow-y:auto}

/* TABLES */
.tbl{width:100%;border-collapse:collapse}
.tbl th{
  text-align:left;padding:8px 12px;font-size:14px;font-weight:600;
  text-transform:uppercase;letter-spacing:.4px;color:var(--txt2);
  border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--panel);z-index:1;
}
.tbl td{padding:8px 12px;border-bottom:1px solid var(--border2);font-size:15px;vertical-align:middle}
.tbl tr:hover td{background:rgba(255,255,255,.03)}
.mono{font-family:'Consolas','Courier New',monospace;font-size:15px}
.scroll-wrap{overflow-y:auto;overflow-x:hidden;flex:1;min-height:0}
.scroll-wrap::-webkit-scrollbar{width:4px}
.scroll-wrap::-webkit-scrollbar-track{background:transparent}
.scroll-wrap::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px}

/* BADGES */
.badge-pill{display:inline-block;padding:1px 7px;border-radius:10px;font-size:14px;font-weight:600;letter-spacing:.2px}
.badge-long{background:rgba(38,166,154,.2);color:var(--green);border:1px solid rgba(38,166,154,.35)}
.badge-short{background:rgba(239,83,80,.2);color:var(--red);border:1px solid rgba(239,83,80,.35)}
.badge-neutral{background:rgba(120,123,134,.15);color:var(--txt2);border:1px solid var(--border)}
.badge-ok{background:rgba(38,166,154,.2);color:var(--green);border:1px solid rgba(38,166,154,.35)}
.badge-warn{background:rgba(255,152,0,.2);color:var(--orange);border:1px solid rgba(255,152,0,.35)}
.badge-err{background:rgba(239,83,80,.2);color:var(--red);border:1px solid rgba(239,83,80,.35)}
.badge-info{background:rgba(33,150,243,.2);color:var(--blue);border:1px solid rgba(33,150,243,.35)}

/* PNL */
.pos{color:var(--green)}.neg{color:var(--red)}.neu{color:var(--txt2)}

/* PROGRESS */
.prog-wrap{background:var(--border);border-radius:3px;height:14px;overflow:hidden;position:relative}
.prog-bar{height:100%;border-radius:3px;transition:width .4s}
.prog-val{position:absolute;right:6px;top:0;height:100%;display:flex;align-items:center;font-size:14px;font-weight:700;color:#fff}

/* STAT BOXES — more padding + bigger headline value. */
.stat-grid{display:grid;gap:10px}
.stat-box{background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:6px;padding:14px 16px}
.stat-box .s-lbl{font-size:13px;color:var(--txt2);text-transform:uppercase;letter-spacing:.4px;margin-bottom:6px}
.stat-box .s-val{font-size:28px;font-weight:700;font-family:'Consolas','Courier New',monospace}

/* TOGGLE */
.strat-toggle{position:relative;width:34px;height:18px;display:inline-block;vertical-align:middle}
.strat-toggle input{display:none}
.strat-toggle .slider{position:absolute;inset:0;border-radius:18px;background:var(--border2);cursor:pointer;transition:.2s}
.strat-toggle .slider:before{content:'';position:absolute;width:14px;height:14px;left:2px;top:2px;border-radius:50%;background:var(--txt2);transition:.2s}
.strat-toggle input:checked+.slider{background:var(--green)}
.strat-toggle input:checked+.slider:before{transform:translateX(16px);background:#fff}

/* PAIR BUTTONS */
.pair-btn{
  padding:4px 12px;border:1px solid var(--border);border-radius:3px;
  background:transparent;color:var(--txt2);cursor:pointer;font-size:15px;font-weight:500;
  transition:all .15s;
}
.pair-btn:hover{border-color:var(--blue);color:var(--txt)}
.pair-btn.active{border-color:var(--blue);background:rgba(33,150,243,.15);color:#fff}

/* KILL BUTTON */
.kill-btn{
  display:flex;align-items:center;justify-content:center;width:100%;padding:12px;
  border:1px solid rgba(239,83,80,.4);border-radius:4px;cursor:pointer;
  font-size:18px;font-weight:700;letter-spacing:1px;
  background:rgba(239,83,80,.12);color:var(--red);transition:all .2s;
}
.kill-btn:hover{background:rgba(239,83,80,.3);border-color:var(--red)}

/* LOGS */
#log-viewer{font-family:'Consolas','Courier New',monospace;font-size:15px;line-height:1.7;padding:8px;white-space:pre-wrap;word-break:break-all}
.ll-info{color:var(--txt)}
.ll-warn{color:var(--orange)}
.ll-error{color:var(--red)}
.ll-debug{color:var(--txt3)}
.ll-ai{color:#ab47bc}
.ll-risk{color:var(--red)}
.ll-exec{color:var(--green)}
.ll-data{color:var(--blue)}
.ll-tg{color:var(--orange)}

/* LAYOUT HELPERS */
.row{display:flex;gap:10px;flex:1;overflow:hidden;min-height:0}
.col{display:flex;flex-direction:column;gap:10px;overflow:hidden;min-height:0}
.flex1{flex:1;min-height:0;overflow:hidden}
.chart-canvas-wrap{flex:1;min-height:0;position:relative;padding:8px}
.chart-canvas-wrap canvas{position:absolute;inset:8px}

/* MISC */
select.fsel{background:var(--panel);border:1px solid var(--border);color:var(--txt);padding:3px 8px;border-radius:3px;font-size:15px;cursor:pointer;outline:none}
select.fsel:focus{border-color:var(--blue)}
input.finput{background:var(--panel);border:1px solid var(--border);color:var(--txt);padding:3px 8px;border-radius:3px;font-size:15px;outline:none}
input.finput:focus{border-color:var(--blue)}
.pair-cell{font-weight:600;letter-spacing:.3px}
.empty-st{color:var(--txt3);text-align:center;padding:24px;font-size:15px}
.sig-pulse{animation:pulse 1.5s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.tg-msg{border-bottom:1px solid var(--border2);padding:7px 0}
.tg-msg .tg-meta{font-size:14px;color:var(--txt2);margin-bottom:3px}
.tg-msg .tg-body{font-size:15px;line-height:1.5}

/* ── LABELING PANEL (Phase 58) ────────────────────────────────────── */
/* ── LABELING PANEL (Phase 58e) ───────────────────────────────── */
#tg-labeling-panel{background:#1a1a2e;display:flex;flex-direction:column;
  flex:1 1 0;min-height:0;height:0;overflow:hidden}
#lbl-stats-bar{display:flex;align-items:center;gap:0;padding:12px 16px;
  border-bottom:1px solid rgba(255,255,255,.1);background:rgba(0,0,0,.2);flex-shrink:0}
.lbl-stat-cell{display:flex;flex-direction:column;align-items:center;padding:0 16px}
.lbl-stat-cell+.lbl-stat-cell{border-left:1px solid rgba(255,255,255,.12)}
.lbl-stat-val{font-size:20px;font-weight:600;line-height:1.1}
.lbl-stat-label{font-size:15px;color:rgba(255,255,255,.5);margin-top:2px}
.lbl-conf-track-wrap{display:flex;align-items:center;gap:10px;flex:1;margin-left:20px}
.lbl-conf-track-label{font-size:15px;color:rgba(255,255,255,.5);white-space:nowrap}
.lbl-conf-track{flex:1;height:6px;background:rgba(255,255,255,.15);border-radius:3px;overflow:hidden}
.lbl-conf-fill{height:100%;border-radius:3px;transition:width .4s,background .4s}
.lbl-conf-pct{font-size:17px;font-weight:600;white-space:nowrap}
#lbl-queue-header{padding:8px 16px;display:flex;align-items:center;gap:10px;flex-shrink:0;
  border-bottom:1px solid rgba(255,255,255,.08)}
.lbl-queue-title{font-size:15px;font-weight:700;color:#fff;letter-spacing:.5px;text-transform:uppercase}
.lbl-queue-pill{background:rgba(255,255,255,.12);padding:2px 10px;border-radius:20px;
  font-size:15px;color:#fff}
.lbl-queue-hint{margin-left:auto;font-size:15px;color:rgba(255,255,255,.4)}
#lbl-cards{flex:1 1 0;min-height:0;overflow-y:auto;padding:10px 12px;
  display:flex;flex-direction:column;gap:8px;scroll-behavior:smooth}
.lbl-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
  border-radius:10px;overflow:hidden;flex-shrink:0;width:100%;
  transition:max-height .3s ease,opacity .25s ease,margin .3s ease;max-height:400px}
.lbl-card.removing{max-height:0;opacity:0;margin:0;padding:0}
@media(max-width:1100px){.lbl-queue-hint{display:none}}
@media(max-width:900px){
  .lbl-stat-val{font-size:20px}
  .lbl-stat-cell{padding:0 10px}
  .lbl-conf-track-wrap{margin-left:10px}
}
@media(max-width:600px){
  .lbl-card-inner{flex-direction:column}
  .lbl-conf-circle{margin:0 auto 8px auto}
  .lbl-conf-hint{text-align:center}
  .lbl-btn{font-size:16px;padding:6px 12px}
  .lbl-stat-val{font-size:18px}
}
.lbl-card-inner{display:flex;align-items:flex-start;padding:12px 14px;gap:12px}
.lbl-conf-col{display:flex;flex-direction:column;align-items:center;flex-shrink:0}
.lbl-conf-circle{width:48px;height:48px;border-radius:50%;display:flex;flex-direction:column;
  align-items:center;justify-content:center;font-size:17px;font-weight:700}
.lbl-conf-hint{font-size:14px;color:rgba(255,255,255,.4);text-align:center;margin-top:3px}
.lbl-card-main{flex:1;min-width:0}
.lbl-card-meta{display:flex;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap}
.lbl-card-meta-id{font-size:14px;font-family:monospace;color:rgba(255,255,255,.4)}
.lbl-card-meta-date{font-size:14px;color:rgba(255,255,255,.4)}
.lbl-card-meta-guess{font-size:15px;color:rgba(255,255,255,.6)}
.lbl-card-text{font-size:17px;font-family:monospace;color:#fff;line-height:1.5;
  white-space:pre-wrap;word-break:break-word;margin-bottom:8px}
.lbl-context{display:flex;flex-direction:column;gap:3px;margin-bottom:10px}
.lbl-ctx-item{display:flex;align-items:flex-start;gap:6px;font-size:15px}
.lbl-ctx-arrow{color:rgba(255,255,255,.3);flex-shrink:0}
.lbl-ctx-badge{padding:1px 7px;border-radius:10px;font-size:14px;font-weight:500;flex-shrink:0}
.lbl-ctx-badge.near{background:rgba(240,165,0,.2);border:1px solid #f0a500;color:#f0a500}
.lbl-ctx-badge.reply{background:rgba(56,138,221,.2);border:1px solid #378add;color:#378add}
.lbl-ctx-text{color:rgba(255,255,255,.5);font-family:monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lbl-actions{display:flex;gap:8px;flex-wrap:wrap;padding-top:8px;
  border-top:1px solid rgba(255,255,255,.08)}
.lbl-btn{padding:7px 16px;border-radius:6px;font-size:17px;cursor:pointer;
  border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);
  color:#fff;transition:all .15s}
.lbl-btn:hover{background:rgba(255,255,255,.15)}
.lbl-btn-skip{margin-left:auto;border-color:rgba(255,255,255,.1);color:rgba(255,255,255,.4)}
.lbl-back-bar{padding:10px 16px;border-top:1px solid rgba(255,255,255,.08);
  display:flex;align-items:center;gap:10px;flex-shrink:0}
.lbl-banner{margin:0 12px 0;padding:10px 12px;background:rgba(0,224,150,.1);
  border:1px solid #00e096;border-radius:5px;font-size:16px;color:#00e096;flex-shrink:0}
.rerun-progress-strip{background:rgba(0,0,0,.3);border-left:3px solid #f0a500;
  padding:10px 14px;margin-bottom:8px;transition:border-color .3s;flex-shrink:0}
.rerun-progress-strip.complete{border-left-color:#00e096}
.rerun-progress-strip.error{border-left-color:#e24b4a}
/* ── TELEGRAM TAB LAYOUT v4 (Phase 36) ───────────────────────────── */
#pane-telegram{display:flex;flex-direction:column;height:100%;overflow:hidden}
#tg-status-bar{flex-shrink:0;height:36px;min-height:36px;display:flex;align-items:center;gap:16px;padding:0 16px;background:var(--bg2,var(--panel));border-bottom:1px solid var(--border);font-size:16px;white-space:nowrap;overflow:hidden}
.tg-status-sep{color:var(--border2);padding:0 4px;user-select:none}
#tg-columns{flex:1;display:flex;overflow:hidden;min-height:0}
#tg-left{width:260px;flex-shrink:0;border-right:1px solid var(--border);overflow-y:auto;overflow-x:hidden;padding:8px}
#tg-center{flex:1;min-width:0;border-right:1px solid var(--border);overflow-y:auto;overflow-x:hidden;padding:10px}
#tg-right{width:280px;flex-shrink:0;border-left:1px solid var(--border);overflow-y:auto;overflow-x:hidden;padding:8px}
.tg-card{background:var(--bg2,var(--panel));border-radius:5px;padding:8px 10px;margin-bottom:8px}
.tg-card-title{font-size:14px;font-weight:700;letter-spacing:.08em;color:var(--txt3);text-transform:uppercase;margin-bottom:6px}
.tg-bot-card{background:var(--bg2,var(--panel));border-radius:6px;padding:8px 10px;margin-bottom:10px}
.tg-ch-list-hd{display:flex;align-items:center;gap:4px;padding:5px 2px 7px;border-bottom:1px solid var(--border);margin-bottom:6px;font-size:14px;font-weight:700;letter-spacing:.06em;color:var(--txt2)}
.tg-ch-item{padding:7px 9px;border-radius:4px;cursor:pointer;margin-bottom:5px;border:1px solid var(--border);transition:border-color .15s}
.tg-ch-item:hover{border-color:var(--accent,var(--blue))}
.tg-ch-item.selected{border-left:3px solid var(--accent,#1e6bb5);background:var(--bg2,var(--panel))}
.tg-ch-live-strip{border-top:1px solid rgba(255,255,255,0.05);padding-top:4px;margin-top:3px;font-size:14px;color:var(--txt3);display:flex;align-items:center;gap:4px;min-height:14px}
.tg-intel-card{background:var(--bg2,var(--panel));border-radius:6px;padding:8px 10px;margin-bottom:10px}
.tg-intel-hd{font-size:14px;font-weight:700;letter-spacing:.06em;color:var(--txt2);margin-bottom:8px}
.tg-score-bar{height:5px;background:var(--border);border-radius:3px;overflow:hidden;margin:3px 0}
.tg-score-fill{height:100%;border-radius:3px;transition:width .5s}
.tg-trade-tg{border-left:3px solid #00e096;background:rgba(0,224,150,0.04)}
.tg-badge-tg{background:rgba(0,224,150,0.2);color:#00e096;font-size:14px;padding:1px 5px;border-radius:3px;font-weight:600}
.tg-badge-strat{background:rgba(100,149,237,0.2);color:#6495ed;font-size:14px;padding:1px 5px;border-radius:3px;font-weight:600}
.signal-group{border:1px solid var(--border);border-radius:4px;margin-bottom:6px;overflow:hidden}
.signal-group-header{padding:7px 10px;display:flex;align-items:center;gap:8px;cursor:pointer;background:var(--bg2,var(--panel))}
.signal-group-body{padding:8px 10px;font-size:15px;border-top:1px solid var(--border)}
.mt5-account-card{background:var(--bg2,var(--panel));border-radius:5px;padding:8px 10px;margin-bottom:8px}
.mt5-picker{position:absolute;z-index:100;background:var(--bg2,var(--panel));border:1px solid var(--border);border-radius:5px;padding:8px;min-width:220px;box-shadow:0 4px 12px rgba(0,0,0,0.3)}
.mt5-pick-row{display:flex;align-items:center;justify-content:space-between;padding:5px 8px;border-radius:3px;cursor:pointer;font-size:16px}
.mt5-pick-row:hover{background:var(--bg)}
/* ── Phase 50: Risk indicator colors ─────────────────────────────────── */
@keyframes risk-pulse{0%,100%{opacity:1}50%{opacity:.55}}
.risk-safe{color:#00e096}
.risk-warning{color:#f0a500}
.risk-danger{color:#ff6b35}
.risk-stopped{color:#e03030;animation:risk-pulse 1s ease-in-out infinite}
#hdr-dd-bar{display:flex;align-items:center;gap:8px;flex-shrink:0}
#hdr-dd-bar .lbl{font-size:14px;color:var(--txt2);text-transform:uppercase;letter-spacing:.4px}
#hdr-dd-fill-wrap{width:80px;height:6px;background:var(--border2);border-radius:3px;overflow:hidden}
#hdr-dd-fill{height:100%;width:0%;border-radius:3px;transition:width .4s,background .4s;background:#00e096}
#hdr-dd-pct{font-size:16px;font-weight:700;min-width:36px;text-align:right}
#hdr-dd-label{font-size:14px;font-weight:700;min-width:52px;text-align:center;border-radius:3px;padding:1px 5px}
#sys-risk-banner{display:none;padding:5px 16px;font-size:15px;font-weight:600;letter-spacing:.3px;text-align:center;flex-shrink:0}
/* compat stubs — kept so tests and leftover JS references don't break */
.tg-status-bar{display:flex;align-items:center;gap:6px;padding:5px 12px;border-bottom:1px solid var(--border);background:var(--bg);font-size:15px;flex-shrink:0}
.tg-layout{display:flex;overflow:hidden}
.tg-left{width:260px;flex-shrink:0;border-right:1px solid var(--border);overflow-y:auto;display:flex;flex-direction:column}
.tg-left-hd{display:flex;align-items:center;gap:6px;padding:7px 12px;border-bottom:1px solid var(--border);font-size:15px;font-weight:700;letter-spacing:.04em;flex-shrink:0;position:sticky;top:0;background:var(--card,var(--panel));z-index:1}
.tg-right{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}
.tg-feed-section{flex:1;display:flex;flex-direction:column;overflow:hidden;min-height:0}
.tg-review-section{height:220px;border-top:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;flex-shrink:0}
.tg-right-hd{display:flex;align-items:center;gap:6px;padding:6px 12px;border-bottom:1px solid var(--border);font-size:15px;font-weight:700;letter-spacing:.04em;flex-shrink:0}
.tg-feed{flex:1;overflow-y:auto;padding:8px 10px}
.tg-feed::-webkit-scrollbar{width:3px}
.tg-feed::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px}
.tg-review-body{flex:1;overflow:auto}
.tg-channel-block{border:1px solid var(--border);border-radius:6px;margin:4px;padding:8px;cursor:default}
.tg-channel-block:hover{border-color:var(--border2)}
.signal-card{background:var(--card2,var(--bg));border-radius:4px;padding:8px 10px;margin-bottom:6px;font-size:15px;border:1px solid var(--border)}
.rq-filter-sel{background:var(--bg);border:1px solid var(--border);color:var(--txt);font-size:14px;padding:2px 4px;border-radius:3px;max-width:130px}
.tg-col-hd{display:flex;align-items:center;gap:6px;padding:7px 12px;border-bottom:1px solid var(--border);font-size:15px;font-weight:700;letter-spacing:.04em;color:var(--txt);flex-shrink:0}
.tg-col-body{overflow-y:auto;flex:1;padding:8px 12px}
.ch-card-selected{background:var(--card2)}
.channel-list-panel::-webkit-scrollbar{width:3px}
.channel-list-panel::-webkit-scrollbar-track{background:transparent}
.channel-list-panel::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px}

/* Channel card text truncation */
.ch-card-name{
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  max-width:160px;font-size:15px;font-weight:600;
}
.ch-card-meta{
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-size:14px;color:var(--txt2);
}

/* + Add button */
.btn-add-channel{
  padding:6px 14px;border-radius:6px;
  background:#1e6bb5;color:#fff;
  font-size:17px;font-weight:500;border:none;cursor:pointer;
  white-space:nowrap;
}
.btn-add-channel:hover{background:#2480d0}
.btn-add-channel:focus{outline:none}

/* Refresh buttons (consistent across tab) */
.btn-refresh{
  padding:4px 10px;border-radius:4px;
  background:var(--border2);color:var(--txt);
  font-size:15px;font-weight:500;border:1px solid var(--border);
  cursor:pointer;white-space:nowrap;
}
.btn-refresh:hover{background:var(--border);color:#fff}
.btn-refresh:focus{outline:none;box-shadow:none}

/* Right panel sections */
.tg-section{
  background:var(--panel);border:1px solid var(--border);
  border-radius:4px;flex-shrink:0;min-height:80px;
}
.tg-section-hd{
  padding:7px 12px;border-bottom:1px solid var(--border);
  font-size:15px;font-weight:600;text-transform:uppercase;
  letter-spacing:.5px;color:var(--txt2);
  display:flex;align-items:center;gap:8px;
}
.tg-section-body{padding:10px 14px;overflow:hidden}

/* System status CSS states */
.status-running{color:#00d084}
.status-loading{color:#f0a500;animation:pulse 1s infinite}
.status-error{color:#ff4444}
.status-stopped{color:#888}

/* Clock display */
#clock-display{
  font-size:16px;color:var(--txt2);
  margin-right:8px;white-space:nowrap;flex-shrink:0;
}

/* Learning summary cards */
.ch-learn-summary-card{
  background:var(--card2,#252932);border:1px solid var(--border2);
  border-radius:5px;padding:10px 12px;margin-bottom:8px;
}

/* ── CHANNEL MANAGEMENT UI ───────────────────────────────────────── */
.ch-counter{font-size:14px;color:var(--txt2);flex-shrink:0}

/* Manage & Warning modals */
.ch-modal-overlay{
  display:none;position:fixed;inset:0;background:rgba(0,0,0,.75);
  z-index:2000;align-items:center;justify-content:center;
}
.ch-modal-overlay.open{display:flex}
.ch-modal-box{
  background:var(--panel);border:1px solid var(--border2);
  border-radius:8px;width:500px;max-width:96vw;
  max-height:90vh;overflow-y:auto;padding:0;
}
.ch-modal-hd{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 18px;border-bottom:1px solid var(--border);
}
.ch-modal-hd-title{font-size:18px;font-weight:700;color:#fff}
.ch-modal-body{padding:16px 18px}
.ch-modal-section{margin-bottom:16px}
.ch-modal-section-title{
  font-size:14px;font-weight:700;text-transform:uppercase;
  letter-spacing:.5px;color:var(--txt2);
  padding-bottom:6px;border-bottom:1px solid var(--border2);
  margin-bottom:10px;
}
.ch-modal-footer{
  display:flex;gap:8px;justify-content:flex-end;
  padding:12px 18px;border-top:1px solid var(--border);
}

/* MT5 assignment rows */
.mt5-assign-row{
  display:flex;align-items:center;gap:8px;
  padding:6px 0;border-bottom:1px solid var(--border2);
  font-size:15px;
}
.mt5-assign-row:last-child{border-bottom:none}

/* Warning modal */
.warn-modal-box{
  background:var(--panel);border:2px solid var(--red,#ef4444);
  border-radius:8px;width:480px;max-width:96vw;max-height:90vh;overflow-y:auto;
}
.warn-trade-row{
  font-size:15px;padding:4px 0;border-bottom:1px solid var(--border2);
}
.warn-trade-row:last-child{border-bottom:none}

/* Channel card action buttons */
.ch-card-actions{display:flex;gap:4px;flex-shrink:0}
.btn-ch-manage{
  padding:2px 7px;font-size:14px;border-radius:3px;
  background:var(--border2);border:1px solid var(--border);
  color:var(--txt);cursor:pointer;
}
.btn-ch-manage:hover{background:var(--blue);color:#fff;border-color:var(--blue)}
.btn-ch-remove{
  padding:2px 7px;font-size:14px;border-radius:3px;
  background:transparent;border:1px solid var(--border);
  color:var(--txt2);cursor:pointer;
}
.btn-ch-remove:hover{background:var(--red,#ef4444);color:#fff;border-color:var(--red,#ef4444)}
/* Phase 121 — Data Import Quality Panel */
.dim-quality-card{padding:12px;background:var(--bg2,#1a1a2e);border:1px solid var(--border,#333);border-radius:8px;margin-top:8px}
.dim-quality-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:15px;font-weight:600}
.dim-grade-badge{padding:2px 10px;border-radius:12px;color:#000;font-weight:700;font-size:15px}
.dim-score-row{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.dim-score-number{font-size:1.4rem;font-weight:700;min-width:72px;color:var(--txt)}
.dim-score-bar-wrap{flex:1;height:8px;background:var(--border,#333);border-radius:4px;overflow:hidden}
.dim-score-bar{height:100%;border-radius:4px;transition:width .4s}
.dim-quality-stats{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:8px;font-size:14px}
.dim-gap-stats{display:flex;gap:10px;flex-wrap:wrap;font-size:14px;margin-bottom:8px;color:var(--txt2)}
.dim-timeline-wrap{margin-bottom:10px}
.dim-timeline-legend{display:flex;gap:14px;font-size:14px;color:var(--txt2);margin-top:3px}
.dim-findings{font-size:14px;padding-left:14px;margin-bottom:8px;color:var(--txt2)}
.dim-recommendation{font-style:italic;color:var(--txt2);margin-bottom:12px;font-size:14px}
.dim-decision-btns{display:flex;gap:8px;flex-wrap:wrap}
.btn-success{background:#22c55e;color:#000;border:1px solid #22c55e;border-radius:4px;padding:4px 10px;font-size:14px;cursor:pointer}
.btn-warning{background:#f59e0b;color:#000;border:1px solid #f59e0b;border-radius:4px;padding:4px 10px;font-size:14px;cursor:pointer}
.btn-danger{background:#ef4444;color:#fff;border:1px solid #ef4444;border-radius:4px;padding:4px 10px;font-size:14px;cursor:pointer}
.dim-progress-bar-wrap{background:var(--bg2,#1a1a2e);border-radius:4px;height:6px;overflow:hidden;margin-bottom:4px}
.dim-progress-bar{height:100%;background:var(--blue,#2563eb);transition:width .4s}
.dim-status-text{font-size:14px;color:var(--txt2);margin:0}
.dim-status-ok{font-size:14px;color:#22c55e;margin:0}
.dim-status-err{font-size:14px;color:#ef4444;margin:0}
.dim-status-muted{font-size:14px;color:var(--txt2);margin:0}

/* ── Phase 130: Pair Picker Component ───────────────────────── */
.pair-picker{position:relative;width:100%}
.pair-picker-input-wrap{display:flex;flex-wrap:wrap;gap:4px;padding:6px 8px;border:1px solid var(--border);border-radius:6px;min-height:34px;cursor:text;background:var(--bg2)}
.pair-picker-tag{display:flex;align-items:center;gap:4px;padding:2px 8px;background:var(--accent,#3b82f6);color:#fff;border-radius:12px;font-size:14px;font-weight:600}
.pair-picker-tag-remove{cursor:pointer;font-size:16px;line-height:1;opacity:.8}
.pair-picker-tag-remove:hover{opacity:1}
.pair-picker-input{border:none;outline:none;background:transparent;color:var(--txt);min-width:80px;flex:1;font-size:14px}
.pair-picker-dropdown{position:absolute;top:100%;left:0;right:0;z-index:200;background:var(--bg2);border:1px solid var(--border);border-top:none;border-radius:0 0 6px 6px;max-height:220px;overflow-y:auto;box-shadow:0 4px 12px rgba(0,0,0,.3)}
.pair-picker-option{display:flex;align-items:center;gap:8px;padding:6px 10px;cursor:pointer;font-size:14px}
.pair-picker-option:hover,.pair-picker-option.focused{background:var(--bg3,var(--border))}
.pair-picker-option.selected{background:rgba(59,130,246,.12)}
.pair-picker-option-name{font-weight:600;min-width:56px}
.pair-picker-option-status{color:var(--txt2);flex:1;font-size:14px}
.pair-picker-option-badge{font-size:14px;padding:1px 5px;border-radius:8px}
.pair-picker-badge-ok{background:#22c55e22;color:#22c55e}
.pair-picker-badge-warn{background:#f59e0b22;color:#f59e0b}
.pair-picker-badge-missing{background:#6b728022;color:#9ca3af}
.pair-picker-actions{display:flex;gap:8px;margin-top:4px;font-size:14px}
.pair-picker-actions a{color:var(--accent,#3b82f6);cursor:pointer;text-decoration:none}
.pair-picker-actions a:hover{text-decoration:underline}

/* Left panel — prevent children from overflowing 260px */
.col[style*="width:260px"] > *{max-width:100%;box-sizing:border-box}
.col[style*="width:260px"] .card{width:100%;max-width:260px;box-sizing:border-box}

/* ═══ UTILITY CLASSES (Phase 203) ═══ */

/* Text utilities */
.txt-muted  { color:var(--txt3);font-size:15px }
.txt-muted2 { color:var(--txt2);font-size:15px }
.txt-label  { color:var(--txt2);font-size:16px }
.txt-micro  { color:var(--txt3);font-size:14px }
.txt-micro2 { color:var(--txt2);font-size:14px }
.txt-bold   { font-size:17px;font-weight:700;color:var(--txt) }

/* Layout utilities */
.flex-row   { display:flex;align-items:center }
.flex-col   { display:flex;flex-direction:column }
.flex-sb    { display:flex;justify-content:space-between;align-items:center }
.flex-gap4  { display:flex;align-items:center;gap:4px }
.flex-gap8  { display:flex;align-items:center;gap:8px }
.flex-gap12 { display:flex;align-items:center;gap:12px }
.flex1-col  { display:flex;flex-direction:column;gap:3px }

/* Color utilities */
.c-green  { color:var(--green,#22c55e) }
.c-red    { color:var(--red,#ef4444) }
.c-orange { color:var(--orange,#f59e0b) }
.c-blue   { color:var(--blue,#3b82f6) }
.c-muted  { color:var(--txt3) }

/* Spacing */
.mb2 { margin-bottom:2px }
.mb3 { margin-bottom:3px }
.mb4 { margin-bottom:4px }
.p8  { padding:8px }
.p10 { padding:10px }
.p12 { padding:12px }

/* Box utilities */
.box-sm {
  background:var(--bg2);border:1px solid var(--border);
  border-radius:6px;padding:6px 10px
}
.box-center {
  background:var(--bg3,#0d0d1a);padding:8px;border-radius:6px;
  text-align:center
}
.row-sb {
  padding:10px 12px;display:flex;
  justify-content:space-between;align-items:center
}
.input-base {
  width:100%;background:var(--bg2);border:1px solid var(--border);
  color:var(--txt);border-radius:4px
}

/* Status utilities */
.status-running { color:var(--green) }
.status-stopped { color:var(--txt3) }
.status-error   { color:var(--red) }

/* P117K: Model Confidence widget */
.confidence-row {
  display:flex; align-items:center; gap:8px; padding:4px 0;
  font-size:15px;
}
.confidence-row .pair-label {
  min-width:60px; font-family:monospace; font-weight:600; color:var(--txt);
}
.confidence-bar {
  flex:1; min-width:80px; height:8px; background:#2a2a2a; border-radius:4px;
  overflow:hidden;
}
.confidence-fill {
  height:100%; border-radius:4px; transition:width .3s ease;
}
.confidence-row.level-not_operational .confidence-fill { background:#e74c3c; }
.confidence-row.level-partial         .confidence-fill { background:#f39c12; }
.confidence-row.level-reliable        .confidence-fill { background:#27ae60; }
.confidence-row.level-optimal         .confidence-fill { background:#1abc9c; }
.confidence-months  { min-width:40px; color:var(--txt2); font-family:monospace; }
.confidence-level   { min-width:120px; font-weight:600; }
.confidence-level.level-not_operational { color:#e74c3c; }
.confidence-level.level-partial         { color:#f39c12; }
.confidence-level.level-reliable        { color:#27ae60; }
.confidence-level.level-optimal         { color:#1abc9c; }
.confidence-xgb     { min-width:80px; color:var(--txt3); font-family:monospace; }

/* P117S: Orchestrator funnel widget (signal-attrition over last 24h) */
.funnel-row    { display:flex; align-items:center; gap:8px; padding:3px 0; font-size:15px; }
.funnel-stage  { min-width:160px; color:var(--txt2); font-family:monospace; font-size:14px; }
.funnel-bar    { flex:1; min-width:80px; height:6px; background:#2a2a2a; border-radius:3px; overflow:hidden; }
.funnel-fill   { height:100%; background:#3498db; border-radius:3px; transition:width .3s ease; }
.funnel-count  { min-width:34px; text-align:right; color:var(--txt); font-family:monospace; }
.funnel-footer { padding:6px 8px; font-size:15px; color:var(--txt2); border-top:1px solid var(--border); }
.funnel-window { float:right; color:var(--txt3); font-size:14px; }
