/* Fixed to the viewport so avatar scrolling and module overlays cannot clip it. */
.rail-tooltip {
  position: fixed;
  z-index: 2147483000;
  width: max-content;
  max-width: min(320px, calc(100vw - 20px));
  box-sizing: border-box;
  padding: 9px 12px;
  border: 1px solid var(--strong-line, #cbd8d0);
  border-radius: 9px;
  background: var(--floating-surface, #ffffff);
  color: var(--ink, #252e2a);
  box-shadow: var(--popover-shadow, 0 6px 24px rgb(32 53 40 / 12%));
  font-family: var(--theme-font, "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
  white-space: normal;
  overflow-wrap: anywhere;
  pointer-events: auto;
  user-select: none;
}
.rail-tooltip[hidden] { display: none; }
.rail-tooltip-text { display: block; overflow: auto; scrollbar-width: thin; }
.rail-tooltip::before {
  content: "";
  position: absolute;
  left: -5px;
  top: var(--rail-tooltip-arrow, 50%);
  width: 8px;
  height: 8px;
  border-left: 1px solid var(--strong-line, #cbd8d0);
  border-bottom: 1px solid var(--strong-line, #cbd8d0);
  background: var(--floating-surface, #ffffff);
  transform: translateY(-50%) rotate(45deg);
}
@media (forced-colors: active) {
  .rail-tooltip { color: CanvasText; background: Canvas; border-color: CanvasText; box-shadow: none; }
  .rail-tooltip::before { background: Canvas; border-color: CanvasText; }
}
