:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,*:before,*:after{transition:background-color .3s ease,border-color .3s ease,box-shadow .3s ease}button,a,.MuiButton-root,.MuiIconButton-root{transition:background-color .2s ease,border-color .2s ease,box-shadow .2s ease,transform .15s ease,color .2s ease}body,p,span,h1,h2,h3,h4,h5,h6,.MuiTypography-root{transition:color .3s ease,background-color .3s ease}a{font-weight:500;color:#646cff;text-decoration:inherit;transition:color .2s ease}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh;transition:background-color .3s ease,color .3s ease}h1{font-size:3.2em;line-height:1.1}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:none}.calculator-container{max-width:1200px;width:100%}.MuiPaper-root,.MuiCard-root,.MuiAppBar-root,.MuiDrawer-paper{transition:background-color .3s ease,box-shadow .3s ease}.MuiInputBase-root,.MuiOutlinedInput-root,.MuiFilledInput-root{transition:background-color .3s ease,border-color .3s ease}.MuiListItemButton-root{transition:background-color .2s ease}.MuiTabs-indicator{transition:all .3s cubic-bezier(.4,0,.2,1)}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.calculator{width:400px;max-width:90%;margin:0 auto;flex-direction:column;padding-top:25px;padding-bottom:25px}.calculator button{width:75px;border-radius:8px;border:1px solid transparent;padding:1.2em .1em;font-size:.9em;font-weight:700;font-family:inherit;cursor:pointer;transition:border-color .25s}.theme-1{--main-bg: hsl(0, 0%, 90%);--toggle-bg: hsl(0, 5%, 81%);--screen-bg: hsl(0, 0%, 93%);--key-bg: hsl(185, 42%, 37%);--key-shadow: hsl(185, 58%, 25%);--key-bg-light: hsl(45, 7%, 89%);--key-shadow-light: hsl(35, 11%, 61%);--key-bg-red: hsl(25, 98%, 40%);--key-shadow-red: hsl(25, 99%, 27%);--text-dark: hsl(60, 10%, 19%);--text-light: hsl(0, 0%, 100%)}.theme-2{--main-bg: hsl(230, 9%, 25%);--toggle-bg: hsl(223, 31%, 20%);--screen-bg: hsl(224, 36%, 15%);--key-bg: hsl(225, 21%, 49%);--key-shadow: hsl(224, 28%, 35%);--key-bg-light: hsl(30, 25%, 89%);--key-shadow-light: hsl(28, 16%, 65%);--key-bg-red: hsl(25, 98%, 40%);--key-shadow-red: hsl(25, 99%, 27%);--text-dark: hsl(221, 14%, 31%);--text-light: hsl(0, 0%, 100%);--color: hsl(0, 0%, 100%)}.calculator__wrapper{background-color:var(--main-bg);color:var(--color);transition:background-color .4s;max-width:400px;margin:20px auto;border-radius:10px;box-shadow:0 2px 8px #0000004d}.calculator__header{display:flex;justify-content:space-between;align-items:center}.calculator__display{background-color:var(--screen-bg);padding:1.5rem;border-radius:8px;text-align:right;font-size:2rem;overflow:hidden;transition:background-color .4s,color .4s}.calculator__expression{font-size:1rem}.calculator__current-value{font-size:2rem}.calculator__keys{background-color:var(--toggle-bg);padding:1rem;margin-top:1.5rem;border-radius:8px;display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;transition:background-color .4s}.key{border:none;border-radius:5px;font-size:1.25rem;font-weight:700;cursor:pointer;box-shadow:0 3px var(--key-shadow);transition:all .2s ease;color:var(--text-dark)}.key:hover{opacity:.8}.key--del,.key--reset{background-color:var(--key-bg);box-shadow:0 3px var(--key-shadow);color:var(--text-light);font-size:1.1rem}.key--equals{grid-column:span 2;background-color:var(--key-bg-red);box-shadow:0 3px var(--key-shadow-red);color:var(--text-light);font-size:1.1rem}.key--light{background-color:var(--key-bg-light);box-shadow:0 3px var(--key-shadow-light);color:var(--text-dark)}@media (max-width: 600px){.calculator__wrapper{width:340px}.calculator{margin:0 auto;width:100%}.calculator button{width:65px}.calculator__display{font-size:1.5rem;padding:1rem}.calculator__keys{padding:1rem;gap:.3rem}.key{font-size:1rem;padding:.5rem}}
