.uoph-gallery-dots[hidden] {
    display: none;
}

button.uoph-gallery-dot {
    all: unset;
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    inline-size: 2rem !important;
    block-size: 2rem !important;
    border-radius: 50% !important;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

button.uoph-gallery-dot::before {
    content: "";
    inline-size: .45rem;
    block-size: .45rem;
    border: 1px solid #fff;
    border-radius: 50%;
    background: #fff;
    opacity: .45;
    transform: scale(1);
    transition: opacity 180ms ease, transform 180ms ease;
}

button.uoph-gallery-dot.is-active::before {
    opacity: 1;
    transform: scale(1.45);
}

button.uoph-gallery-dot:focus-visible {
    opacity: .82;
}

@media (prefers-reduced-motion: reduce) {
    button.uoph-gallery-dot::before {
        transition: none !important;
    }
}