/* =====================================================================
   TRADEAGENTIO — RAFİNE PRO TERMİNAL
   Quant masası disiplini: neredeyse-siyah zemin, kılcal çizgiler,
   TEK vurgu (terminal ambeni). Yeşil/kırmızı YALNIZ yön & K/Z için.
   Tipografi: Archivo (geniş kesim başlık) + IBM Plex Mono (tüm veri).
   ===================================================================== */

:root{
  /* Surfaces */
  --bg:          #050607;
  --bg-soft:     #08090b;
  --panel:       #0b0d0f;
  --panel-2:     #0f1113;
  --panel-hover: #13161a;
  --chart-bg:    #070809;

  /* Hairlines */
  --line:        #1a1d21;
  --line-soft:   #121417;
  --line-strong: #272b31;

  /* Text */
  --txt:         #b9bfc9;
  --txt-bright:  #edf0f4;
  --txt-dim:     #848b98;
  --txt-mute:    #5d6470;
  --txt-faint:   #40454f;

  /* TEK VURGU — terminal ambeni */
  --amber:       #f0b429;
  --amber-soft:  #f6cd5e;
  --amber-dim:   #d9a62e;
  --amber-bg:    rgba(240,180,41,.07);
  --amber-bd:    rgba(240,180,41,.32);

  /* Yön & K/Z semantiği (yalnız burada yeşil/kırmızı) */
  --green:       #2fbf71;
  --green-soft:  #55d68f;
  --green-bg:    rgba(47,191,113,.08);
  --green-bd:    rgba(47,191,113,.30);
  --red:         #e5484d;
  --red-soft:    #f27276;
  --red-bg:      rgba(229,72,77,.08);
  --red-bd:      rgba(229,72,77,.30);

  /* Grafik veri katman tonları (kısık, disiplinli) */
  --ly-liq:      #a7b0c0;
  --ly-choch:    #8f86c9;
  --ly-fvg:      #5a7fa6;
  --ly-ob:       #3f8f68;

  --disp: 'Archivo', 'Helvetica Neue', sans-serif;
  --mono: 'IBM Plex Mono', ui-monospace, 'SF Mono', monospace;

  --r: 4px;
  --r-lg: 6px;
}

/* ---------------------------------------------------------------- Reset */
*{ box-sizing: border-box; margin: 0; padding: 0; }
[hidden]{ display: none !important; }

html{ scroll-behavior: smooth; }
body{
  background:
    repeating-linear-gradient(0deg, rgba(255,255,255,.012) 0 1px, transparent 1px 3px),
    radial-gradient(1200px 600px at 50% -10%, #0b0d10 0%, var(--bg) 55%);
  color: var(--txt);
  font-family: var(--mono);
  font-size: 13.5px;
  line-height: 1.5;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

::selection{ background: var(--amber); color: #141005; }

.sr-only{
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

h1,h2,h3{ font-family: var(--disp); color: var(--txt-bright); }

a{ color: var(--amber); text-decoration: none; }
a:hover{ text-decoration: underline; }

button{ font-family: inherit; cursor: pointer; }
input, select{ font-family: var(--mono); }

/* Scrollbar — terminal ince */
::-webkit-scrollbar{ width: 8px; height: 8px; }
::-webkit-scrollbar-track{ background: transparent; }
::-webkit-scrollbar-thumb{ background: var(--line-strong); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover{ background: var(--txt-mute); }

/* ------------------------------------------------------ Giriş animasyonu */
@keyframes rise{ from{ opacity: 0; transform: translateY(10px); } to{ opacity: 1; transform: none; } }
@keyframes fadeIn{ from{ opacity: 0; } to{ opacity: 1; } }
@keyframes popIn{ from{ opacity: 0; transform: scale(.6); } to{ opacity: 1; transform: scale(1); } }
@keyframes slideL{ from{ opacity: 0; transform: translateX(-8px); } to{ opacity: 1; transform: none; } }

.ticker-ribbon{ animation: fadeIn .5s ease both; }
.topbar{ animation: rise .45s ease both; }
.databar{ animation: rise .45s .06s ease both; }
.chart-panel{ animation: rise .5s .12s ease both; }
.side-rail{ animation: rise .5s .18s ease both; }
.section{ animation: rise .55s .24s ease both; }
.footer{ animation: fadeIn .6s .3s ease both; }

/* SVG çizim yaşam döngüsü (app.js class'ları) */
svg .fade{ animation: fadeIn .5s ease both; }
svg .pop{ animation: popIn .35s ease both; }
svg .draw{ animation: fadeIn .4s ease both; }

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation: none !important; transition: none !important; }
}

/* ================================================= TICKER RIBBON */
.ticker-ribbon{
  display: flex; gap: 0; overflow-x: auto;
  background: var(--bg-soft);
  border-bottom: 1px solid var(--line);
  font-size: 11.5px;
}
.ticker-item{
  display: flex; align-items: center; gap: 7px;
  padding: 6px 16px;
  border-right: 1px solid var(--line-soft);
  white-space: nowrap;
}
.t-sym{ color: var(--txt-mute); letter-spacing: .04em; }
.t-val{ color: var(--txt-bright); font-weight: 600; }
.t-chg{ font-size: 11px; }
.t-chg.up{ color: var(--green); }
.t-chg.down{ color: var(--red); }

@keyframes flashUp{ 0%{ color: var(--green-soft); } 100%{ color: var(--txt-bright); } }
@keyframes flashDown{ 0%{ color: var(--red-soft); } 100%{ color: var(--txt-bright); } }
.flash-up{ animation: flashUp .8s ease; }
.flash-down{ animation: flashDown .8s ease; }

/* ================================================= TOPBAR */
.topbar{
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px; flex-wrap: wrap;
  padding: 12px 20px;
  background: var(--bg-soft);
  border-bottom: 1px solid var(--line);
  position: relative;
}
.topbar::after{
  /* imza: amber canlı çizgi */
  content: ''; position: absolute; left: 0; bottom: -1px; height: 1px; width: 148px;
  background: linear-gradient(90deg, var(--amber), transparent);
}

.prod-badge{
  font-family: var(--mono); font-size: 9px; font-weight: 700; letter-spacing: .14em;
  color: #141005; background: var(--amber);
  border-radius: 2px; padding: 1.5px 5px; vertical-align: 2px; margin-left: 4px;
}

.topbar-right{ display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* Piller */
.pill{
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--mono); font-size: 11px; color: var(--txt);
  background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--r); padding: 6px 11px;
}
.pill .dot{
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--txt-mute);
}
.pill-live .dot{ background: var(--green); box-shadow: 0 0 6px var(--green); }
.pill-live.is-demo .dot{ background: var(--amber); box-shadow: 0 0 6px var(--amber); }
.ping-badge{ color: var(--txt-mute); font-size: 10px; }

/* AI durum pili — tıklanır */
.pill-ai{ transition: border-color .15s, background .15s; }
.pill-ai:hover{ border-color: var(--amber-bd); background: var(--amber-bg); }
.pill-ai .dot{ background: var(--txt-mute); }
.pill-ai.is-connected .dot{ background: var(--amber); box-shadow: 0 0 6px var(--amber); }
.pill-ai.is-error .dot{ background: var(--red); box-shadow: 0 0 6px var(--red); }
.pill-ai.is-idle .dot{ background: var(--txt-mute); }

.mode-switch-group{ display: flex; border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.pill-mode{
  border: 0; border-radius: 0; background: transparent; color: var(--txt-dim);
  padding: 6px 12px; font-size: 11px; display: inline-flex; align-items: center; gap: 6px;
}
.pill-mode + .pill-mode{ border-left: 1px solid var(--line); }
.pill-mode.active{ background: var(--amber-bg); color: var(--amber-soft); }
.dot-live, .dot-demo{ width: 6px; height: 6px; border-radius: 50%; background: currentColor; }

.selector-group{ display: flex; gap: 6px; }
.select-pill{
  background: var(--panel); color: var(--txt-bright);
  border: 1px solid var(--line); border-radius: var(--r);
  font-size: 11.5px; padding: 6px 8px; outline: none;
}
.select-pill:focus{ border-color: var(--amber-bd); }

/* Butonlar */
.btn{
  font-family: var(--mono); font-size: 12px; font-weight: 600;
  border-radius: var(--r); padding: 8px 15px;
  border: 1px solid var(--line); background: var(--panel); color: var(--txt);
  transition: border-color .15s, background .15s, color .15s, transform .1s;
}
.btn:hover{ border-color: var(--line-strong); background: var(--panel-hover); color: var(--txt-bright); }
.btn:active{ transform: translateY(1px); }
.btn-primary{
  background: var(--amber); border-color: var(--amber); color: #141005;
}
.btn-primary:hover{ background: var(--amber-soft); border-color: var(--amber-soft); color: #141005; }
.btn-live-fetch{
  border-color: var(--amber-bd); color: var(--amber-soft); background: var(--amber-bg);
}
.btn-live-fetch:hover{ background: rgba(240,180,41,.14); color: var(--amber-soft); }
.btn-ghost{ background: transparent; }
.btn-danger{
  background: var(--red-bg); border-color: var(--red-bd); color: var(--red-soft);
}
.btn-danger:hover{ background: rgba(229,72,77,.16); color: #fff; }
.btn-sm{ padding: 6px 11px; font-size: 11px; }
.btn-icon{ padding: 7px 12px; }

/* ================================================= BANNERLAR */
.demo-banner, .live-banner{
  display: flex; align-items: center; gap: 10px;
  padding: 8px 20px; font-size: 12px;
}
.demo-banner{
  background: var(--amber-bg);
  border-bottom: 1px solid var(--amber-bd);
  color: var(--amber-soft);
}
.demo-dot{ width: 8px; height: 8px; border-radius: 50%; background: var(--amber); flex: none; }
.live-banner{
  background: var(--red-bg);
  border-bottom: 1px solid var(--red-bd);
  color: var(--red-soft);
}
.live-dot{
  width: 8px; height: 8px; border-radius: 50%; background: var(--red); flex: none;
  animation: livePulse 1.2s ease infinite;
}
@keyframes livePulse{ 50%{ box-shadow: 0 0 0 5px rgba(229,72,77,.15); } }
.live-kill-btn{
  margin-left: auto; font-family: var(--mono); font-size: 11px; font-weight: 700;
  background: var(--red); color: #fff; border: 0; border-radius: var(--r);
  padding: 5px 12px;
}
.live-kill-btn:hover{ background: var(--red-soft); }

/* ================================================= DATA BAR */
.databar{
  display: flex; flex-wrap: wrap;
  background: var(--bg-soft);
  border-bottom: 1px solid var(--line);
  padding: 0 20px;
}
.kpi{
  display: flex; align-items: baseline; gap: 8px;
  padding: 9px 18px 9px 0; margin-right: 18px;
  position: relative;
}
.kpi:not(:last-child)::after{
  content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%);
  width: 1px; height: 16px; background: var(--line);
}
.kpi-lbl{
  font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--txt-mute); font-family: var(--disp); font-weight: 600;
}
.kpi-val{ font-size: 14px; font-weight: 600; color: var(--txt-bright); }

/* ================================================= ANA GRID */
.grid{
  display: grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  gap: 14px;
  padding: 14px 20px;
  align-items: stretch;
}

/* Panel temel */
.panel{
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.panel-head{
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 11px 14px;
  border-bottom: 1px solid var(--line-soft);
}
.panel-head h2{
  font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  font-stretch: 110%;
  display: flex; align-items: center; gap: 8px;
}
.panel-head h2::before{
  content: '//'; color: var(--amber); font-family: var(--mono); font-weight: 600;
}
.head-title{ display: flex; align-items: center; gap: 10px; }
.symbol-badge{
  font-size: 10.5px; color: var(--amber-soft);
  border: 1px solid var(--amber-bd); background: var(--amber-bg);
  border-radius: 3px; padding: 2px 8px; letter-spacing: .05em;
}
.step-indicator{ font-size: 11px; color: var(--txt-dim); }

.tag{
  font-size: 9.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  border-radius: 3px; padding: 3px 8px;
  border: 1px solid var(--line-strong); color: var(--txt-dim); background: var(--panel-2);
}
.tag-ai{ border-color: var(--amber-bd); color: var(--amber-soft); background: var(--amber-bg); }
.tag-wait{ border-color: var(--line-strong); color: var(--txt-dim); }
.tag-open{ border-color: var(--green-bd); color: var(--green-soft); background: var(--green-bg); }
.tag-won{ border-color: var(--green-bd); color: var(--green-soft); background: var(--green-bg); }

/* ================================================= GRAFİK PANELİ */
.chart-panel{ display: flex; flex-direction: column; min-width: 0; }
.chart-stage{
  position: relative;
  background: var(--chart-bg);
  border-bottom: 1px solid var(--line-soft);
}
#chartWrap svg{ display: block; width: 100%; height: auto; }

.chart-tooltip{
  position: absolute; top: 10px; left: 12px;
  display: flex; gap: 12px;
  background: rgba(5,6,7,.92);
  border: 1px solid var(--line-strong);
  border-radius: var(--r); padding: 6px 10px;
  font-size: 11px; color: var(--txt-dim);
  pointer-events: none; z-index: 5;
}
.chart-tooltip b{ color: var(--txt-bright); }

/* Legend — tıklanır katman anahtarları */
.legend{
  display: flex; flex-wrap: wrap; gap: 4px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--line-soft);
}
.lg{
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 10px; letter-spacing: .03em; color: var(--txt-mute);
  border: 1px solid transparent; border-radius: 3px;
  padding: 3px 8px; cursor: pointer; user-select: none;
  transition: color .15s, border-color .15s, opacity .15s;
}
.lg i{ width: 8px; height: 2px; background: var(--c, var(--txt-mute)); display: inline-block; }
.lg:hover{ border-color: var(--line-strong); color: var(--txt); }
.lg.on{ color: var(--txt-dim); }
.lg:not(.on){ opacity: .38; }
.lg:not(.on) i{ background: var(--txt-faint); }

/* Tahmin bandı */
.pred-banner{
  display: flex; align-items: baseline; gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-soft);
  background: var(--bg-soft);
  font-size: 12px;
}
.pred-lbl{
  font-family: var(--disp); font-size: 9.5px; font-weight: 700;
  letter-spacing: .14em; text-transform: uppercase; color: var(--amber);
  flex: none;
}
#predText b.up{ color: var(--green); }
#predText b.down{ color: var(--red); }
#predText b.neu{ color: var(--txt-bright); }

/* Kontroller */
.controls{
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 11px 14px;
}
.progress{
  flex: 1; min-width: 120px; height: 2px;
  background: var(--line); border-radius: 1px; overflow: hidden;
}
.progress-bar{
  height: 100%; background: var(--amber);
  transition: width .2s ease;
}

/* ================================================= SAĞ RAY (SEKMELİ) */
.side-rail{
  display: flex; flex-direction: column;
  min-height: 0; min-width: 0;
  overflow: hidden;
}
.side-tabbar{
  display: flex;
  border-bottom: 1px solid var(--line);
  background: var(--bg-soft);
  flex: none;
}
.stab{
  position: relative;
  flex: 1;
  font-family: var(--disp); font-size: 10px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--txt-mute);
  background: transparent; border: 0;
  padding: 10px 4px 9px;
  border-bottom: 2px solid transparent;
  transition: color .15s, border-color .15s;
}
.stab:hover{ color: var(--txt); }
.stab.active{ color: var(--amber-soft); border-bottom-color: var(--amber); }
.stab-dot{
  position: absolute; top: 6px; right: 8px;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--amber);
}

.tabpane{
  flex: 1; min-height: 0;
  display: flex; flex-direction: column;
  overflow: hidden;
}
.tabpane > .panel-head{ flex: none; }

/* Günlük */
.log{
  flex: 1; min-height: 0;
  overflow-y: auto;
  padding: 10px 12px;
  font-size: 11.5px;
  display: flex; flex-direction: column; gap: 6px;
}
.log-line{
  display: flex; gap: 9px; align-items: baseline;
  animation: slideL .3s ease both;
}
.log-line .t{ color: var(--txt-faint); font-size: 10px; flex: none; min-width: 34px; }
.log-line .m{ color: var(--txt); }
.log-line .m b{ color: var(--txt-bright); }
.log-line.good .m{ color: var(--green-soft); }
.log-line.good .m b{ color: var(--green-soft); }
.log-line.warn .m{ color: var(--amber-soft); }
.log-line.warn .m b{ color: var(--amber-soft); }
.log-idle{
  color: var(--txt-mute); font-size: 11.5px; line-height: 1.7;
  padding: 14px 4px; text-align: left;
}
.log-idle b{ color: var(--amber-soft); font-weight: 600; }

/* İşlem bileti */
.ticket{ padding-bottom: 12px; overflow-y: auto; }
.ticket-side{
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px 4px;
}
.side-badge{
  font-family: var(--disp); font-weight: 800; font-size: 13px; letter-spacing: .1em;
  color: var(--green); border: 1px solid var(--green-bd); background: var(--green-bg);
  border-radius: 3px; padding: 4px 12px;
}
.side-badge.short{ color: var(--red); border-color: var(--red-bd); background: var(--red-bg); }
.conf{ font-size: 10.5px; color: var(--txt-mute); display: flex; align-items: center; gap: 8px; flex: 1; }
.conf b{ color: var(--txt-bright); font-size: 12px; }
.conf-bar{
  flex: 1; height: 3px; background: var(--line); border-radius: 2px; overflow: hidden;
}
.conf-bar span{ display: block; height: 100%; background: var(--amber); transition: width .3s; }

.ticket-grid{
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 6px; padding: 10px 14px;
}
.tk{
  display: flex; flex-direction: column; gap: 3px;
  background: var(--panel-2); border: 1px solid var(--line-soft);
  border-radius: var(--r); padding: 8px 10px;
}
.tk span{
  font-size: 9px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--txt-mute); font-family: var(--disp); font-weight: 600;
}
.tk b{ font-size: 13px; color: var(--txt-bright); }
.tk-sl b{ color: var(--red-soft); }
.tk-tp b{ color: var(--green-soft); }

/* Giriş fiyatı — elle değiştir */
.tk-entry-view{ display: flex; align-items: center; gap: 6px; }
.tk-edit{
  margin-left: auto; cursor: pointer;
  font-family: var(--mono); font-size: 9px; font-weight: 600;
  letter-spacing: .05em; text-transform: uppercase;
  padding: 2px 7px; border-radius: var(--r);
  border: 1px solid var(--amber-bd); color: var(--amber-soft);
  background: var(--amber-bg);
  transition: background .15s, color .15s, border-color .15s;
}
.tk-edit:hover{ background: rgba(240,180,41,.16); border-color: var(--amber); }
.tk-entry-view .tk-manual-tag{
  font-size: 8px; line-height: 1; letter-spacing: .08em; text-transform: uppercase;
  color: var(--amber); font-family: var(--mono); font-weight: 600;
  border: 1px solid var(--amber-bd); border-radius: 3px;
  padding: 2px 4px; background: var(--amber-bg);
}
.tk-entry-edit{ display: flex; flex-direction: column; gap: 5px; margin-top: 3px; }
.tk-entry-input{
  width: 100%; box-sizing: border-box;
  font-family: var(--mono); font-size: 13px; font-weight: 600;
  color: var(--txt-bright); background: var(--panel);
  border: 1px solid var(--amber-bd); border-radius: var(--r);
  padding: 5px 7px; outline: none;
}
.tk-entry-input:focus{ border-color: var(--amber); }
.tk-entry-btns{ display: flex; gap: 5px; }
.tk-edit-ok, .tk-edit-cancel{
  flex: 1; cursor: pointer;
  font-family: var(--mono); font-size: 10px; font-weight: 600;
  padding: 4px 8px; border-radius: var(--r);
  transition: background .15s, color .15s, border-color .15s;
}
.tk-edit-ok{ background: var(--amber); border: 1px solid var(--amber); color: #141005; }
.tk-edit-ok:hover{ background: var(--amber-soft); border-color: var(--amber-soft); }
.tk-edit-cancel{ background: transparent; border: 1px solid var(--line-strong); color: var(--txt-mute); }
.tk-edit-cancel:hover{ border-color: var(--txt-mute); color: var(--txt-bright); }

.ticket-pnl{
  display: flex; align-items: center; justify-content: space-between;
  margin: 4px 14px 0; padding: 9px 12px;
  border: 1px dashed var(--line-strong); border-radius: var(--r);
  font-size: 11px; color: var(--txt-mute);
}
.ticket-pnl b{ font-size: 14px; }
.ticket-actions{ display: flex; gap: 8px; padding: 12px 14px 0; }

/* İndikatör paneli */
.indicator-panel{ overflow-y: auto; }
.ind-chips{
  display: flex; flex-wrap: wrap; gap: 5px;
  padding: 10px 14px 0;
}
.ichip{
  font-family: var(--mono); font-size: 10px; font-weight: 600; letter-spacing: .06em;
  color: var(--txt-mute);
  background: transparent; border: 1px solid var(--line); border-radius: 3px;
  padding: 4px 10px;
  transition: all .15s;
}
.ichip:hover{ border-color: var(--line-strong); color: var(--txt); }
.ichip.on{
  color: var(--amber-soft); border-color: var(--amber-bd); background: var(--amber-bg);
}
.ind-confluence{
  padding: 10px 14px 4px; font-size: 12px; color: var(--txt-dim);
}
.ind-confluence b{ color: var(--txt-bright); }
.ind-table-wrap{ padding: 6px 14px; overflow-x: auto; }
.ind-table{
  width: 100%; border-collapse: collapse; font-size: 11px;
}
.ind-table th{
  text-align: left; font-family: var(--disp); font-size: 9px; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase; color: var(--txt-mute);
  padding: 6px 8px; border-bottom: 1px solid var(--line);
}
.ind-table td{
  padding: 6.5px 8px; border-bottom: 1px solid var(--line-soft);
}
.ind-name{ color: var(--txt); }
.ind-val{ color: var(--txt-bright); font-weight: 600; }
.ind-sig{ font-size: 10px; font-weight: 600; letter-spacing: .04em; }
.sig-bull{ color: var(--green); }
.sig-bear{ color: var(--red); }
.sig-neu{ color: var(--txt-dim); }
.ind-note{ color: var(--txt-mute); font-size: 10px; }
.ind-hint{
  padding: 8px 14px 12px; font-size: 10.5px; color: var(--txt-mute); line-height: 1.55;
}

/* İşlem geçmişi */
.history-panel{ overflow-y: auto; }
.trade-history{ padding: 10px 14px; display: flex; flex-direction: column; gap: 5px; }
.hist-row{
  display: grid; grid-template-columns: 1.2fr .8fr .8fr 1fr;
  gap: 8px; align-items: center;
  font-size: 11px;
  background: var(--panel-2); border: 1px solid var(--line-soft);
  border-radius: var(--r); padding: 7px 11px;
}
.hist-row.open{ border-left: 2px solid var(--amber); }
.hist-row.closed{ border-left: 2px solid var(--line-strong); color: var(--txt-dim); }
.hist-empty{
  color: var(--txt-mute); font-size: 11.5px; padding: 14px 0; text-align: center;
}

/* Çoklu-parite açık pozisyon paneli (Bilet sekmesi) */
.multi-pos{ padding: 4px 14px 10px; display: flex; flex-direction: column; gap: 5px; }
.multi-pos-head{
  font-size: 9.5px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--txt-mute); padding: 4px 0 2px;
}
.multi-pos-head small{ text-transform: none; letter-spacing: 0; }
.mp-row{ grid-template-columns: 1fr .9fr 1fr 24px; cursor: pointer; }
.mp-row:hover{ border-color: var(--amber-bd); }
.mp-pnl{ font-variant-numeric: tabular-nums; text-align: right; }
.mp-close{
  background: none; border: 1px solid var(--line-soft); border-radius: 3px;
  color: var(--txt-dim); font-size: 10px; line-height: 1;
  width: 20px; height: 20px; cursor: pointer; padding: 0;
}
.mp-close:hover{ color: var(--red); border-color: var(--red); }

/* Hafıza paneli */
.memory-panel{ overflow-y: auto; padding-bottom: 12px; }
.mem-badge{
  font-size: 9px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--amber-soft); border: 1px solid var(--amber-bd); background: var(--amber-bg);
  border-radius: 3px; padding: 2.5px 7px;
}
.mem-summary{
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 6px; padding: 12px 14px 6px;
}
.mem-stat{
  display: flex; flex-direction: column; gap: 2px;
  background: var(--panel-2); border: 1px solid var(--line-soft);
  border-radius: var(--r); padding: 8px 9px;
}
.mem-k{
  font-size: 8.5px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--txt-mute); font-family: var(--disp); font-weight: 600;
}
.mem-v{ font-size: 13px; color: var(--txt-bright); }

.mem-metrics{
  display: grid; grid-template-columns: repeat(5, 1fr);
  gap: 5px; padding: 4px 14px 6px;
}
.mm-cell{
  display: flex; flex-direction: column; gap: 2px;
  background: var(--panel-2); border: 1px solid var(--line-soft);
  border-radius: var(--r); padding: 7px 8px;
}
.mm-k{
  font-size: 8px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--txt-mute); font-family: var(--disp); font-weight: 600;
}
.mm-v{ font-size: 12px; }
.mm-v.up{ color: var(--green-soft); }
.mm-v.down{ color: var(--red-soft); }
.mm-v.neu{ color: var(--txt-bright); }

.mem-backtest{
  margin: 2px 14px 6px; padding: 8px 11px;
  border: 1px dashed var(--line-strong); border-radius: var(--r);
  font-size: 10.5px; color: var(--txt-dim); line-height: 1.6;
}
.mem-backtest .up{ color: var(--green-soft); }
.mem-backtest .down{ color: var(--red-soft); }
.mm-bt-label{
  color: var(--amber-soft); font-family: var(--disp); font-weight: 700;
  font-size: 9px; letter-spacing: .1em; text-transform: uppercase; margin-right: 4px;
}

.mem-setups{ display: flex; flex-direction: column; gap: 5px; padding: 4px 14px; }
.mem-row{
  display: grid; grid-template-columns: 1.3fr .9fr .6fr .7fr .6fr;
  gap: 6px; align-items: center;
  font-size: 10.5px;
  background: var(--panel-2); border: 1px solid var(--line-soft);
  border-radius: var(--r); padding: 7px 10px;
}
.mem-setup{ color: var(--txt-bright); font-weight: 600; }
.mem-n{ color: var(--txt-mute); }
.mem-wr{ color: var(--txt); }
.mem-r{ color: var(--txt-dim); }
.mem-delta{ text-align: right; }
.mem-delta.up{ color: var(--green-soft); }
.mem-delta.down{ color: var(--red-soft); }
.mem-delta.neu{ color: var(--txt-mute); }

/* ================================================= TANITIM BÖLÜMLERİ */
.section{ padding: 36px 20px 8px; }
.section-head{ margin-bottom: 18px; max-width: 720px; }
.section-head h2{
  font-size: 19px; font-weight: 800; font-stretch: 115%; letter-spacing: .01em;
  display: flex; align-items: center; gap: 10px;
}
.section-head h2::before{
  content: '//'; color: var(--amber); font-family: var(--mono);
  font-size: 15px; font-weight: 600;
}
.section-head p{ color: var(--txt-dim); font-size: 12.5px; margin-top: 6px; }

.pipeline{
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px;
}
.stage{
  position: relative;
  background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 14px 13px 13px;
  transition: border-color .2s;
}
.stage:hover{ border-color: var(--amber-bd); }
.stage-no{
  font-family: var(--mono); font-size: 10px; font-weight: 600;
  color: var(--amber); letter-spacing: .1em;
}
.stage h3{
  font-size: 12px; font-weight: 700; font-stretch: 108%;
  margin: 7px 0 5px; letter-spacing: .02em;
}
.stage p{ font-size: 10.5px; color: var(--txt-mute); line-height: 1.55; }
.stage.active::after{
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, var(--amber), transparent 70%);
}

.results{
  display: grid; grid-template-columns: 1fr 1fr 1.4fr 1.4fr; gap: 8px;
}
.result-card{ padding: 15px 16px; display: flex; flex-direction: column; gap: 5px; }
.rc-lbl{
  font-family: var(--disp); font-size: 9.5px; font-weight: 700;
  letter-spacing: .13em; text-transform: uppercase; color: var(--txt-mute);
}
.rc-val{ font-size: 21px; font-weight: 600; color: var(--txt-bright); }
.rc-sub{ font-size: 11px; color: var(--txt-mute); }
.rc-sub b{ font-weight: 600; }
.equity-chart{ margin-top: 4px; }
.equity-chart svg{ display: block; width: 100%; height: 84px; }
.result-card.summary p{ font-size: 11.5px; color: var(--txt-dim); line-height: 1.6; }

/* ================================================= FOOTER */
.footer{
  margin-top: 34px; padding: 18px 20px 26px;
  border-top: 1px solid var(--line);
  background: var(--bg-soft);
}
.foot-tech{ font-size: 11px; color: var(--txt-mute); line-height: 1.7; }
.foot-tech strong{ color: var(--txt-dim); font-family: var(--disp); letter-spacing: .06em; }
.disclaimer{ margin-top: 8px; font-size: 10.5px; color: var(--txt-faint); }
.disclaimer b{ color: var(--txt-mute); }

/* ================================================= MODAL */
.modal-backdrop{
  position: fixed; inset: 0; z-index: 60;
  background: rgba(3,4,5,.78);
  backdrop-filter: blur(3px);
  display: flex; align-items: flex-start; justify-content: center;
  padding: 40px 16px;
  overflow-y: auto;
}
.modal-content{
  width: 100%; max-width: 620px;
  background: var(--panel);
  border: 1px solid var(--line-strong);
  animation: rise .3s ease both;
}
.btn-close{
  background: transparent; border: 0; color: var(--txt-mute);
  font-size: 22px; line-height: 1; padding: 2px 6px;
}
.btn-close:hover{ color: var(--txt-bright); }

.settings-tabbar{
  display: flex;
  border-bottom: 1px solid var(--line);
  background: var(--bg-soft);
}
.mtab{
  flex: 1;
  font-family: var(--disp); font-size: 10px; font-weight: 700;
  letter-spacing: .09em; text-transform: uppercase;
  color: var(--txt-mute);
  background: transparent; border: 0;
  padding: 11px 4px;
  border-bottom: 2px solid transparent;
  transition: color .15s, border-color .15s;
}
.mtab:hover{ color: var(--txt); }
.mtab.active{ color: var(--amber-soft); border-bottom-color: var(--amber); }

.modal-body{ padding: 16px 18px; max-height: 62vh; overflow-y: auto; }
.form-group{ margin-bottom: 16px; }
.form-group label{ display: block; font-size: 12px; color: var(--txt); margin-bottom: 6px; }
.form-group label strong{ color: var(--txt-bright); font-weight: 600; }
.form-control{
  width: 100%;
  background: var(--bg-soft); color: var(--txt-bright);
  border: 1px solid var(--line); border-radius: var(--r);
  font-size: 12px; padding: 8px 10px; outline: none;
  transition: border-color .15s;
}
.form-control:focus{ border-color: var(--amber-bd); }
.help-text{
  display: block; font-size: 10.5px; color: var(--txt-mute);
  margin-top: 5px; line-height: 1.55;
}
.help-text code{
  background: var(--panel-2); border: 1px solid var(--line-soft);
  border-radius: 2px; padding: 0 4px; font-size: 10px;
}

.ai-test-row{ display: flex; align-items: center; gap: 12px; }
.ai-test-row .btn{ flex: none; }
.ai-conn-status{ font-size: 11px; color: var(--txt-mute); }
.ai-conn-status.ok{ color: var(--green-soft); }
.ai-conn-status.err{ color: var(--red-soft); }

.chk{
  display: flex; align-items: center; gap: 8px;
  font-size: 11.5px; color: var(--txt); cursor: pointer;
  padding: 4px 0;
}
.chk input{ accent-color: var(--amber); width: 14px; height: 14px; }
.ind-toggles{ display: grid; grid-template-columns: 1fr 1fr; gap: 2px 14px; }

.live-trade-group{
  border: 1px solid var(--red-bd); border-radius: var(--r-lg);
  padding: 13px 14px; background: rgba(229,72,77,.03);
}
.lt-warn{
  font-size: 10.5px; color: var(--red-soft); line-height: 1.6;
  border: 1px dashed var(--red-bd); border-radius: var(--r);
  padding: 8px 10px; margin-bottom: 10px;
}
.lt-enable{ font-size: 12px; }
.lt-row{ display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.lt-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 10px 0; }
.lt-grid label{ font-size: 10px; color: var(--txt-mute); display: flex; flex-direction: column; gap: 4px; }
.lt-kill{ width: 100%; margin-top: 6px; }

.modal-footer{
  display: flex; justify-content: flex-end; gap: 8px;
  padding: 13px 18px;
  border-top: 1px solid var(--line);
  background: var(--bg-soft);
}

.oc-modal{ max-width: 440px; }
.oc-details{
  white-space: pre-line;
  font-size: 12.5px; color: var(--txt-bright);
  background: var(--bg-soft); border: 1px solid var(--line);
  border-radius: var(--r); padding: 12px 14px; margin-top: 10px;
}

/* ================================================= TOAST */
/* Bilgi baloncuğu tıklamayı YUTMAZ (pointer-events: none): AL / SAT 2026-10-26'dan beri grafiğin altındaki emir panelinde — ekranın alt
   ortasında duran baloncuk (3 sn) önceden düğmenin üstüne düşüp tıklamayı alıyordu. İçinde bağlantı / düğme yok (yalnız metin). */
.toast{
  position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%) translateY(8px);
  z-index: 80; pointer-events: none;
  background: var(--panel-2);
  border: 1px solid var(--amber-bd);
  border-left: 3px solid var(--amber);
  color: var(--txt-bright);
  font-size: 12px;
  border-radius: var(--r); padding: 10px 16px;
  opacity: 0; transition: opacity .25s, transform .25s;
  max-width: min(92vw, 560px);
}
.toast.show{ opacity: 1; transform: translateX(-50%) translateY(0); }

/* ================================================= SAĞ ALT BİLDİRİM */
/* z-index 55: gezinme çubuğunun (50) üstünde, pencerelerin (modal 60) ALTINDA — Al-Sat'ta yığın grafik sütununa kaydığı için önceden
   Ayarlar penceresinin "Kaydet" düğmesini örtüyordu (bildirim 9 sn kalır, tıklama karta düşüyordu). */
.notif-stack{
  position: fixed; right: 18px; bottom: 18px; z-index: 55;
  display: flex; flex-direction: column; gap: 8px;
  width: min(320px, 92vw); pointer-events: none;
}
.notif-card{
  pointer-events: none;   /* kart tıklamayı YUTMAZ (altındaki AL / SAT / Kapat çalışır); yalnız ✕ tıklanır */
  background: var(--panel-2);
  border: 1px solid var(--line-strong);
  border-left: 3px solid var(--amber);
  border-radius: var(--r-lg);
  padding: 11px 12px;
  box-shadow: 0 8px 26px rgba(0,0,0,.45);
  opacity: 0; transform: translateX(16px);
  transition: opacity .28s, transform .28s;
}
.notif-card.show{ opacity: 1; transform: none; }
.notif-long{ border-left-color: var(--green); }
.notif-short{ border-left-color: var(--red); }
.notif-win{ border-left-color: var(--green); }
.notif-loss{ border-left-color: var(--red); }
.notif-head{
  display: flex; align-items: center; gap: 7px;
  font-family: var(--disp); font-size: 11px; font-weight: 700;
  letter-spacing: .04em; color: var(--txt-bright);
}
.notif-head b{ flex: 1; }
.notif-dot{ width: 7px; height: 7px; border-radius: 50%; background: var(--amber); flex: none; }
.notif-long .notif-dot, .notif-win .notif-dot{ background: var(--green); box-shadow: 0 0 6px var(--green); }
.notif-short .notif-dot, .notif-loss .notif-dot{ background: var(--red); box-shadow: 0 0 6px var(--red); }
.notif-x{
  border: 0; background: transparent; color: var(--txt-mute);
  cursor: pointer; font-size: 12px; line-height: 1; padding: 2px 3px;
  pointer-events: auto;
}
.notif-x:hover{ color: var(--txt-bright); }
.notif-sym{ font-size: 13px; font-weight: 600; color: var(--txt-bright); margin: 4px 0 3px; }
.notif-line{ font-size: 11.5px; color: var(--txt-dim); line-height: 1.5; }

/* ================================================= ARANABİLİR PARİTE SEÇİCİ */
.pair-picker{ display: inline-flex; align-items: center; gap: 6px; }
.pair-input{
  width: 148px;
  background: var(--panel); color: var(--txt-bright);
  border: 1px solid var(--line); border-radius: var(--r);
  font-size: 12px; font-weight: 600; letter-spacing: .03em;
  padding: 6px 9px; outline: none;
}
.pair-input:focus{ border-color: var(--amber-bd); }
.pair-input::placeholder{ color: var(--txt-mute); font-weight: 400; }
.pair-count{ font-size: 9.5px; color: var(--txt-mute); white-space: nowrap; }

/* Sağ üst bakiye pili */
.pill-bal{ cursor: pointer; transition: border-color .15s, background .15s; }
.pill-bal:hover{ border-color: var(--amber-bd); background: var(--amber-bg); }
.pill-bal .bal-ico{
  display: inline-grid; place-items: center; width: 15px; height: 15px;
  border-radius: 50%; background: var(--amber); color: #141005;
  font-size: 10px; font-weight: 700;
}
.pill-bal #balanceText{ color: var(--txt-bright); font-weight: 600; }
.pill-bal.is-testnet .bal-ico{ background: var(--txt-mute); color: var(--bg); }
.pill-bal.is-testnet #balanceText{ color: var(--amber-soft); }

/* İzleme listesi — ekle kutusu + çipler */
.wl-add{ display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.wl-add .form-control{ flex: 1; min-width: 160px; }
.wl-add .btn{ flex: none; }
.wl-chips{ display: flex; flex-wrap: wrap; gap: 6px; }
.wl-chip{
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; font-weight: 600; color: var(--amber-soft);
  background: var(--amber-bg); border: 1px solid var(--amber-bd);
  border-radius: 3px; padding: 4px 6px 4px 9px;
}
.wl-x{
  display: inline-grid; place-items: center; width: 15px; height: 15px;
  border: 0; border-radius: 3px; cursor: pointer;
  background: transparent; color: var(--amber-soft); font-size: 11px; line-height: 1;
}
.wl-x:hover{ background: rgba(229,72,77,.2); color: var(--red-soft); }
.wl-empty{ font-size: 11px; color: var(--txt-mute); }

/* Ajan oturum durumu (data bar) */
.kpi-session{ margin-left: auto; }
.sess-live{ color: var(--green-soft); }
.sess-live::before{ content: '● '; }
.sess-off{ color: var(--txt-mute); }
.sess-off::before{ content: '○ '; }

/* Portföy şeridi (Portföy sekmesi) */
.pf-strip{
  display: grid; grid-template-columns: 1fr 1fr; gap: 6px;
  padding: 12px 14px 4px;
}
.pf-cell{
  display: flex; flex-direction: column; gap: 2px;
  background: var(--panel-2); border: 1px solid var(--line-soft);
  border-radius: var(--r); padding: 9px 11px;
}
.pf-bal{ font-size: 17px; color: var(--txt-bright); }
.pf-sub{ font-size: 10px; color: var(--txt-mute); }
.pf-equity{ padding: 4px 14px 8px; }

/* Nasıl Çalışır listesi (ayarlar) */
.how-list{ margin: 0 0 4px; padding-left: 20px; display: flex; flex-direction: column; gap: 9px; }
.how-list li{ font-size: 12px; color: var(--txt-dim); line-height: 1.55; }
.how-list li b{ color: var(--txt-bright); font-weight: 600; }
.how-list li::marker{ color: var(--amber); font-family: var(--mono); font-weight: 600; }

label.mt{ margin-top: 10px; }
.lt-grid.two{ grid-template-columns: 1fr 1fr; }

/* ================================================= RESPONSIVE */
@media (max-width: 1100px){
  .grid{ grid-template-columns: minmax(0, 1fr) 340px; }
}

@media (max-width: 920px){
  .grid{ grid-template-columns: 1fr; }
  .side-rail{ min-height: 380px; max-height: 480px; }
  .databar{ padding: 0 14px; }
  .kpi{ padding: 8px 12px 8px 0; margin-right: 12px; }
  .topbar{ padding: 10px 14px; }
  .grid{ padding: 12px 14px; }
  .section{ padding: 28px 14px 6px; }
}

@media (max-width: 640px){
  .mem-metrics{ grid-template-columns: repeat(3, 1fr); }
  .ticket-grid{ grid-template-columns: 1fr 1fr; }
  .topbar-right{ width: 100%; justify-content: flex-start; flex-wrap: wrap; }
  .kpi-val{ font-size: 12.5px; }
  .kpi-session{ margin-left: 0; }
  .lt-grid{ grid-template-columns: 1fr; }
  .lt-grid.two{ grid-template-columns: 1fr 1fr; }
  .ind-toggles{ grid-template-columns: 1fr; }
  .pair-input{ width: 120px; }
}