.activable {
    user-select: none;
    cursor: pointer;
}
.activable:active {
    transform: scale(.96);
    opacity: .85;
}

.hoverable {
    position: relative;
}

.hoverable::after {
    position: absolute;
    border-radius: inherit;
    background: currentcolor;
    block-size: 100%;
    content: "";
    inline-size: 100%;
    inset: 0;
    opacity: 0;
    pointer-events: none;
    transition: 250ms all ease;
}

.hoverable:hover::after {
    transition: 50ms all ease;
    opacity: 0.05;
}

.disabled {
    cursor: not-allowed !important;
    user-select: none;
    background: var(--disable-button) !important;
    color: var(--disable-text) !important;
    border-color: var(--disable-button) !important;
    pointer-events: none !important;
    box-shadow: 0 0 0 !important;
}
.unline:hover {
    text-decoration: underline;
}