.branch-chooser {
    display: flex;
    gap: 12px;
    margin: 1em 0 2em 0;
    flex-wrap: wrap;
}

.branch-choice {
    background: #f3f3f3;
    border: 2px solid #ddd;
    color: #333;
    border-radius: 24px;
    padding: 8px 24px;
    font-size: 1.1em;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s, color 0.2s;
}

.branch-choice.active,
.branch-choice:focus {
    background: #7d6b91;
    border-color: #513b69;
    color: #fff;
    font-weight: bold;
    outline: none;
}

.branch-choice:hover:not(.active) {
    background: #c8b6db;
    border-color: #3C79D8;
}