.ppidpi-wrapper{display:flex;justify-content:center;padding:20px}.ppidpi-container{background:#fdfdfd;border-radius:10px;box-shadow:0 2px 10px rgba(0,0,0,.1);max-width:640px;width:100%;padding:20px;font-family:Arial,Helvetica,sans-serif;color:#333}.ppidpi-container h2{font-size:1.8em;text-align:center;margin-bottom:.5em}.ppidpi-container h3{font-size:1.3em;margin-top:1.5em;margin-bottom:.5em}.ppidpi-container p.info,.ppidpi-container .note,.ppidpi-container .disclaimer{font-size:.9em;line-height:1.4;margin-bottom:.75em}.converter-section{margin-top:1.2em}.row{display:flex;flex-wrap:wrap;gap:10px}.row>div{flex:1 1 200px;min-width:0}label{display:block;font-weight:600;margin-bottom:4px}input[type="number"],select{width:100%;padding:8px;border:1px solid #ccc;border-radius:4px;background:#fff;font-size:1em;box-sizing:border-box}button{display:block;margin-top:10px;padding:10px 20px;border:none;border-radius:4px;background-color:#4caf50;color:#fff;font-size:1em;cursor:pointer;transition:background-color 0.3s ease}button:hover{background-color:#45a049}.conv-result,.ppi-result{margin-top:15px;font-size:.95em}.ppi-result p{margin-bottom:.5em}.mode-select{margin-bottom:10px}.diagram{text-align:center;margin-top:20px}.diagram img{max-width:100%;height:auto}.disclaimer{font-style:italic;color:#555;margin-top:20px;font-size:.8em}@media (max-width:600px){.row>div{flex-basis:100%}}