@font-face{font-family:Space Mono;src:url(/assets/SpaceMono-Regular-7wDOIQj2.ttf)}:root{--bg: #ffe0e0;--calc-bg: #ffe0e0;--numbers: rgb(45, 45, 255);--operators: rgb(251, 135, 185);--solve: rgb(255, 196, 0);--clear: rgb(250, 85, 56);--border: rgb(45, 45, 255);--result: rgb(45, 45, 255)}*{box-sizing:border-box;margin:0;padding:0}html{font-size:10px}body{display:flex;justify-content:center;align-items:center;height:100dvh;background-color:var(--bg)}.calculator{width:350px;height:600px;background-color:#a9b7c4;padding:3.5rem 2.5rem;background-color:var(--calc-bg);border:4px solid var(--border);box-shadow:-15px 15px 0 2px var(--border);display:flex;flex-direction:column;justify-content:space-between}.calculator .display,.calculator input{font-family:Space Mono}.calculator .display{height:18%;padding:1rem 1.5rem;margin-bottom:1rem;display:flex;flex-direction:column;justify-content:flex-end;color:var(--result);font-size:3.5rem;text-align:right}.calculator .display #last-operation-div{font-size:1.5rem;opacity:.6}.calculator .btn-area{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;justify-items:center;padding-top:3.5rem;justify-content:space-between}.calculator .btn-area input{height:8vh;width:8vh;border:none;cursor:pointer;border-radius:50%;transition:transform .3s ease,opacity .2s ease;color:#fff;font-size:2.7rem}.calculator .btn-area input:active{transform:scale(.9)}.calculator .btn-area input:hover{opacity:.85}.calculator .btn-area input[value="0"]{width:100%;grid-column:span 2;border-radius:50px}.calculator .btn-area .numbers-bg{background-color:var(--numbers)}.calculator .btn-area .solve-bg{background-color:var(--solve)}.calculator .btn-area .operators-bg{background-color:var(--operators)}.calculator .btn-area .clear-bg{background-color:var(--clear)}@media screen and (max-width: 992px){.calculator{width:80vw;height:90vh}.calculator .display #last-operation-div{font-size:2.5rem}.calculator .btn-area{height:70%}}@media screen and (max-width: 576px){.calculator{width:100vw;height:100vh;border:none;box-shadow:none}.calculator .display #last-operation-div{font-size:2rem}.calculator .btn-area{display:flex;flex-wrap:wrap;justify-content:space-between;padding-top:0;gap:unset}.calculator .btn-area input{height:18vw;width:18vw}.calculator .btn-area input[value="0"]{width:50%;border-radius:50px}}