feat: stopwatch and countdown implementation

[lgeronimo]

Supongamos que eres un desarrollador frontend Sr. que se apega a las buenas prácticas, sabiendo eso, vamos a construir una aplicación en javascript con su respectivo HTML que tenga un cronómetro y una cuenta atrás.

Debes tomar las siguientes consideraciones:

1. La aplicación debe ser responsiva, es decir, debe funcionar en dispositivos móviles y de de escritorio.

2. Si requieres algún estilo, este se debe incluir en un archivo separado.

3. De inicio la página debe tener dos apartados, uno para cronómetro y otro para cuenta atrás, uno a abajo del otro, ambos van a poder funcionar a la par.

A continuación te voy a describir la funcionalidad de cronómetro:

• Debe tener un contador de horas, minutos, segundos y milisegundos.
• Abajo del contador, debe haber dos botones, el de iniciar y el de limpiar, el botón de iniciar debe cumplir con tres funciones diferentes, iniciar, pausar y continuar, el texto va cambiando según la acción que corresponda y el contador debe cambiar en función de dicha acción, también el color y texto del botón va a cambiar en función de la acción en curso, crea la lógica pertinente según corresponda al nombre de la acción.
• Básate en este link de esta imagen https://raw.githubusercontent.com/LIDR-academy/AI4Devs-stopwatch/refs/heads/main/res/stopwatch.png para hacer un diseño igual, respetando que los milisegundos están abajo, con un fuente más pequeña.

A continuación te voy a describir la funcionalidad de cuenta atrás:

• Debe tener un contador de horas, minutos, segundos y milisegundos con el mismo diseño que el de cronómetro.
• En la parte inferior deberán estar los botones para poder configurar la hora, serán botones para poder aumentar y disminuir cada apartado por separado, a excepción de los milisegundos.
• Agrega las validaciones necesarias, tomando en cuenta que el valor máximo será 23:59:59 y valor mínimo será 00:00:00.
• Abajo de los botones para configurar el tiempo, deben haber dos botones, el de iniciar y el de limpiar, el botón de iniciar debe cumplir con tres funciones diferentes, iniciar, pausar y continuar, el texto va cambiando según la acción que corresponda y el contador debe cambiar en función de dicha acción, también el color y texto del botón va a cambiar en función de la acción en curso, crea la lógica pertinente según corresponda al nombre de la acción.
• Al darle click en iniciar, el contador irá disminuyendo hasta llegar a 0.

Esto debe aplicar para ambos casos (stopwatch y countdown):

• El botón de limpiar debe reiniciar el contador.

• Los botones de iniciar y limpiar deben estar alineados uno a lado de otro, con el mismo tamaño pero de diferente color.

• Los milisegundos deben estar debajo de los segundos y con una fuente mucho más pequeña que las horas, minutos y segundos.

• Todo el código generado debe estar en inglés.

Antes de darme una respuesta, puedes hacer las preguntas que necesites para una mejor solución.