body.pf2e-hud-hidden-tooltip #pf2e-hud-tooltip {
    display: none;
}

#pf2e-hud-tooltip {
    --inner-padding: 0.5em;
    --inner-gap: 0.6em;

    position: absolute;
    z-index: 9999;
    pointer-events: none;

    .wrapper {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        width: max-content;

        &[data-mode="top"] {
            bottom: var(--other-side);
        }

        &[data-mode="bottom"] {
            top: var(--other-side);
        }
    }

    .distance,
    .status {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;

        background: var(--outer-background);
        border-radius: var(--outer-border-radius);
        box-shadow: var(--outer-box-shadow);
        padding: 0.2em var(--inner-padding);
    }

    .distance {
        gap: 6px;
        z-index: -1;
        width: fit-content;
        margin: auto;

        i {
            &.fa-user {
                font-size: 0.92em;
            }
        }

        &:not(:last-child) {
            border-bottom-left-radius: 0;
            border-bottom-right-radius: 0;
        }
    }

    .status {
        color: hsl(var(--hue) 75% 40%);
        font-weight: bold;
        letter-spacing: 0.5px;
        min-width: 8em;
        max-width: 12em;
        text-align: center;
    }
}