.user-auth {
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: center;
    margin: 30px 0;
}

.btn-login, .btn-join {
    padding: 24px 48px; /* doubled from 12px 24px */
    font-size: 32px;    /* doubled from 16px */
    font-weight: 700;
    text-decoration: none;
    border-radius: 8px; /* slightly adjusted for visual balance */
    color: white;
    transition: all 0.3s ease-in-out;
    border: none;
    cursor: pointer;
}

.btn-login {
    background: linear-gradient(135deg, #578737 0%, #4a6b2f 100%);
}

.btn-login:hover {
    background: linear-gradient(135deg, #4a6b2f 0%, #3a5a24 100%);
}

.btn-join {
    background: linear-gradient(135deg, #7ec850 0%, #5fa52d 100%);
}

.btn-join:hover {
    background: linear-gradient(135deg, #5fa52d 0%, #4c8a24 100%);
}

@media (max-width: 768px) {
    .user-auth {
        flex-direction: column;
        gap: 20px;
    }
}