.select-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    margin-top:20px;
}

.select-field{
    width:100%;
    height:50px;
    border-radius:14px;
    border:1px solid #d9d9d9;
    padding:0 18px;
    font-size:1rem;
    outline:none;
    background:#f7f7f7;
    color:#365951;
    cursor:pointer;
}

.select-field:focus{
    border-color:#007f5f;
}

.button-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    margin-top:18px;
}

.btn{
    height:44px;
    border:none;
    border-radius:14px;
    color:white;
    font-size:1rem;
    cursor:pointer;
    transition:0.3s;
}

.swap-btn{
    background:#365951;
}

.copy-btn{
    background:#007f5f;
}

.btn:hover{
    opacity:0.9;
    transform:translateY(-1px);
}

.precision-box{
    margin-top:16px;
}

.precision-label{
    color:#192c27;
    margin-bottom:8px;
    display:block;
    font-size:1rem;
}

.precision-select{
    width:215px;
    height:50px;
    border-radius:14px;
    border:1px solid #d9d9d9;
    padding:0 15px;
    font-size:1rem;
    background:#f7f7f7;
    outline:none;
    color:#365951;
}

.result-box{
    margin-top:18px;
    background:#f4f5f5;
    border-radius:18px;
    padding:24px 20px;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.result-value{
    font-size:2rem;
    font-weight:700;
    color:#192c27;
}

.result-unit{
    font-size:1.8rem;
    font-weight:600;
    color:#192c27;
}

.bottom-result{
    margin-top:25px;
    border-top:1px solid #d7d7d7;
    border-bottom:1px dashed #d7d7d7;
    padding:22px 0 12px;
    color:#365951;
    font-size:1.1rem;
}

.history{
    margin-top:24px;
}

.headi{
    color:#192c27;
    margin-bottom:14px;
}

.history-list{
    display:flex;
    flex-direction:column;
    gap:10px;
    max-height:200px;
    overflow-y:auto;
}

.history-item{
    background:#f7f7f7;
    border-left:4px solid #007f5f;
    padding:12px 15px;
    border-radius:10px;
    color:#192c27;
}