.rpc-container {

    max-width: 650px;
    margin: 30px auto;
    padding: 25px;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);

    font-family:
        Arial,
        Helvetica,
        sans-serif;

}


.rpc-container h2 {

    text-align:center;
    margin-bottom:25px;

}



.rpc-field {

    margin-bottom:20px;

}



.rpc-field label,
.rpc-time label {

    display:block;
    font-weight:bold;
    margin-bottom:6px;

}



.rpc-field select,
.rpc-field input,
.rpc-time input {

    width:100%;
    padding:10px;
    border:1px solid #ddd;
    border-radius:6px;
    font-size:16px;

}



.rpc-time {

    display:grid;
    grid-template-columns:
        repeat(3,1fr);

    gap:15px;
    margin-bottom:25px;

}



.rpc-button {

    width:100%;
    padding:14px;

    background:#0066cc;
    color:white;

    border:none;
    border-radius:8px;

    font-size:18px;
    cursor:pointer;

}


.rpc-button:hover {

    background:#004999;

}



.rpc-results {

    margin-top:30px;

}



.rpc-grid {

    display:grid;
    grid-template-columns:
        repeat(2,1fr);

    gap:15px;

}



.rpc-grid div {

    background:#f5f7fa;
    padding:15px;
    border-radius:8px;

    text-align:center;

}



.rpc-grid span {

    display:block;
    margin-top:8px;

    font-size:20px;
    color:#0066cc;

    font-weight:bold;

}



.rpc-table {

    width:100%;
    border-collapse:collapse;
    margin-top:20px;

}



.rpc-table th,
.rpc-table td {

    padding:10px;
    border-bottom:1px solid #ddd;
    text-align:center;

}



.rpc-table th {

    background:#f2f2f2;

}



@media(max-width:600px) {


    .rpc-time {

        grid-template-columns:1fr;

    }


    .rpc-grid {

        grid-template-columns:1fr;

    }


}