/**
 * Глобальные компоненты ASGUARD: подсказка-«?» и тултип.
 * Слово/кнопка не подчёркиваются; справа сверху — кружок «?».
 * Тултип появляется только при наведении на кружок, его левый нижний угол
 * крепится к точке курсора (правый верхний угол слова).
 */
.ag-tip { position: relative; display: inline-block; border-bottom: none; cursor: inherit; }

.ag-tip__badge {
  position: absolute; top: -7px; right: -7px; width: 15px; height: 15px;
  border-radius: 50%; background: #2b3035; color: #cfd6dd;
  border: 1px solid var(--ag-color-border);
  font: 600 9px/13px var(--ag-font-sans); text-align: center;
  cursor: pointer; pointer-events: auto; z-index: var(--ag-z-dropdown);
  transition: background var(--ag-dur-fast), opacity var(--ag-dur-fast);
}
.ag-tip__badge:hover, .ag-tip__badge:focus-visible { background: #3a4148; color: #fff; outline: none; }
.ag-tip.is-tip-open .ag-tip__badge { opacity: .35; }
.ag-tip--dark .ag-tip__badge { background: #0d1116; color: #fff; border-color: #000; }

/* Тултип — обычный элемент внутри слова: рамка и текст всегда вместе. */
.ag-tip__bubble {
  position: absolute; left: var(--tip-x, 0px); top: var(--tip-y, 0px);
  transform: translateY(-100%);
  width: max-content; max-width: 280px; padding: 7px 11px;
  background: var(--ag-color-panel); color: var(--ag-color-text);
  border: 1px solid var(--ag-color-border); border-radius: var(--ag-radius-sm);
  box-shadow: var(--ag-shadow-md);
  font: var(--ag-font-weight-regular) var(--ag-font-size-small)/1.4 var(--ag-font-sans);
  pointer-events: none; z-index: var(--ag-z-toast); white-space: normal;
  opacity: 0; visibility: hidden;
  transition: opacity var(--ag-dur-fast) var(--ag-ease-standard);
}
.ag-tip.is-tip-open .ag-tip__bubble { opacity: 1; visibility: visible; }