:root{--bg:#0b0d10;--card:#12161b;--line:#20262d;--text:#f2f5f7;--muted:#8c98a5;--good:#2bd576;--bad:#ff5b66;--accent:#f0b90b}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Tahoma,sans-serif;font-size:13px}.app{max-width:560px;margin:auto;padding:14px 12px 30px}.topbar{display:flex;justify-content:space-between;align-items:center;margin:4px 2px 12px}.eyebrow{font-size:9px;letter-spacing:1.7px;color:var(--muted)}h1{font-size:20px;margin:2px 0 0}.live{font-size:10px;color:var(--good);font-weight:800}.live span{display:inline-block;width:7px;height:7px;background:var(--good);border-radius:50%;margin-left:5px;box-shadow:0 0 10px var(--good)}.card{background:linear-gradient(180deg,#14191f,#11151a);border:1px solid var(--line);border-radius:15px}.hero{padding:14px}.hero-line{display:flex;justify-content:space-between;color:var(--muted);font-size:11px}.sub{font-size:9px}.balance{font-size:33px;font-weight:800;letter-spacing:-1px;margin:6px 0 12px}.balance small{font-size:11px;color:var(--muted);font-weight:600}.mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.mini-grid div{background:#0d1115;border:1px solid #1d232a;border-radius:10px;padding:8px}.mini-grid span,.metric span{display:block;color:var(--muted);font-size:9px;margin-bottom:3px}.mini-grid b{font-size:11px}.filters{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:10px 0}.filters button{border:1px solid var(--line);background:#11151a;color:var(--muted);border-radius:10px;padding:8px 3px;font-size:10px;font-weight:700}.filters button.active{background:#1b2026;color:var(--text);border-color:#3a424c}.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.metric{padding:11px}.metric b{display:block;font-size:17px;margin-bottom:2px}.metric small{font-size:9px;color:var(--muted)}.good{color:var(--good)!important}.bad{color:var(--bad)!important}.performance{margin-top:9px;padding:11px}.section-head{display:flex;justify-content:space-between;align-items:center;font-size:11px}.section-head span{color:var(--muted);font-size:9px}.bars{display:flex;align-items:flex-end;gap:5px;height:106px;margin-top:10px;overflow-x:auto;padding-bottom:2px}.barwrap{min-width:34px;flex:1;text-align:center}.bararea{height:72px;display:flex;align-items:flex-end;justify-content:center}.bar{width:18px;border-radius:5px 5px 2px 2px;min-height:2px;background:#39424d}.bar.goodbar{background:var(--good)}.bar.badbar{background:var(--bad)}.barwrap b{display:block;font-size:8px;margin-top:4px;white-space:nowrap}.barwrap small{font-size:8px;color:var(--muted)}.trades-section{margin-top:12px}.outside{margin:0 2px 7px}.trades{display:flex;flex-direction:column;gap:7px}.trade{padding:10px 11px}.trade-top{display:flex;justify-content:space-between;align-items:center}.symbol{display:flex;gap:7px;align-items:center;font-weight:800;font-size:13px}.badge{font-size:8px;padding:3px 5px;border-radius:6px;border:1px solid var(--line);color:var(--muted)}.pnl{text-align:left}.pnl b{display:block;font-size:13px}.pnl small{font-size:9px;color:var(--muted)}.trade-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:8px}.trade-grid div{background:#0d1115;padding:6px;border-radius:7px}.trade-grid span{display:block;color:var(--muted);font-size:8px;margin-bottom:2px}.trade-grid b{font-size:9px}.time{margin-top:6px;font-size:8px;color:var(--muted);display:flex;justify-content:space-between}.error{position:fixed;bottom:15px;left:12px;right:12px;max-width:536px;margin:auto;background:#2b1417;border:1px solid #5f252b;color:#ffb5bb;padding:10px;border-radius:12px;font-size:11px}.hidden{display:none}@media(min-width:430px){.stats-grid{grid-template-columns:repeat(4,1fr)}.metric b{font-size:15px}}

/* Compact mobile trade cards */
.trade{
  padding:7px 8px;
}
.trade-top{
  min-height:25px;
}
.symbol{
  font-size:12px;
  gap:5px;
}
.badge{
  font-size:7px;
  padding:2px 4px;
}
.pnl b{
  font-size:11px;
}
.pnl small{
  font-size:8px;
}
.trade-grid{
  gap:3px;
  margin-top:5px;
}
.trade-grid div{
  padding:3px 2px;
  border-radius:6px;
  min-height:34px;
}
.trade-grid span{
  font-size:6.5px;
  margin-bottom:1px;
}
.trade-grid b{
  font-size:8px;
}
.time{
  margin-top:4px;
  font-size:7px;
}
.trades{
  gap:5px;
}

/* ===== Dashboard V2 compact mobile ===== */

.hero-update{
  text-align:left;
  color:var(--muted);
  font-size:8px;
  margin-bottom:7px;
}

.hero-main-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  direction:rtl;
  margin-bottom:11px;
}

.hero-value{
  min-width:0;
}

.hero-value>span{
  display:block;
  color:var(--muted);
  font-size:9px;
  margin-bottom:2px;
}

.hero-number{
  display:flex;
  align-items:baseline;
  gap:4px;
  direction:ltr;
}

.hero-number b{
  font-size:25px;
  line-height:1.05;
  letter-spacing:-.7px;
  white-space:nowrap;
}

.hero-number small{
  font-size:8px;
  color:var(--muted);
}

.hero-pnl{
  text-align:left;
  direction:ltr;
}

.hero-pnl>span{
  text-align:left;
}

.hero-pnl .hero-number{
  justify-content:flex-start;
}

.hero-pnl>small{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:7px;
  white-space:nowrap;
}

.compact-stats{
  grid-template-columns:repeat(3,1fr)!important;
  gap:6px!important;
}

.compact-stats .metric{
  padding:8px 6px;
  text-align:center;
}

.compact-stats .metric span{
  font-size:7px;
}

.compact-stats .metric b{
  font-size:13px;
}

.compact-stats .metric small{
  font-size:7px;
}

.trade-header{
  direction:ltr;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin:0 2px 6px;
}

.trade-title-side{
  display:flex;
  align-items:center;
  gap:5px;
}

.trade-title-side b{
  font-size:11px;
}

.trade-title-side span{
  font-size:7px;
  color:var(--muted);
}

.trade-filters{
  display:flex;
  gap:3px;
}

.trade-filter{
  appearance:none;
  border:1px solid #252d35;
  background:#101419;
  color:#7f8b97;
  border-radius:6px;
  padding:3px 6px;
  font-size:7px;
  line-height:1;
  font-weight:700;
}

.trade-filter.active{
  color:#fff;
  background:#1d242b;
  border-color:#414b56;
}

.empty-trades{
  padding:14px;
  text-align:center;
  color:var(--muted);
  font-size:9px;
}

/* extra compact trade cards */
.trade{
  padding:7px 8px;
}

.trade-top{
  min-height:24px;
}

.symbol{
  font-size:11px;
  gap:4px;
}

.badge{
  font-size:6.5px;
  padding:2px 4px;
}

.pnl b{
  font-size:10px;
}

.pnl small{
  font-size:7px;
}

.trade-grid{
  gap:3px;
  margin-top:5px;
}

.trade-grid div{
  min-height:32px;
  padding:3px 2px;
}

.trade-grid span{
  font-size:6px;
  margin-bottom:1px;
}

.trade-grid b{
  font-size:7.5px;
}

.time{
  margin-top:4px;
  font-size:6.5px;
}

.trades{
  gap:5px;
}


.hero-balance{
  text-align:right;
  direction:rtl;
}

.hero-balance>span{
  text-align:right;
}

.hero-balance .hero-number{
  justify-content:flex-start;
  direction:ltr;
}

.hero-main-grid{
  direction:ltr !important;
}

.hero-balance{
  grid-column:2;
  text-align:right !important;
  direction:rtl !important;
}

.hero-balance>span{
  text-align:right !important;
}

.hero-balance .hero-number{
  justify-content:flex-end !important;
  direction:ltr !important;
}

.hero-pnl{
  grid-column:1;
}

/* Fine tune top PNL sizes */
.hero-pnl .hero-number b{
  font-size:21px !important;
  letter-spacing:-0.4px !important;
}

.hero-pnl{
  padding-top:2px;
}

.compact-stats #periodNet{
  font-size:11px !important;
  line-height:1.15;
}


/* Force Bot PNL and Total Balance onto the same row */
.hero-main-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  align-items:start !important;
  gap:12px !important;
}

.hero-pnl{
  grid-column:1 !important;
  grid-row:1 !important;
  align-self:start !important;
  margin-top:0 !important;
  padding-top:0 !important;
}

.hero-balance{
  grid-column:2 !important;
  grid-row:1 !important;
  align-self:start !important;
  margin-top:0 !important;
  padding-top:0 !important;
}

.hero-pnl .hero-number,
.hero-balance .hero-number{
  margin-top:0 !important;
}



/* ===== TELEGRAM TAB ===== */

.main-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  margin:0 0 10px;
}

.main-tab{
  border:1px solid var(--line);
  background:#101419;
  color:var(--muted);
  border-radius:10px;
  padding:9px 4px;
  font-size:9px;
  font-weight:800;
  letter-spacing:.5px;
}

.main-tab.active{
  color:#fff;
  border-color:#454f5a;
  background:#1c2229;
}

.telegram-periods{
  margin-top:0;
}

.telegram-summary{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:5px;
  margin-bottom:12px;
}

.telegram-summary .metric{
  padding:8px 4px;
  text-align:center;
  min-width:0;
}

.telegram-summary .metric span{
  font-size:6.5px;
}

.telegram-summary .metric b{
  font-size:11px;
  white-space:nowrap;
}

.telegram-summary .metric small{
  font-size:6px;
}

.telegram-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  margin:0 2px 7px;
}

.telegram-head div{
  display:flex;
  align-items:center;
  gap:6px;
}

.telegram-head b{
  font-size:11px;
}

.telegram-head span{
  color:var(--muted);
  font-size:7px;
}

.telegram-channels{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.telegram-channel{
  padding:9px;
}

.tg-channel-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  direction:ltr;
}

.tg-channel-top>div{
  display:flex;
  align-items:center;
  gap:5px;
  min-width:0;
}

.tg-channel-top b{
  font-size:10px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.tg-channel-top strong{
  font-size:9px;
  white-space:nowrap;
}

.tg-rank{
  color:var(--accent);
  font-size:7px;
  font-weight:800;
}

.tg-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:4px;
  margin-top:7px;
}

.tg-grid div{
  background:#0d1115;
  border-radius:7px;
  padding:5px 3px;
  text-align:center;
}

.tg-grid span{
  display:block;
  color:var(--muted);
  font-size:6px;
  margin-bottom:2px;
}

.tg-grid b{
  font-size:9px;
}

.tg-bottom{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:4px;
  margin-top:5px;
  direction:ltr;
}

.tg-bottom span{
  color:var(--muted);
  font-size:6px;
  text-align:center;
}

.tg-bottom b{
  display:block;
  color:var(--text);
  font-size:7.5px;
  margin-top:2px;
}

@media(max-width:390px){
  .telegram-summary .metric b{
    font-size:9px;
  }

  .tg-channel-top b{
    max-width:190px;
  }
}


/* ===== TRADE TARGET DETAILS ===== */

.trade-targets{
  margin-top:5px;
  border-top:1px solid var(--line);
  padding-top:3px;
}

.trade-targets summary{
  cursor:pointer;
  color:var(--muted);
  font-size:6.5px;
  font-weight:700;
  list-style-position:inside;
  user-select:none;
}

.trade-targets[open] summary{
  margin-bottom:3px;
}

.target-lines{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.target-line{
  display:grid;
  grid-template-columns:42px 28px 48px 58px 1fr;
  align-items:center;
  gap:3px;
  direction:ltr;
  font-size:6.5px;
  line-height:1.4;
  white-space:nowrap;
}

.target-line b{
  font-size:6.5px;
}

.target-line span{
  color:var(--muted);
}

.target-line .good{
  color:var(--good);
}

.target-line .bad{
  color:var(--bad);
}


/* =========================================================
   Specific Date Filter
   ========================================================= */

.date-filter-btn{
  white-space:nowrap;
}

.date-filter-control{
  grid-column:1 / -1;
  position:relative;
  min-height:40px;
  border:1px solid #27313b;
  border-radius:12px;
  background:#11171d;
  color:var(--muted);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:9px;
  font-weight:700;
  overflow:hidden;
  cursor:pointer;
}

.date-filter-control.active{
  border-color:#566474;
  background:#20272e;
  color:var(--text);
}

.date-filter-control>span{
  pointer-events:none;
}

.date-filter-input{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:0;
  cursor:pointer;
  -webkit-appearance:auto;
  appearance:auto;
}

.date-filter-btn.active{
  border-color:#4d5a68;
}


/* Telegram expandable channel trades */

.tg-channel-toggle{
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.tg-channel-name{
  display:flex;
  align-items:center;
  gap:7px;
}

.tg-expand-icon{
  font-size:16px;
  opacity:.55;
  margin-inline-start:3px;
}

.telegram-channel.expanded{
  border-color:#3c4854;
}

.tg-trade-list{
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid #26303a;
}

.tg-trade-list.hidden{
  display:none;
}

.tg-trade-list-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
  font-size:12px;
}

.tg-trade-list-head span{
  opacity:.6;
  font-size:11px;
}

.tg-trade-row{
  padding:12px;
  margin-top:8px;
  border-radius:13px;
  background:#0d1217;
  border:1px solid #1c252e;
}

.tg-trade-main{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}

.tg-trade-main > div{
  display:flex;
  align-items:center;
  gap:8px;
}

.tg-direction{
  padding:3px 7px;
  border-radius:7px;
  border:1px solid #29343e;
  font-size:10px;
  opacity:.75;
}

.tg-trade-meta{
  display:flex;
  flex-wrap:wrap;
  gap:7px 12px;
  margin-top:8px;
  font-size:10px;
  opacity:.72;
}

.tg-trade-meta .good,
.tg-trade-meta .bad{
  opacity:1;
  font-weight:700;
}

.tg-no-trades{
  padding:16px;
  text-align:center;
  opacity:.55;
  font-size:12px;
}


.live.telegram-warn{color:var(--accent)}
.live.telegram-warn span{background:var(--accent);box-shadow:0 0 10px var(--accent)}
.live.telegram-bad{color:var(--bad)}
.live.telegram-bad span{background:var(--bad);box-shadow:0 0 10px var(--bad)}
.live b{font-size:10px;font-weight:800}

/* ===== 3 MAIN TABS ===== */
.main-tabs{grid-template-columns:repeat(3,1fr);gap:5px;direction:ltr}
.main-tab{font-size:8px;letter-spacing:.25px;padding:10px 2px;white-space:nowrap}

/* ===== OPEN POSITIONS ===== */
.open-summary-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;margin-bottom:12px}
.open-summary-grid .metric{padding:10px;text-align:center;min-width:0}
.open-summary-grid .metric span{font-size:8px}
.open-summary-grid .metric b{font-size:15px;white-space:nowrap}
.open-summary-grid .metric small{font-size:7px;color:var(--muted)}
.open-head{display:flex;justify-content:space-between;align-items:flex-end;margin:2px 2px 8px}
.open-head div{display:flex;flex-direction:column;gap:2px}
.open-head b{font-size:12px}
.open-head span{font-size:8px;color:var(--muted)}
.open-positions{display:flex;flex-direction:column;gap:8px}
.open-position-card{padding:11px;border-width:1px}
.open-position-card.position-up{border-color:rgba(43,213,118,.28)}
.open-position-card.position-down{border-color:rgba(255,91,102,.28)}
.open-pos-top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start;direction:ltr}
.open-pos-symbol{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.open-pos-symbol>b{font-size:14px}
.open-pos-state{text-align:right;display:flex;flex-direction:column;gap:1px}
.open-pos-state strong{font-size:12px}
.open-pos-state small{font-size:8px;color:var(--muted)}
.open-pnl-row{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:10px 0 7px;direction:ltr}
.open-pnl-row>div{background:#0d1115;border:1px solid #1d232a;border-radius:9px;padding:9px}
.open-pnl-row span,.open-pos-grid span{display:block;color:var(--muted);font-size:8px;margin-bottom:3px}
.open-pnl-row b{font-size:14px}
.open-pos-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:5px;direction:ltr}
.open-pos-grid>div{background:#0d1115;border-radius:8px;padding:7px;min-width:0}
.open-pos-grid b{font-size:9px;word-break:break-word}
.open-pos-footer{display:flex;justify-content:space-between;gap:8px;margin-top:8px;padding-top:7px;border-top:1px solid var(--line);font-size:8px;color:var(--muted);direction:ltr}
@media(min-width:430px){.open-summary-grid{grid-template-columns:repeat(4,1fr)}.open-pos-grid{grid-template-columns:repeat(3,1fr)}}

/* Compact top cards on iPhone */
.open-summary-grid .metric{
  padding:8px 6px;
}
.open-summary-grid .metric span{
  font-size:7px;
  line-height:1.15;
}
.open-summary-grid .metric b{
  font-size:12px;
  line-height:1.1;
  letter-spacing:-0.2px;
  white-space:nowrap;
}
.open-summary-grid .metric small{
  font-size:6.5px;
  line-height:1.15;
}
@media(max-width:390px){
  .open-summary-grid{gap:5px}
  .open-summary-grid .metric{padding:7px 4px}
  .open-summary-grid .metric b{font-size:11px}
  .open-summary-grid .metric span{font-size:6.5px}
  .open-summary-grid .metric small{font-size:6px}
}


/* Keep signed financial values readable inside the RTL page. */
#wallet,
#available,
#unrealized,
#periodNet,
#periodRoi,
.pnl b,
.pnl small,
.barwrap b{
  direction:ltr;
  unicode-bidi:isolate;
}