body {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;

}

#calculator {
    background-color: hsl(0, 0%, 20%);
    border-radius: 2rem; 
    max-width: 500px;
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
    box-sizing: border-box;
    
}

#display {
    width: 100%;
    padding: 20px;
    font-size: 5rem;
    border: none;
    color: whitesmoke;
    font-size: clamp(20px, 6vh, 32px);
}

input {
    background-color: hsl(0, 0%, 25%);
}

#btn {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding: 40px;
    gap: 20px;
    margin: 0 auto;
    width: 80%;
    min-width: 0;
    overflow: hidden;
}

button {
    height: 5rem;
    width: 5rem;
    border-radius: 2rem;
    border: none;
    font-size: 1.5rem;
    font-weight: bold;
    cursor: pointer;
    font-size: clamp(14px, 4vh, 40px);
    padding: clamp(8px, 2vh, 14px);
} 

/* UwU */