.contextual-docs-help {
    position: fixed;
    right: 1.2rem;
    bottom: 1.2rem;
    z-index: 1030;
    display: inline-flex;
    align-items: center;
    gap: .72rem;
    max-width: min(360px, calc(100vw - 2rem));
    padding: .78rem .95rem;
    border: 1px solid rgba(186, 230, 253, .55);
    border-radius: 18px;
    color: #f8fafc;
    background:
        radial-gradient(circle at 100% 0, rgba(250, 204, 21, .28), transparent 8rem),
        linear-gradient(135deg, #082f49, #0f172a);
    box-shadow: 0 18px 48px rgba(2, 6, 23, .52);
    text-decoration: none;
}

.contextual-docs-help:hover,
.contextual-docs-help:focus {
    color: #fff;
    border-color: #facc15;
    transform: translateY(-2px);
    box-shadow: 0 22px 56px rgba(2, 6, 23, .62);
}

.contextual-docs-help:focus-visible {
    outline: 3px solid #facc15;
    outline-offset: 3px;
}

.contextual-docs-help__icon {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    place-items: center;
    border-radius: 14px;
    color: #082f49;
    background: linear-gradient(135deg, #bae6fd, #facc15);
}

.contextual-docs-help__copy {
    min-width: 0;
}

.contextual-docs-help__copy small {
    display: block;
    color: #bae6fd;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.contextual-docs-help__copy strong {
    display: block;
    overflow: hidden;
    color: #fff;
    font-size: .88rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 575.98px) {
    .contextual-docs-help {
        right: .75rem;
        bottom: .75rem;
        padding: .62rem;
    }

    .contextual-docs-help__copy strong { max-width: 190px; }
}