body { font-family: 'Segoe UI', sans-serif; background-color: #eef2f3; display: flex; justify-content: center; }

.calculator-container {
    max-width: 600px;
    background: #fff;
    padding: 20px;
    border: 2px solid #2e4a66;
    border-radius: 8px;
    margin-top: 20px;
}

h2 { color: #2e4a66; border-bottom: 2px solid #4b8a3e; padding-bottom: 5px; }
h3 { font-size: 15px; color: #444; }

.calc-row { margin-bottom: 15px; font-size: 14px; display: flex; align-items: center; flex-wrap: wrap; gap: 5px; }

input[type="number"], .res-box, select {
    padding: 5px;
    width: 85px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.res-box { 
    background-color: #f9f9f9; 
    font-weight: bold; 
    color: #2e4a66; 
    border: 1px solid #4b8a3e; 
}

button {
    background-color: #4b8a3e;
    color: white;
    border: none;
    padding: 6px 12px;
    cursor: pointer;
    border-radius: 4px;
    transition: 0.3s;
}

button:hover { background-color: #38692d; }

hr { border: 0; border-top: 1px solid #ddd; margin: 15px 0; }