.tooltip-overlay {
    display: block;
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 1000;
    overflow: hidden;
}

.tooltip-overlay .tooltip--content {
    overflow: hidden;
    max-width: MIN(15rem, 80vw);
    max-height: 20lh;
    line-clamp: 20;
    -webkit-box-orient: vertical;
    border-radius: 0.25rem;
    margin: 0.25rem;
    padding: 0.25rem 0.5rem;
    color: var(--theme-fg-text-contrast);
    background-color: var(--theme-bg-tooltip);
    font: normal 400 14px/24px var(--theme-body-font-family);
    letter-spacing: normal;
    word-wrap: break-word;
    word-break: normal;
    white-space: pre-wrap;
    text-decoration: none;
    position: fixed;
    position-area: var(--tooltip-position, span-all bottom);
    position-try-fallbacks: var(--tooltip-fallbacks, flip-block, flip-inline);
    position-visibility: anchors-visible;
    transition: 150ms cubic-bezier(0, 0, 0.2, 1) forwards;
    transition-property: opacity, scale, display;
    transition-behavior: allow-discrete;
    transition-delay: var(--tooltip-hide-delay, 0);
    display: none;
    opacity: 0;
    scale: 0.8;
}

.tooltip-overlay .tooltip--content__visible {
    transition-duration: 75ms;
    transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
    transition-delay: var(--tooltip-show-delay, 0);
    display: block;
    display: -webkit-box;
    opacity: 1;
    scale: 1;
}

@starting-style {
    .tooltip-overlay .tooltip--content__visible {
        display: block;
        display: -webkit-box;
        opacity: 0;
        scale: 0.8;
    }
}

.tooltip-overlay .tooltip--content__fast {
    transition-delay: 0ms;
    transition-duration: 1ms;
}