Estilo de entrada de número HTML5 (cuadro de número) en Chrome

Chrome ha actualizado recientemente sus estilos de elementos de entrada. Me gusta mucho elnumber tipo de entrada, pero su nuevo estilo nos da botones redondeados que no encajan perfectamente en cuadros de entrada cuadrados.

He puesto muchos intentos para hacer que estas entradas cambien, pero no se moverán. Desde elinput[type='number'] En sí a estos botones:

input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
    border-radius: none !important; background: black; color: red;
}

input:-webkit-autofill { background: black; color: red; }

Parece que no pueden cambiar en absoluto. ¿Alguien tiene experiencia con esto?Sé que hay una manera de ocultar los botones. Idealmente solo quiero eliminar su radio de borde.

Curiosamente, el relleno parece funcionar en estos botones. ¡Sé que están escuchando!

Respuestas a la pregunta(1)

Su respuesta a la pregunta