.gerador-nomes-form {
            width: 50%;
            margin: 0 auto;
            padding: 20px;
            border: 1px solid #ccc;
            border-radius: 10px;
            background-color: #f9f9f9;
        }

        @media (max-width: 768px) {
            .gerador-nomes-form {
                width: 80%;
            }
        }

        .gerador-nomes-result {
            width: 50%;
            margin: 20px auto;
            padding: 20px;
            border: 1px solid #ccc;
            border-radius: 10px;
            background-color: #f9f9f9;
        }

        @media (max-width: 768px) {
            .gerador-nomes-result {
                width: 80%;
            }
        }

        .required-label {
            color: red;
            font-weight: bold;
        }