:root{--bg: #f0f4ff;--calc-bg: #ffffff;--display-bg: #1a1a2e;--display-text: #ffffff;--num-bg: #f5f7ff;--num-text: #1a1a2e;--num-hover: #e8ecff;--fn-bg: #d6e0ff;--fn-text: #2d3a8c;--fn-hover: #b8c9ff;--op-bg: #6c63ff;--op-text: #ffffff;--op-hover: #5a52e0;--eq-bg: #ff6b6b;--eq-text: #ffffff;--eq-hover: #e85555;--shadow: 0 8px 32px rgba(108, 99, 255, .15), 0 2px 8px rgba(0, 0, 0, .06);--btn-shadow: 0 4px 12px rgba(0, 0, 0, .08);--btn-radius: 18px}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;font-family:SF Pro Display,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.shell{min-height:100vh;display:grid;place-items:center;padding:1.5rem;background:var(--bg);background-image:radial-gradient(circle at 20% 20%,rgba(108,99,255,.12) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(255,107,107,.1) 0%,transparent 50%)}.calculator{width:100%;max-width:380px;background:var(--calc-bg);border-radius:28px;box-shadow:var(--shadow);overflow:hidden;animation:slideUp .5s cubic-bezier(.16,1,.3,1) both}@keyframes slideUp{0%{opacity:0;transform:translateY(30px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.display{background:var(--display-bg);padding:2rem 1.75rem 1.5rem;text-align:right;min-height:110px;display:flex;align-items:flex-end;justify-content:flex-end;position:relative;overflow:hidden}.display:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at 70% 0%,rgba(108,99,255,.2) 0%,transparent 60%),radial-gradient(ellipse at 30% 100%,rgba(255,107,107,.12) 0%,transparent 60%);pointer-events:none}.display-value{font-size:3rem;font-weight:300;color:var(--display-text);letter-spacing:-.02em;position:relative;z-index:1;word-break:break-all;line-height:1.1;transition:transform .15s ease}.buttons{padding:.75rem;display:flex;flex-direction:column;gap:.65rem}.btn-row{display:flex;gap:.65rem}.btn{flex:1;height:68px;border:none;border-radius:var(--btn-radius);font-size:1.35rem;font-weight:500;cursor:pointer;outline:none;position:relative;overflow:hidden;transition:transform .18s cubic-bezier(.34,1.56,.64,1),background .2s ease,box-shadow .2s ease;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.btn:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;opacity:0;background:radial-gradient(circle at center,rgba(255,255,255,.4) 0%,transparent 70%);transition:opacity .4s ease;pointer-events:none}.btn:active:after{opacity:1;transition:opacity .05s ease}.btn.num{background:var(--num-bg);color:var(--num-text);box-shadow:var(--btn-shadow)}.btn.num:hover{background:var(--num-hover);transform:translateY(-1px);box-shadow:0 6px 16px #0000001a}.btn.num:active{transform:translateY(1px) scale(.97);box-shadow:0 2px 6px #00000014}.btn.fn{background:var(--fn-bg);color:var(--fn-text);box-shadow:var(--btn-shadow)}.btn.fn:hover{background:var(--fn-hover);transform:translateY(-1px);box-shadow:0 6px 16px #6c63ff26}.btn.fn:active{transform:translateY(1px) scale(.97);box-shadow:0 2px 6px #00000014}.btn.op{background:var(--op-bg);color:var(--op-text);box-shadow:0 4px 16px #6c63ff4d}.btn.op:hover{background:var(--op-hover);transform:translateY(-1px);box-shadow:0 6px 20px #6c63ff66}.btn.op:active{transform:translateY(1px) scale(.97);box-shadow:0 2px 8px #6c63ff40}.btn.op.active{background:#fff;color:var(--op-bg);box-shadow:0 0 0 3px var(--op-bg),0 4px 16px #6c63ff33;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{box-shadow:0 0 0 3px var(--op-bg),0 4px 16px #6c63ff33}50%{box-shadow:0 0 0 5px #6c63ff66,0 4px 20px #6c63ff4d}}.btn.eq{background:var(--eq-bg);color:var(--eq-text);box-shadow:0 4px 16px #ff6b6b4d}.btn.eq:hover{background:var(--eq-hover);transform:translateY(-1px);box-shadow:0 6px 20px #ff6b6b66}.btn.eq:active{transform:translateY(1px) scale(.97);box-shadow:0 2px 8px #ff6b6b40}.btn.wide{flex:2.32}.btn{animation:btnPop .35s cubic-bezier(.34,1.56,.64,1) both}.btn-row:nth-child(1) .btn:nth-child(1){animation-delay:.06s}.btn-row:nth-child(1) .btn:nth-child(2){animation-delay:.1s}.btn-row:nth-child(1) .btn:nth-child(3){animation-delay:.14s}.btn-row:nth-child(1) .btn:nth-child(4){animation-delay:.18s}.btn-row:nth-child(2) .btn:nth-child(1){animation-delay:.12s}.btn-row:nth-child(2) .btn:nth-child(2){animation-delay:.16s}.btn-row:nth-child(2) .btn:nth-child(3){animation-delay:.2s}.btn-row:nth-child(2) .btn:nth-child(4){animation-delay:.24s}.btn-row:nth-child(3) .btn:nth-child(1){animation-delay:.18s}.btn-row:nth-child(3) .btn:nth-child(2){animation-delay:.22s}.btn-row:nth-child(3) .btn:nth-child(3){animation-delay:.26s}.btn-row:nth-child(3) .btn:nth-child(4){animation-delay:.3s}.btn-row:nth-child(4) .btn:nth-child(1){animation-delay:.24s}.btn-row:nth-child(4) .btn:nth-child(2){animation-delay:.28s}.btn-row:nth-child(4) .btn:nth-child(3){animation-delay:.32s}.btn-row:nth-child(4) .btn:nth-child(4){animation-delay:.36s}.btn-row:nth-child(5) .btn:nth-child(1){animation-delay:.3s}.btn-row:nth-child(5) .btn:nth-child(2){animation-delay:.36s}.btn-row:nth-child(5) .btn:nth-child(3){animation-delay:.42s}@keyframes btnPop{0%{opacity:0;transform:scale(.6) translateY(12px)}to{opacity:1;transform:scale(1) translateY(0)}}.btn:focus-visible{outline:2px solid var(--op-bg);outline-offset:2px}
