@property --calc-a{syntax:"<color>";inherits:true;initial-value:#fafbfd}@property --calc-b{syntax:"<color>";inherits:true;initial-value:#e9ebf2}@property --surf-a{syntax:"<color>";inherits:true;initial-value:#fbfcfe}@property --surf-b{syntax:"<color>";inherits:true;initial-value:#eceef5}@property --disp-a{syntax:"<color>";inherits:true;initial-value:#eceef5}@property --disp-b{syntax:"<color>";inherits:true;initial-value:#f8f9fc}:root{--bg-base:#eef0f6;--shadow-dark:#a3acc48c;--shadow-light:#fffffff2;--calc-a:#fafbfd;--calc-b:#e9ebf2;--calc-inset-hi:#ffffffe6;--calc-inset-lo:#bec5d740;--surf-a:#fbfcfe;--surf-b:#eceef5;--disp-a:#eceef5;--disp-b:#f8f9fc;--disp-inset-dark:#a3acc473;--disp-inset-light:#fffffff2;--text:#5b6275;--text-toggle:#7a86a6;--text-operator:#8a97b8;--text-ac:#d27a82;--icon-border:#a9b3cc;--glow-light-opacity:1;--glow-dark-opacity:0;--theme-duration:.45s}body.theme-pro{--bg-base:#1b1d23;--shadow-dark:#000000a6;--shadow-light:#ffffff0b;--calc-a:#15171b;--calc-b:#0e1013;--calc-inset-hi:#ffffff0d;--calc-inset-lo:#00000080;--surf-a:#20232a;--surf-b:#16181d;--disp-a:#0b0c0f;--disp-b:#15171c;--disp-inset-dark:#000000bf;--disp-inset-light:#ffffff0f;--text:#c3c8d4;--text-toggle:#a4adc2;--text-operator:#8fa3d6;--text-ac:#cf7a82;--icon-border:#5d6579;--glow-light-opacity:0;--glow-dark-opacity:1}*,:before,:after{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background-color:var(--bg-base);min-height:100vh;color:var(--text);transition:background-color var(--theme-duration) ease, color var(--theme-duration) ease;font-family:Segoe UI,system-ui,-apple-system,sans-serif}body:before,body:after{content:"";z-index:-1;pointer-events:none;transition:opacity var(--theme-duration) ease;position:fixed;inset:0}body:before{opacity:var(--glow-light-opacity);background-image:radial-gradient(circle at 15% 20%,#82aaff59 0,#0000 45%),radial-gradient(circle at 85% 85%,#ff96c84d 0,#0000 45%)}body:after{opacity:var(--glow-dark-opacity);background-image:radial-gradient(circle at 15% 20%,#506eff33 0,#0000 45%),radial-gradient(circle at 85% 85%,#965aff2e 0,#0000 45%)}.app{flex-direction:column;justify-content:center;align-items:center;gap:28px;min-height:100vh;padding:24px 16px;display:flex}.settings{flex-direction:column;align-items:center;gap:12px;display:flex}.mode-toggle{background:linear-gradient(145deg, var(--surf-a), var(--surf-b));width:190px;height:44px;box-shadow:8px 8px 16px var(--shadow-dark), -8px -8px 16px var(--shadow-light);color:var(--text-toggle);font:inherit;cursor:pointer;transition:color var(--theme-duration) ease, box-shadow var(--theme-duration) ease, --surf-a var(--theme-duration) ease, --surf-b var(--theme-duration) ease;border:0;border-radius:22px;justify-content:space-between;align-items:center;padding:0 8px 0 22px;display:flex}.mode-toggle__label{letter-spacing:.08em;font-size:12px;font-weight:600}.mode-toggle__knob{background:linear-gradient(145deg,#6f9bf5,#4f7fe0);border-radius:50%;width:28px;height:28px;box-shadow:3px 4px 8px #4f7fe073}.calculator{background:linear-gradient(145deg, var(--calc-a), var(--calc-b));width:100%;max-width:280px;box-shadow:20px 24px 48px var(--shadow-dark), -16px -16px 40px var(--shadow-light), inset 2px 2px 4px var(--calc-inset-hi), inset -2px -2px 6px var(--calc-inset-lo);transition:box-shadow var(--theme-duration) ease, --calc-a var(--theme-duration) ease, --calc-b var(--theme-duration) ease;border-radius:44px;padding:28px 24px}.keypad{grid-template-columns:repeat(4,48px);justify-content:space-between;row-gap:16px;margin-top:24px;display:grid}.keypad__row{display:contents}.keypad__row[hidden]{display:none}.btn{height:48px;font:inherit;cursor:pointer;margin:0;padding:0}.btn--number,.btn--function,.btn--operator,.btn--equals{background:linear-gradient(145deg, var(--surf-a), var(--surf-b));width:48px;color:var(--text);box-shadow:6px 6px 12px var(--shadow-dark), -6px -6px 12px var(--shadow-light);transition:color var(--theme-duration) ease, box-shadow var(--theme-duration) ease, --surf-a var(--theme-duration) ease, --surf-b var(--theme-duration) ease;border:0;border-radius:50%;justify-self:center;font-size:18px;font-weight:500}.btn--wide{border-radius:24px;grid-column:span 2;width:100%}.btn--function[data-action=clear]{color:var(--text-ac)}.btn--operator{color:var(--text-operator);font-size:22px}.btn--equals{color:#fff;box-shadow:6px 8px 16px #4f7fe073, -4px -4px 10px var(--shadow-light);background:linear-gradient(145deg,#6f9bf5,#4f7fe0);font-size:22px}.display{background:linear-gradient(145deg, var(--disp-a), var(--disp-b));width:224px;max-width:100%;height:96px;box-shadow:inset 5px 5px 10px var(--disp-inset-dark), inset -5px -5px 10px var(--disp-inset-light);transition:box-shadow var(--theme-duration) ease, --disp-a var(--theme-duration) ease, --disp-b var(--theme-duration) ease;border-radius:22px;justify-content:space-between;align-items:center;gap:12px;margin:0 auto;padding:0 18px 0 20px;display:flex;position:relative}.display__expression{white-space:nowrap;scrollbar-width:none;color:var(--text-operator);transition:color var(--theme-duration) ease;font-size:13px;line-height:16px;position:absolute;top:10px;left:20px;right:18px;overflow-x:auto}.display__expression::-webkit-scrollbar{display:none}.display__value{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--text);transition:color var(--theme-duration) ease;flex:1;font-size:32px;font-weight:500;line-height:1;overflow:hidden}.display__icon{border:2px solid var(--icon-border);width:20px;height:20px;transition:border-color var(--theme-duration) ease;border-radius:6px;flex:none}
