.display{display:flex;flex-direction:column;padding:10px 10px 20px;background:linear-gradient(90deg,#06beb6,#48b1bf 100%)}@media (min-width:800px){.display{border-top-left-radius:10px;border-top-right-radius:10px}}.expression{padding:5px;margin-bottom:10px;height:50px}.input,.value{padding:10px;text-align:right;background-color:transparent;color:white;border:0;letter-spacing:1.5px}.input{font-size:35px}.value{font-size:15px}.input::placeholder,.value::placeholder{color:white}.input:focus-visible,.value:focus-visible{outline-style:none;outline-width:0}.show-btn{display:grid;grid-template-columns:auto auto auto auto auto;background-color:white}@media (min-width:800px){.show-btn{border-bottom-left-radius:10px;border-bottom-right-radius:10px}}.equal{grid-column-start:4;grid-column-end:6}.btn:last-child{font-weight:medium;font-size:40px;width:110px;height:50px;border-radius:10px;color:white;background-color:#6dd5ed}.clr{color:#d66d75}.exp{color:#06beb6}.btn{width:60px;height:60px;margin:6px auto;font-size:24px;font-weight:500;cursor:pointer;border-radius:50%;background:none;border:0;user-select:none}@media (min-width:800px){.btn:hover{background-color:#6dd5ed}.btn.touched,.btn:active,.btn:hover{color:white;transition:background-color .3s ease;border-radius:50%}.btn.touched,.btn:active{background-color:#48b1bf}.btn:active{transform:scale(.9)}.btn.touched{pointer-events:none}}@media (max-width:800px){.btn:active{transform:scale(.9)}}.container{min-width:100%;display:flex;align-items:center;justify-content:center;max-height:30em}.main{border:0;box-shadow:0 0 3px .5px #c4e0e5;border-radius:10px;max-width:500px}@media (min-width:800px){.main{max-width:400px}}@media (max-width:600px){.main{width:100%;height:100%}}