/* 喊单是浮层，不挤动任何既有元素：HUD / 持仓条 / 正文都保持原位置，
   toast 以 z-index 4 盖在其上（HUD 为 2，持仓条为 3）。 */
/* 竖排 toast：新的一条 prepend 到最前，也就是最上面，旧的依次下移。 */
.gngm-callouts {
  position: fixed;
  z-index: 4;
  /* 入场动画从 -10px 滑入，留出余量避免首条被视口顶部裁掉。 */
  top: 14px;
  /* 居中于整个视口，而不是中间的行情区（--gm-ax-*）。 */
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  width: min(300px, calc(100vw - 24px));
  max-height: calc(100dvh - 130px);
  pointer-events: none;
  color: #ededed;
  font: 14px/1.35 var(--font-ax, Inter, system-ui, sans-serif);
}
.gngm-callouts[hidden] { display: none; }
.gngm-callout {
  position: relative;
  min-width: 0;
  border: 1px solid #303034;
  border-radius: 8px;
  background: #17171a;
  box-shadow: 0 6px 24px #0008;
  pointer-events: auto;
  animation: gngm-callout-in .18s ease-out;
}
/* 新条目从上方滑入 */
@keyframes gngm-callout-in {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}
.gngm-callout.out {
  opacity: 0;
  transform: translateY(-6px);
  transition: opacity .18s ease-in, transform .18s ease-in;
}
@media (prefers-reduced-motion: reduce) {
  .gngm-callout { animation: none; }
}
.gngm-callout-open {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 5px;
  box-sizing: border-box;
  width: 100%;
  padding: 6px 9px;
  border: 0;
  border-radius: inherit;
  color: inherit;
  background: none;
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.gngm-callout-open:hover { background: #ffffff05; }
.gngm-callout-open:focus-visible {
  outline: 2px solid #69cf8d;
  outline-offset: 2px;
}
.gngm-callout-head { display: flex; align-items: center; justify-content: center; height: 20px; gap: 6px; min-width: 0; }
.gngm-callout-avatar, .gngm-callout-token-avatar {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  overflow: hidden;
  border-radius: 50%;
  background: #303638;
}
.gngm-callout-fallback { color: #c7decf; font-size: 13px; }
.gngm-callout-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gngm-callout-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.gngm-callout-text { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center; color: #ededed; font-size: 14px; font-weight: 600; }
.gngm-callout-token {
  display: inline-flex;
  align-items: center;
  line-height: 1;
  flex: 0 1 auto;
  gap: 4px;
  max-width: 42%;
  min-width: 0;
  height: 22px;
  box-sizing: border-box;
  padding: 1px 6px 1px 2px;
  border: 1px solid #333338;
  border-radius: 16px;
  background: #252529;
}
.gngm-callout-token-avatar { width: 17px; height: 17px; }
.gngm-callout-ticker { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
/* Narrow layouts put cards below navigation and the HUD, rather than over controls. */
@media (max-width: 1480px) {
  .gngm-callouts { top: calc(var(--gm-ax-top, 72px) + 42px); }
}
@media (max-width: 900px) {
  .gngm-callouts { gap: 5px; }
  .gngm-callout-open { padding: 6px 7px; }
  .gngm-callout-head { gap: 4px; }
}
/* 原来这里会把 HUD 下移、并给 #ax-body 加 96px 顶部内边距来给喊单腾位置。
   改成浮层后不再需要——那些规则正是"挤到其他元素"的来源。 */
