/* Подсказки к терминам (public/js/hints.js). Цвета берутся из переменных страницы:
   --hint-ink, --hint-acc, --hint-pop-bg, --hint-pop-ink — с запасными значениями. */
.hint {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 17px;
    height: 17px;
    margin: 0 0 0 6px;
    padding: 0;
    border: 1px solid currentColor;
    border-radius: 50%;
    background: transparent;
    color: var(--hint-ink, #8b919c);
    font: italic 700 11px/1 Georgia, "Times New Roman", serif;
    vertical-align: -2px;
    cursor: help;
    opacity: .8;
}
/* палец крупнее иконки: невидимая зона нажатия ~33px */
.hint::after { content: ""; position: absolute; inset: -8px; }
.hint:hover, .hint[aria-expanded="true"] { color: var(--hint-acc, #4f46e5); opacity: 1; }
.hint:focus-visible { outline: 2px solid var(--hint-acc, #4f46e5); outline-offset: 2px; }

.hint-pop {
    position: fixed;
    z-index: 1000;
    padding: 10px 13px;
    border-radius: 12px;
    background: var(--hint-pop-bg, #1c2333);
    color: var(--hint-pop-ink, #ffffff);
    font: 400 13px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    letter-spacing: 0;
    text-align: left;
    text-transform: none;
    white-space: pre-line;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .22);
}
.hint-pop[hidden] { display: none; }