.calculator_SR7MLk8n{--key-size:4.5em;--key-gap:.75em;--calculator-background:light-dark(var(--surface-raised),oklch(12% .02 var(--hue-navy)));--calculator-border:light-dark(var(--border),transparent);--calculator-text:light-dark(var(--text),#fff);--history-text:light-dark(var(--text-muted),oklch(70% .03 var(--hue-navy)));--digit-background:light-dark(oklch(93% .016 300),oklch(30% .03 var(--hue-navy)));--function-background:light-dark(oklch(85% .035 300),oklch(48% .05 var(--hue-navy)));--operator-background:light-dark(var(--button-background),var(--pink));--operator-text:#fff;--transition-duration:.3s;border:1px solid var(--calculator-border);background:var(--calculator-background);width:fit-content;color:var(--calculator-text);box-shadow:var(--shadow-lg);font-family:var(--font-heading);user-select:none;transition:background var(--transition-duration) ease, color var(--transition-duration) ease;border-radius:2em;margin:0 auto;padding:1.25em;font-size:clamp(.5em,3vw,1em);&:focus-visible{outline:2px solid var(--accent);outline-offset:4px}}.display_SR7MLk8n{text-align:right;align-content:end;min-height:7.5em;padding:0 .5em .5em;display:grid}.history_SR7MLk8n{min-height:1.5em;color:var(--history-text);overflow-wrap:anywhere;margin:0;font-size:1.25em;line-height:1.5}.output-SR7MLk8n{font-variant-numeric:tabular-nums;overflow-wrap:anywhere;font-weight:300;line-height:1.15;display:block;&.large_SR7MLk8n{font-size:3.5em}&.medium_SR7MLk8n{font-size:2.5em}&.small_SR7MLk8n{font-size:1.75em}}.keypad_SR7MLk8n{grid-template-columns:repeat(4, var(--key-size));grid-auto-rows:var(--key-size);gap:var(--key-gap);display:grid}.button-SR7MLk8n{--key-background:var(--digit-background);background:var(--key-background);color:inherit;font:inherit;cursor:pointer;transition:background var(--transition-duration) ease, color var(--transition-duration) ease;border:0;border-radius:50%;place-items:center;padding:0;font-size:1.75em;display:grid;&:hover{background:color-mix(in oklab, var(--key-background), currentColor 12%)}&:active{background:color-mix(in oklab, var(--key-background), currentColor 30%);transition-duration:0s}&:focus-visible{outline:2px solid var(--accent);outline-offset:2px}&.function_SR7MLk8n{--key-background:var(--function-background);font-size:1.5em}&.operator_SR7MLk8n{--key-background:var(--operator-background);color:var(--operator-text);font-size:2em}}.icon_SR7MLk8n{font-size:.6em;.function_SR7MLk8n &{font-size:1.125em}}