:root{--primary: #f26522;--primary-hover: #d9541a;--key-bg: #2a2a3e;--key-bg-hover: #3a3a5e;--op-bg: #3a3a5e;--display-bg: #0e0e1a;--display-text: #fff;--muted: #999;--radius: 8px}main{max-width:640px}.tagline{color:var(--muted);margin-top:-.5rem}.calculator{background:var(--display-bg);border-radius:var(--radius);padding:1rem;margin-bottom:2rem}.display{background:var(--display-bg);color:var(--display-text);font-family:Menlo,Consolas,monospace;font-size:2.2rem;text-align:right;padding:1rem;min-height:3.2rem;word-break:break-all;overflow-wrap:anywhere;border-bottom:1px solid #2a2a3e;margin-bottom:.75rem}.calc-error{color:#ff7070;font-size:.9rem;text-align:right;padding:0 1rem .5rem}.keypad{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}.key{background:var(--key-bg);color:#fff;border:none;border-radius:var(--radius);font-size:1.25rem;padding:1rem 0;cursor:pointer;transition:background .12s ease,transform .05s ease;font-family:inherit}.key:hover{background:var(--key-bg-hover)}.key:active{transform:scale(.96)}.key-op{background:var(--op-bg)}.key-fn{background:#444}.key-equals{grid-column:span 1;background:var(--primary)}.key-equals:hover{background:var(--primary-hover)}.key-zero{grid-column:span 1}.history{list-style:none;padding:0;margin:0;border:1px solid #2a2a3e;border-radius:var(--radius)}.history li{padding:.6rem .9rem;border-bottom:1px solid #1f1f33;font-family:Menlo,Consolas,monospace;display:flex;align-items:baseline;gap:.5rem;flex-wrap:wrap}.history li:last-child{border-bottom:none}.history .expr{color:#cfcfcf}.history .eq{color:var(--muted)}.history .result{color:var(--primary);font-weight:600}.history .when{color:var(--muted);font-size:.8rem;margin-left:auto}.history .muted{color:var(--muted);justify-content:center}