.dma-symbol-hover-card {
  position: fixed;
  z-index: 5000;
  width: min(468px, calc(100vw - 24px));
  max-height: min(560px, calc(100vh - 24px));
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(125, 154, 178, .28);
  border-radius: 8px;
  background: rgba(7, 15, 25, .97);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .44);
  color: #e8eef4;
  font: 13px/1.35 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  pointer-events: none;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity 120ms ease, transform 120ms ease;
}
.dma-symbol-hover-card[hidden] { display: none; }
.dma-symbol-hover-card.is-visible { opacity: 1; transform: translateY(0); }
.dma-symbol-hover-card__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 12px 8px;
  border-bottom: 1px solid rgba(125, 154, 178, .14);
}
.dma-symbol-hover-card__symbol-line {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}
.dma-symbol-hover-card__symbol-line strong {
  color: #f2f7fb;
  font-size: 18px;
  font-weight: 800;
}
.dma-symbol-hover-card__symbol-line i {
  max-width: 96px;
  padding: 2px 6px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(76, 141, 255, .16);
  color: #8db9ff;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dma-symbol-hover-card__head p {
  max-width: 360px;
  margin: 2px 0 0;
  overflow: hidden;
  color: #91a3b3;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dma-symbol-hover-card__status {
  flex: 0 0 auto;
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(76, 175, 80, .14);
  color: #63d58b;
  font-size: 10px;
  font-weight: 750;
}
.dma-symbol-hover-card__status.is-partial,
.dma-symbol-hover-card__status.is-warming,
.dma-symbol-hover-card__status.is-loading {
  background: rgba(244, 181, 72, .15);
  color: #f2c35e;
}
.dma-symbol-hover-card__status.is-unavailable {
  background: rgba(244, 67, 54, .13);
  color: #ff8a80;
}
.dma-symbol-hover-card__body {
  padding: 8px 12px 11px;
  overflow: auto;
}
.dma-symbol-hover-card__periods {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 4px;
  margin-bottom: 7px;
}
.dma-symbol-hover-card__period {
  min-width: 0;
  padding: 5px 3px;
  border: 1px solid rgba(255, 255, 255, .05);
  border-radius: 6px;
  background: rgba(255, 255, 255, .038);
  text-align: center;
}
.dma-symbol-hover-card__period span {
  display: block;
  color: #8192a1;
  font-size: 9px;
}
.dma-symbol-hover-card__period strong {
  display: block;
  margin-top: 2px;
  overflow: hidden;
  color: #edf4f8;
  font-size: 10px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dma-symbol-hover-card .is-up { color: #22c985; }
.dma-symbol-hover-card .is-down { color: #ff626f; }
.dma-symbol-hover-card__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 5px;
}
.dma-symbol-hover-card__metric {
  min-width: 0;
  padding: 5px 6px;
  border: 1px solid rgba(255, 255, 255, .055);
  border-radius: 6px;
  background: rgba(255, 255, 255, .045);
}
.dma-symbol-hover-card__metric span {
  display: block;
  color: #8fa1b0;
  font-size: 9px;
}
.dma-symbol-hover-card__metric strong {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: #f3f7fa;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dma-symbol-hover-card__note,
.dma-symbol-hover-card__liquidation {
  margin-top: 6px;
  padding: 6px 7px;
  border: 1px solid rgba(255, 255, 255, .05);
  border-radius: 6px;
  background: rgba(255, 255, 255, .032);
}
.dma-symbol-hover-card__note {
  overflow: hidden;
  color: #cbd6dd;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dma-symbol-hover-card__note.is-loading,
.dma-symbol-hover-card__liquidation.is-loading {
  border-color: rgba(88, 169, 255, .14);
  background: rgba(88, 169, 255, .045);
  color: #8fb8d8;
}
.dma-symbol-hover-card__note.is-unavailable {
  color: #8d9aa5;
}
.dma-symbol-hover-card__progress-line {
  min-height: 40px;
  display: flex;
  align-items: center;
  color: #7890a3;
  font-size: 10px;
}
.dma-symbol-hover-card__mini-title {
  margin-bottom: 4px;
  color: #8fa1b0;
  font-size: 9px;
  font-weight: 800;
}
.dma-symbol-hover-card__liq-row {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 1px 0;
  font-size: 10px;
}
.dma-symbol-hover-card__liq-row span { color: #8fa1b0; font-weight: 700; }
.dma-symbol-hover-card__liq-row strong {
  overflow: hidden;
  font-weight: 760;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dma-symbol-hover-card__liq-row .is-long { color: #ff707a; }
.dma-symbol-hover-card__liq-row .is-short { color: #22c985; }
@media (max-width: 520px) {
  .dma-symbol-hover-card__periods { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dma-symbol-hover-card__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}