input.tab {
    display: none;
}
label:has(+ input.tab) {
    cursor: pointer;
    margin-inline: 0.5rem;
    border-radius: 3px;
    border: solid currentcolor 2px;
    padding: 0.125rem;
    background: #88746B;
    &:has(+ .tab:checked) {
        background: #6B7F88;
    }
}
.tabs {
    margin-top: 1em;
    display: none;
}

#tab1:checked ~ .tab1 {
    display: block;
}

#tab2:checked ~ .tab2 {
    display: block;
}

#tab3:checked ~ .tab3 {
    display: block;
}

#tab4:checked ~ .tab4 {
    display: block;
}