.h4 {text-align: center;}
.pdc-box {font-family: Arial,sans-serif;max-width: 450px;margin: 20px auto;background: #fff;padding: 20px;border-radius: 10px;box-shadow: 0 3px 12px rgba(0,0,0,.1);border: 1px solid #ddd;}
.pdc-row {display: flex;flex-wrap: wrap;align-items: center;justify-content: center;gap: 8px;margin-bottom: 15px;}
.pdc-box input {width: 80px;padding: 6px;border: 1px solid #ccc;border-radius: 5px;text-align: center;transition: .3s ease;}
.pdc-box input:focus {border-color: #4caf50;box-shadow: 0 0 5px rgba(76,175,80,.5);outline: none;}
.pdc-box span {font-weight: bold;}
.pdc-box strong {min-width: 40px;font-weight: bold;display: inline-block;text-align: center;}
.pdc-btn-row {display: flex;justify-content: center;gap: 12px;}
.pdc-btn-row button {padding: 6px 14px;border: none;border-radius: 4px;font-weight: bold;cursor: pointer;transition: .3s ease;}
#pdc-calc-btn {background-color: #4caf50;color: white;}
#pdc-calc-btn:hover {background-color: #45a049;}
#pdc-clear-btn {background-color: #a6acaf;color: white;}
#pdc-clear-btn:hover {background-color: #8e959b;}
.pdc-steps {margin-top: 15px;font-size: 14px;background: #f4fef5;border-left: 4px solid #4caf50;padding: 10px;border-radius: 6px;display: none;}