/* ===== [v130] TCTip — shared animated chart tooltip =====================
   One floating card, reused by every chart that opts in. Rendered as HTML
   rather than Chart.js's canvas tooltip so it can carry real layout, colour
   per row, and CSS transitions between points. */
#tcTip{
  position:fixed; z-index:100080; pointer-events:none;
  min-width:210px; max-width:280px;
  background:rgba(12,12,22,.94);
  -webkit-backdrop-filter:blur(14px) saturate(1.3); backdrop-filter:blur(14px) saturate(1.3);
  border:1px solid rgba(124,92,252,.34); border-radius:14px;
  box-shadow:0 18px 48px rgba(0,0,0,.62), 0 0 0 1px rgba(255,255,255,.03) inset;
  padding:0; overflow:hidden;
  font-family:'Inter',system-ui,sans-serif;
  opacity:0; transform:translate3d(0,8px,0) scale(.965);
  transition:opacity .16s ease, transform .19s cubic-bezier(.2,.9,.25,1), left .13s cubic-bezier(.2,.9,.25,1), top .13s cubic-bezier(.2,.9,.25,1);
  will-change:left,top,opacity,transform;
}
#tcTip.tct-on{ opacity:1; transform:translate3d(0,0,0) scale(1); }
/* first appearance should not glide in from the last point's coordinates */
#tcTip.tct-warp{ transition:opacity .16s ease, transform .19s cubic-bezier(.2,.9,.25,1); }

.tct-head{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:10px 13px 9px; border-bottom:1px solid rgba(255,255,255,.07);
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,0));
}
.tct-date{ font-size:12.5px; font-weight:800; color:#f2f3fb; letter-spacing:.01em; white-space:nowrap; }
.tct-badge{
  font-size:9.5px; font-weight:900; letter-spacing:.09em; text-transform:uppercase;
  padding:3.5px 8px; border-radius:7px; white-space:nowrap;
  animation:tctPop .26s cubic-bezier(.2,1.3,.4,1) both;
}
.tct-badge.win { background:rgba(34,197,94,.17);  color:#7ff0aa; border:1px solid rgba(34,197,94,.32); }
.tct-badge.loss{ background:rgba(239,68,68,.17);  color:#ffa3ac; border:1px solid rgba(239,68,68,.32); }
.tct-badge.flat{ background:rgba(148,163,184,.15);color:#c3cad8; border:1px solid rgba(148,163,184,.28); }
@keyframes tctPop{ from{ opacity:0; transform:scale(.82);} to{ opacity:1; transform:scale(1);} }

.tct-body{ padding:9px 13px 11px; }
.tct-row{
  display:flex; align-items:baseline; justify-content:space-between; gap:14px;
  padding:3.5px 0; animation:tctRow .22s ease both;
}
.tct-row:nth-child(1){animation-delay:.01s}
.tct-row:nth-child(2){animation-delay:.04s}
.tct-row:nth-child(3){animation-delay:.07s}
.tct-row:nth-child(4){animation-delay:.10s}
.tct-row:nth-child(5){animation-delay:.13s}
@keyframes tctRow{ from{ opacity:0; transform:translateX(-4px);} to{ opacity:1; transform:none;} }
.tct-k{ font-size:11px; color:#858ca6; font-weight:600; white-space:nowrap; }
.tct-v{ font-size:12.5px; font-weight:800; color:#e8eaf5; font-family:'JetBrains Mono',monospace; white-space:nowrap; }
.tct-v.pos{ color:#4ade80; } .tct-v.neg{ color:#f87171; } .tct-v.dim{ color:#9aa1b8; font-weight:700; }
.tct-v.big{ font-size:14px; }
.tct-sep{ height:1px; background:rgba(255,255,255,.07); margin:7px 0 5px; }
.tct-foot{
  font-size:10.5px; padding:8px 13px 10px; border-top:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.02); color:#7f8699; letter-spacing:.02em;
}
@media(max-width:560px){ #tcTip{ min-width:180px; max-width:calc(100vw - 24px); } .tct-v{font-size:12px} }
@media(prefers-reduced-motion:reduce){
  #tcTip{ transition:opacity .12s ease; }
  .tct-badge,.tct-row{ animation:none; }
}