*{margin:0;padding:0;box-sizing:border-box;font-size:62.5%;font-family:"Didact Gothic",sans-serif}.theme-light{background-color:#bdbdbd}.theme-light .head h3,.theme-light .head h5{color:#343428}.theme-light .head .theme-container .bar{background-color:#d3cdcd}.theme-light .head .theme-container .bar div{background-color:#ff8a38}.theme-light .mid h2{background-color:#eee;color:#343428}.theme-light .down{background-color:#d3cdcd}.theme-light .down .number-btn{background-color:#fff;color:#343428;border:none;border-bottom:5px solid rgba(0,0,0,.431372549)}.theme-light .down .reset-btn,.theme-light .down .del-btn{background-color:#62b5bd;color:#fff}.theme-light .down .result-btn{background-color:#ff8a38;color:#fff}@media screen and (min-width: 767px){.theme-light{background-color:#39a6d1}.theme-light .main{border:3px solid #fff;background-color:#acacac}}.theme-dark{background-color:#3b4664}.theme-dark .head h3,.theme-dark .head h5{color:#fdffff}.theme-dark .head .theme-container .bar{background-color:#252d44}.theme-dark .head .theme-container .bar div{background-color:#f96c5b}.theme-dark .mid h2{background-color:#181f32;color:#fdffff}.theme-dark .down{background-color:#252d44}.theme-dark .down .number-btn{background-color:#eae3db;color:#343428;border:none;border-bottom:5px solid rgba(0,0,0,.431372549)}.theme-dark .down .reset-btn,.theme-dark .down .del-btn{background-color:#a2b3e1;color:#fdffff}.theme-dark .down .result-btn{background-color:#f96c5b;color:#fdffff}@media screen and (min-width: 767px){.theme-dark{background-color:#111}.theme-dark .main{border:3px solid #fff;background-color:#000}}.theme-custom{background-color:#17062a}.theme-custom .head h3,.theme-custom .head h5{color:#fde52a}.theme-custom .head .theme-container .bar{background-color:#1f0836}.theme-custom .head .theme-container .bar div{background-color:#94fff9}.theme-custom .mid h2{background-color:#1e0836;color:#fde52a}.theme-custom .down{background-color:#1f0836}.theme-custom .down .number-btn{background-color:#331b4d;color:#ffed41;border:none;border-bottom:5px solid #b040e7}.theme-custom .down .reset-btn,.theme-custom .down .del-btn{background-color:#8631b0;color:#fff}.theme-custom .down .result-btn{background-color:#94fff9;color:#000}@media screen and (min-width: 767px){.theme-custom{background-color:#de98e7}.theme-custom .main{border:3px solid #ffed41;background-color:#5e0075}}body{width:100%;height:100vh;display:flex;align-items:center;justify-content:center}@media screen and (min-width: 767px){body .main{max-width:400px;max-height:600px;border-radius:12px}body .main .mid h2{max-width:350px}}.main{width:100%;height:100vh;display:grid;grid-template-areas:"head   head" "input input" "btns   btns";grid-template-rows:7% 16% auto;padding:24px;row-gap:30px}.main .head{grid-area:head;display:flex;width:100%;align-items:center;justify-content:space-between}.main .head h3{font-size:2.5rem;font-weight:bold}.main .head .container{display:flex;align-items:center;gap:20px}.main .head .container h5{align-self:flex-end;margin-bottom:4px;font-size:1.2rem;letter-spacing:1px}.main .head .container .theme-container{display:flex;flex-direction:column;align-items:center;gap:4px}.main .head .container .theme-container span{display:flex;gap:20px}.main .head .container .theme-container span h5{cursor:pointer;font-size:1.2rem}.main .head .container .theme-container .bar{position:relative;width:70px;height:24px;border-radius:18px;padding:4px}.main .head .container .theme-container .bar div{position:absolute;width:16px;height:16px;border-radius:50%;left:4px}.main .mid{grid-area:input;width:100%;height:100%}.main .mid h2{display:flex;justify-content:flex-end;align-items:center;width:100%;max-width:310px;height:100%;border:none;padding:24px;font-size:5.5rem;font-weight:bold;border-radius:8px;overflow:hidden}.main .down{grid-area:btns;display:grid;grid-template-columns:23.5% 23.5% 23.5% 23.5%;grid-template-rows:18.4% 18.4% 18.4% 18.4% 18.4%;row-gap:2%;column-gap:2%;grid-template-areas:"7   8   9  di" "4   5   6  ad" "1   2   3  su" "po  0 div mul" "re re ig ig";padding:24px;border-radius:8px}.main .down .number-btn{width:92%;height:92%;font-size:2.5rem;font-weight:bold;border-radius:12px}.main .down .del-btn{font-size:1.8rem}.main .down .result-btn{grid-area:ig}.main .down .reset-btn{grid-area:re;font-size:2rem}/*# sourceMappingURL=main.css.map */