#cuerpo {width: 99%;
        background: #33FFFF;
        font-size: 23px;
}
#cabecera {background: #FFCCFF;
        padding: 10px;
        width: 97%;
        height: clamp(20px, 3vw, 50px);
        border: 3px solid #9933FF;
}

article {color: #000000;
    display: inline-block;
    margin-top: 0px;
    margin-left:clamp(1px, 2vw, 100px);
    font-size: clamp(8px, 2.5vw, 28px);
    text-align: center;
}
img {width: clamp(15px, 2vw, 45px);
    display: inline-block;
}

#Actividad { text-align: left;
            width: 95%;
            height: 1200px;
            display: block;
            border: 2px solid #33FFFF;
 }#mensajeok{
        font-size: clamp(20px, 4vw, 70px);
        color: #9933FF;
        background-color: white;
        text-align: center;
        margin-top: clamp(1px, 4vw, 70px) ;
        margin-left:clamp(10px, 5.5vw, 100px);
        display: none;
}#mensajeno{
        font-size: clamp(20px, 4vw, 70px);
        color: #9933FF;
        background-color:white;
        text-align: center;
        margin-top: clamp(1px, 4vw, 70px) ;
        margin-left:clamp(10px, 5.5vw, 100px);
        display: none;
}

#blata {margin: 10px auto;
        background-color: #D3D3D3;
        border: 0px solid #33FFFF;
        width: clamp(75px, 50vw, 300px);
}.fila{
        height: 50px;
}.contenedor {
    display: flex;
    flex-direction: row; /* Coloca la tabla y los botones lado a lado */
    align-items: flex-star; /* Los alinea arriba */
    gap: clamp(1px, 0.8vw, 10px); /* Espacio entre la tabla y los botones */
}
#tabla {
    flex: 0 0 60%; /* La tabla ocupa el 80% del ancho */
    background-color: lightpink;
        border: 2px solid #000000;
}
#botones {
    width: 100%; /* Dentro de su espacio, ocupa el 100% */
    flex: 0 0 5%; /* Los botones ocupan el 15% restante */
    display: grid;
    margin-left: 0px;
    
    /* CAMBIO CLAVE: 1 sola columna para que bajen en vertical */
    grid-template-columns: 1fr; 
    
    gap: 70px;
}
#Comprobar {
    border-radius: 10px;
    color: #FFFFFF;
    background-color: blue;
    font-size: clamp(7px, 1.5vw, 17px);  
}#Comprobar:hover{ 
        cursor:pointer
}#Siguiente {
  border-radius: 10px;
   
    color: red;
    background-color: lightgreen;
    
    font-size: clamp(7px, 1.5vw, 17px);  
}#Siguiente:hover{ 
        cursor:pointer
}#Inicio {
  border-radius: 10px;
    
    color: #FFFFFF;
    background-color: orange;
    
    font-size: clamp(5px, 1vw, 15px);  
}#Inicio:hover{ 
        cursor:pointer
}#emaitza {
  border-radius: 10px;
    
    color: #FFFFFF;
    background-color: red;
    
    font-size: clamp(7px, 1.5vw, 20px);  
}#emaitza:hover{ 
        cursor:pointer
}
      
.filabor{
        height: clamp(45px, 8vh, 60px);
        display: inline-block;

}.cel{
        width: clamp(5px, 1.5vw, 40px);
        border: 1px solid #000000;
        font-size: clamp(17px, 3.5vw, 37px);
        text-align: center;
        color: blue;
}.celd{
        width: clamp(50px, 35vw, 450px);
        border: 1px solid #000000;
        font-size: clamp(17px, 3.5vw, 37px);
        text-align: center;
        color: blue;
}.celi{
        width: clamp(50px, 35vw, 450px);
        border: 1px solid #000000;
        font-size: clamp(17px, 3.5vw, 37px);
        text-align: center;
        color: blue;
}

.cajamul{
        width: clamp(45px, 30vw, 350px) ;
        
        background-color: pink;
        text-align: center;
        font-size: clamp(17px, 2.8vw, 35px);
        color: blue;
}.cajamuliz{
        width: clamp(45px, 30vw, 350px);
        
        background-color: pink;
        text-align: center;
        font-size:clamp(17px, 2.8vw, 35px) ;
        color: blue;
}.dob{
        width: clamp(8px, 5vw, 65px);
        border: 0px solid #33FFFF;
        font-size: clamp(20px, 3.5vw, 35px);
        text-align: center;
        color: blue;
}.dobiz{
        width: clamp(8px, 5vw, 65px);
        border: 0px solid #33FFFF;
        font-size: clamp(20px, 3.5vw, 35px);
        text-align: left;
        color: blue;
}.dobnum{
        width: clamp(8px, 5vw, 65px);
        border-top: 0px solid #33FFFF;
        border-right: 0px solid #33FFFF;
        border-left: 0px solid #33FFFF;
        border-bottom: 0px solid #33FFFF;
        font-size: clamp(20px, 3.5vw, 35px);
        text-align: center;
        color: blue;
}.dobcoe{
        width: clamp(8px, 5vw, 65px);
        border-top: 0px solid #33FFFF;
        border-right: 0px solid #33FFFF;
        border-left: 0px solid #33FFFF;
        border-bottom: 0px solid #33FFFF;
        font-size: clamp(20px, 3.5vw, 35px);
        text-align: right;
        color: blue;
}#filaraya{
        height: clamp(1px, 0.5vw, 4px);;
        background-color:#000000;
}#final{
        background-color:#ffffff;
}.celdfin{
        width: clamp(50px, 32vw, 425px);
        border: 1px solid #000000;
        font-size: clamp(17px, 3.5vw, 37px);
        text-align: center;
        color: blue;
}.cajafin{
       width: clamp(40px, 25vw, 250px);
        
        background-color: white;
        text-align: center;
        font-size: clamp(20px, 3vw, 35px);
        color: red;
}
<!--Para que no aparezcan las flechitas en la caja --> 
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
//Firefox:
input[type="number"] {
-moz-appearance: textfield;
}
input[type="number"]:hover,
input[type="number"]:focus {
-moz-appearance: number-input;
}
input[type=number] {
    -moz-appearance:textfield;
}