.sticky-balance-panel{position:sticky;top:30vh;margin-left:-5rem;margin-right:auto;background:linear-gradient(135deg,#667eea26,#764ba226);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:2rem;border:2px solid rgba(255,255,255,.1);box-shadow:0 10px 40px #0000004d;height:fit-content;min-width:350px;max-width:350px}.balance-display{margin-bottom:1.5rem}.balance-label{font-size:.9rem;opacity:.6;margin-bottom:.5rem;text-transform:uppercase;letter-spacing:1px}.balance-amount{font-size:3rem;font-weight:800;font-variant-numeric:tabular-nums;transition:color .4s ease-out,text-shadow .4s ease-out;text-shadow:0 0 8px rgba(255,255,255,.2);will-change:color}.balance-amount.positive{color:#4299e1}.balance-amount.negative{color:#f56565}.balance-amount.warning{color:#ed8936}.balance-amount.decreasing{animation:flashRed 1.2s ease-out}.balance-amount.increasing{animation:flashGreen 1.2s ease-out}.balance-amount.decreasing.negative,.balance-amount.decreasing.warning,.balance-amount.decreasing{animation:flashRed 1.2s ease-out}.balance-amount.increasing.positive,.balance-amount.increasing.warning,.balance-amount.increasing{animation:flashGreen 1.2s ease-out}@keyframes flashRed{0%{color:#f56565;text-shadow:0 0 25px #f56565;transform:scale(1.02)}50%{color:#f56565;text-shadow:0 0 30px #f56565;transform:scale(1.02)}to{transform:scale(1)}}@keyframes flashGreen{0%{color:#48bb78;text-shadow:0 0 25px #48bb78;transform:scale(1.02)}50%{color:#48bb78;text-shadow:0 0 30px #48bb78;transform:scale(1.02)}to{transform:scale(1)}}.balance-bar-container{width:100%;height:8px;background:#ffffff1a;border-radius:10px;overflow:hidden;margin-bottom:1.5rem}.balance-bar-fill{height:100%;background:linear-gradient(90deg,#48bb78,#38a169);border-radius:10px;transition:width 1s cubic-bezier(.4,0,.2,1);box-shadow:0 0 10px #48bb7880}.month-progress{padding-top:1rem;border-top:1px solid rgba(255,255,255,.1)}.progress-label{font-size:.9rem;opacity:.6;margin-bottom:.5rem;text-transform:uppercase;letter-spacing:1px}.progress-value{font-size:1.2rem;font-weight:600}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:512px){.sticky-balance-panel{position:sticky;top:0;margin:0 .75rem 1.5rem;max-width:100%;margin-left:auto;margin-right:auto;min-width:auto;width:calc(100% - 1.5rem);z-index:100;padding:1.25rem}.balance-label{font-size:.75rem;margin-bottom:.3rem}.balance-amount{font-size:2rem}.progress-label{font-size:.75rem;margin-bottom:.3rem}.progress-value{font-size:1rem}.balance-bar-container{height:6px;margin-bottom:1rem}.month-progress{padding-top:.75rem}}
