#maincnt{margin:auto;display:flex;justify-content:center}.container{background:#fff;padding:25px;border-radius:12px;width:550px;box-shadow:0 4px 15px rgb(0 0 0 / .1)}.title{text-align:center;margin-bottom:25px;font-size:24px;font-weight:700;color:#222}label{font-size:14px;display:block;margin-bottom:5px;font-weight:600}.row{display:flex;gap:20px;margin-bottom:20px;flex-direction:column}input[type="number"],select{background:#fff;border:1px solid #ccc;padding:10px;border-radius:6px;color:#333;width:100%;font-size:14px}.weight-box{display:flex;align-items:center;border:1px solid #ccc;border-radius:6px;overflow:hidden}.weight-box input{border:none;background:#fff;color:#333;padding:10px;width:100%;outline:none;font-size:14px}.unit{display:flex;border-left:1px solid #ccc}.unit button{background:#f9f9f9;border:none;color:#333;padding:10px 15px;cursor:pointer;transition:background 0.3s}.unit button.active{background:#007bff;color:#fff}small{font-size:12px;color:#777;display:block;margin:8px 0 15px}.btn-group{display:flex;gap:10px;margin-bottom:20px}.btn-group button{flex:1;padding:12px;border:1px solid #ccc;border-radius:6px;font-size:14px;cursor:pointer;background:#f9f9f9;color:#333;transition:0.3s}.btn-group button.active,.btn-group button:hover{background:#007bff;color:#fff;border-color:#007bff}.result-box{margin-top:20px;background:#f9f9f9;padding:15px;border-radius:8px;border:1px solid #ddd;font-size:14px;line-height:1.6;white-space:pre-line;color:#222}.copy-btn{margin-top:12px;background:#007bff;color:#fff;border:none;padding:10px 15px;border-radius:6px;cursor:pointer;transition:background 0.3s}.copy-btn:hover{background:#0056b3}