.chart-tooltip {
  position: absolute;
  z-index: 3;
  pointer-events: none;
  min-width: 180px;
  padding: 9px 11px;
  border: 1px solid #dce2e8;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 8px 24px #17232d24;
  color: #25303b;
  font-size: 11px;
  line-height: 1.7;
}
.chart-tooltip[hidden] { display: none; }
.chart-tooltip strong { display: block; font-size: 12px; }
.chart-tooltip .gain { color: #cf4d63; }
.chart-tooltip .loss { color: #159a69; }
.detail-note { color: #87929d; font-size: 11px; margin: 5px 0 10px; }
.detail-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin: 10px 0; }
.detail-card { border: 1px solid #e4e8ed; border-radius: 10px; padding: 8px 10px; min-width: 0; }
.detail-card small { display: block; color: #87929d; }
.detail-card b { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 3px; }
.detail-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.detail-head h3 { margin: 0; }
.detail-head small { color: #87929d; }
.detail-search { padding: 7px 10px; border: 1px solid #e4e8ed; border-radius: 99px; max-width: 170px; width: 100%; }
.detail-pager { display: flex; align-items: center; justify-content: flex-end; gap: 7px; margin-top: 9px; color: #7b8793; font-size: 11px; }
.detail-pager button { border: 1px solid #e4e8ed; border-radius: 6px; padding: 3px 8px; background: #fff; color: #33404c; }
.detail-pager button:disabled { opacity: .4; cursor: not-allowed; }
.detail-table { min-width: 660px; }
.detail-table th, .detail-table td { text-align: left; }
.detail-table .number { text-align: right; }
.detail-log { width: 100%; max-height: 260px; overflow: auto; border-top: 1px solid #eef0f3; padding-top: 8px; }
.detail-log-row { display: flex; gap: 9px; padding: 6px 2px; border-bottom: 1px solid #f0f2f4; font: 11px/1.5 Consolas, "Microsoft YaHei", monospace; }
.detail-log-row time { color: #89949e; white-space: nowrap; }
.detail-log-row span { color: #3d4a55; }
@media (max-width: 1080px) { .detail-cards { grid-template-columns: 1fr; } }
