.wrapper{width:340px;height:540px;padding:10px;border-radius:10px;background-color:#434a52;background-image:linear-gradient(315deg,#2d2e30,#1d1f22 74%)}.screen{height:50px;width:100%;margin-bottom:5px;padding:0 10px;background-color:#7079832d;border-radius:10px;display:flex;align-items:center;justify-content:flex-end;color:#fff;font-weight:700;box-sizing:border-box}.buttonBox{width:100%;height:calc(100% - 110px);display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(5,1fr);grid-gap:10px}button{border:none;background-color:#16038f;font-size:24px;color:#fff;font-weight:700;cursor:pointer;border-radius:10px;outline:none}button:hover{background-color:#1801b2}.equals{grid-column:2 / 5;background-color:#c11d00}.clear{grid-column:1 / 3}.one,.two,.three,.four,.five,.six,.seven,.eight,.nine,.zero{background-color:#410050}.one:hover,.two:hover,.three:hover,.four:hover,.five:hover,.six:hover,.seven:hover,.eight:hover,.nine:hover,.zero:hover{background-color:#620078}.equals:hover{background-color:#e4270f}@font-face{font-family:Roboto;src:local("Roboto"),url(/assets/Roboto-Regular-BHeBnKzs.ttf) format("ttf")}:root{font-family:Roboto,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:300;color:#fffafade;background-color:#000;box-sizing:border-box;margin:0;padding:0}body{height:100vh;display:flex;align-items:center;justify-content:center;background-color:#080807;background-image:linear-gradient(315deg,#080807,#000 74%)}