*,:before,:after{box-sizing:border-box}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--calculator-max-width:450px;--spacing-sm:10px;--spacing-md:20px;--radius-btn:8px;--radius-container:12px;--color-bg:#f4f4f9;--color-text:#333;--color-accent:#007aff;--color-btn-bg:#e0e0e0;--color-btn-border:#ccc;--color-btn-hover-bg:#d0d0d0;--color-btn-pressed-bg:silver;--color-btn-pressed-shadow:#0000001a;--color-operator-bg:#ff9500;--color-operator-hover-bg:#ff7f00;--color-operator-pressed-bg:#e68600;--color-equals-bg:#34c759;--color-equals-hover-bg:#2ca748;--color-equals-pressed-bg:#259b3d;--color-clear-bg:#ff3b30;--color-clear-hover-bg:#e02929;--color-clear-pressed-bg:#c62828;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--color-bg:#1e1e1e;--color-text:#fff;--color-accent:#0a84ff;--color-btn-bg:#333;--color-btn-border:#444;--color-btn-hover-bg:#444;--color-btn-pressed-bg:#2a2a2a;--color-btn-pressed-shadow:#0003;--color-operator-bg:#ff9500;--color-operator-hover-bg:#ff7f00;--color-operator-pressed-bg:#e68600;--color-equals-bg:#30d158;--color-equals-hover-bg:#28a745;--color-equals-pressed-bg:#23933d;--color-clear-bg:#ff453a;--color-clear-hover-bg:#d12d2b;--color-clear-pressed-bg:#b82624}}body{background-color:var(--color-bg);color:var(--color-text);justify-content:center;align-items:center;height:100vh;margin:0;display:flex}.calculator{background-color:var(--color-btn-bg);max-width:var(--calculator-max-width);width:100%;padding:var(--spacing-md);border-radius:var(--radius-container);grid-template-rows:1fr auto;display:grid;box-shadow:0 4px 10px #0003}.calculator-display{background-color:var(--color-bg);color:var(--color-text);text-align:right;padding:var(--spacing-md);width:100%;margin-bottom:var(--spacing-sm);border:none;border-radius:6px;font-size:2rem}.calculator-buttons{gap:var(--spacing-sm);grid-template-columns:repeat(5,1fr);display:grid}button{background-color:var(--color-btn-bg);border:1px solid var(--color-btn-border);padding:15px var(--spacing-sm);border-radius:var(--radius-btn);cursor:pointer;font-size:1.4rem;transition:all .1s;position:relative;top:0;box-shadow:0 2px 4px #0000001a}button:hover{background-color:var(--color-btn-hover-bg)}button:active{background-color:var(--color-btn-pressed-bg);box-shadow:0 1px 2px var(--color-btn-pressed-shadow);top:1px}button.operator{background-color:var(--color-operator-bg)}button.operator:hover{background-color:var(--color-operator-hover-bg)}button.operator:active{background-color:var(--color-operator-pressed-bg)}button.equals{background-color:var(--color-equals-bg)}button.equals:hover{background-color:var(--color-equals-hover-bg)}button.equals:active{background-color:var(--color-equals-pressed-bg)}button.clear{background-color:var(--color-clear-bg)}button.clear:hover{background-color:var(--color-clear-hover-bg)}button.clear:active{background-color:var(--color-clear-pressed-bg)}.button-pressed{background-color:var(--color-btn-pressed-bg)!important;box-shadow:0 1px 2px var(--color-btn-pressed-shadow)!important;top:1px!important}.shortcuts-panel{background-color:var(--color-btn-bg);color:var(--color-text);max-width:var(--calculator-max-width);border-radius:var(--radius-btn);margin-top:30px;padding:0 5px;font-size:.8rem}.shortcuts-panel h3{margin-top:0;margin-bottom:var(--spacing-sm);text-align:center;font-size:1rem}.shortcuts-list{flex-wrap:wrap;justify-content:center;gap:5px;display:flex}.shortcut-item{text-align:center;background-color:#ffffff1a;border-radius:4px;align-items:center;padding:4px;display:flex}.shortcut-item__key{background-color:#fff3;border-radius:3px;padding:1px 6px;font-weight:700}.shortcut-item__description{margin-left:5px;font-size:.75rem}@media (width<=600px){.calculator{width:100%;padding:var(--spacing-sm)}.calculator-display{padding:var(--spacing-sm);font-size:1.5rem}button{padding:15px 6px;font-size:1.5rem}}
