*{box-sizing:border-box;margin:0;padding:0;font-family:Arial,sans-serif}body{color:#333;background-color:#f5f7fa}.container{background:#fff;border-radius:6px;max-width:700px;margin:10px auto;padding:20px;box-shadow:0 2px 10px #0000000d}.header{background-color:#fff;border-bottom:1px solid #e0e0e0;padding:16px 32px}.logo-title-wrapper{align-items:center;display:flex}.logo{width:auto;height:25px;margin-right:12px}.site-title{color:#222;text-align:left;margin:0;font-size:22px}.form{margin-top:20px}.form-row{justify-content:space-between;margin-bottom:14px;display:flex}.form-row label{color:#555;width:48%;font-size:14px}.form-row input{border:1px solid #ccc;border-radius:4px;width:48%;padding:8px;font-size:14px}.calculate-button{color:#fff;cursor:pointer;background:#0070f3;border:none;border-radius:4px;width:100%;margin-top:12px;padding:12px;font-size:15px;font-weight:700;display:block}.calculate-button:hover{background:#005bb5}.result-container{flex-wrap:wrap;gap:12px;margin-top:0;display:flex}.result-section{background-color:#f9f9f9;border:1px solid #ddd;border-radius:4px;flex:100%;padding:16px}.result-section h2{color:#333;margin-bottom:10px;font-size:16px}.result-section p{margin-bottom:6px;font-size:14px}.result-row{justify-content:space-between;align-items:center;margin:8px 0;display:flex}.result-row .label{text-align:left;flex:1;font-weight:500}.result-row .value{text-align:right;flex-shrink:0;align-items:center;gap:6px;display:flex}.copy-btn{cursor:pointer;color:#555;background:0 0;border:none;margin-left:6px;font-size:14px}.copy-btn:hover{color:#000}.footer{text-align:center;color:#888;margin-top:40px;padding:20px;font-size:13px}@media (min-width:768px){.container{margin-top:40px}.result-section{flex:48%}}