#site-scroll-arrow {
    position: fixed !important;
    z-index: 2147483647 !important;
    left: 50%;
    bottom: 22px;

    display: flex !important;
    width: 66px;
    height: 52px;
    align-items: center;
    justify-content: center;

    margin: 0;
    padding: 0;

    border: 2px solid rgba(255, 255, 255, .95);
    border-radius: 999px;

    color: #ffffff;
    background: rgba(4, 133, 169, .94);

    box-shadow:
        0 0 0 6px rgba(97, 221, 255, .18),
        0 12px 34px rgba(0, 0, 0, .55);

    font-family: Arial, Helvetica, sans-serif;
    font-size: 34px;
    font-weight: 900;
    line-height: 1;

    opacity: 1;
    visibility: visible;
    transform: translateX(-50%);

    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;

    transition:
        background 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease;
}

#site-scroll-arrow:hover {
    background: rgba(114, 91, 234, .97);
    border-color: #d8d1ff;

    box-shadow:
        0 0 0 8px rgba(155, 131, 255, .22),
        0 12px 34px rgba(0, 0, 0, .62);
}

#site-scroll-arrow[data-direction="up"] {
    background: rgba(114, 91, 234, .97);
}

#site-scroll-arrow[hidden] {
    display: none !important;
}

@media (pointer: coarse) {
    #site-scroll-arrow {
        left: 50% !important;
        bottom: 17px;
        width: 60px;
        height: 48px;
    }
}