body{margin:0;background:linear-gradient(135deg,#eeebeb,#eef2f7)}.card__block{padding:20px;border-radius:10px;box-shadow:0 4px 12px #00000026;transition:all .3s ease;margin:15px 0}.card__block:hover{transform:translateY(-5px);box-shadow:0 6px 18px #00000040}.balance__block{padding:15px;background:linear-gradient(135deg,#f1c40f26,#f39c1240);border:1px solid rgba(241,196,15,.4);border-radius:10px;color:#f1c40f}p{font-size:1.2rem}h1 i{margin-left:10px;font-size:2.5rem}.profit__block{padding:15px;background:linear-gradient(135deg,#2ecc7126,#27ae6040);border:1px solid rgba(46,204,113,.4);border-radius:10px;color:#2ecc71}.forms__block{background:#ffffff1a;padding:20px;border-radius:10px;box-shadow:0 4px 10px #0000001a;display:flex;flex-direction:column;gap:10px;box-shadow:0 8px 20px #0006;transition:all .3s ease}.forms__block:hover{transform:translateY(-3px);box-shadow:0 12px 25px #0009}input,select{width:100%;padding:10px;border-radius:10px;border:1px solid #cccccc;text-align:center;margin-bottom:15px;box-sizing:border-box;font-size:1.3rem}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none}input:focus,select:focus{border-color:#007bff;outline:none}button{background:#4cafef;padding:10px 15px;border:none;font-size:1.2rem;border-radius:10px;color:#fff;font-weight:700;cursor:pointer;transition:all .3s}button i{margin-right:5px;font-size:1.2rem}button:hover{background:#2196f3}.expense__block{padding:15px;background:linear-gradient(135deg,#e74c3c26,#c0392b40);border:1px solid rgba(231,76,60,.4);border-radius:10px;color:#e74c3c}li{display:flex;align-items:center;gap:15px;margin-top:20px}li i{font-size:2rem}.expense_block{padding:15px;background:linear-gradient(135deg,#c0392b1a,#e74c3c33);border:1px solid rgba(192,57,43,.35);border-radius:10px;color:#c0392b}.expense_block li{font-size:1.3rem}.btn_red{background:#ef6d4c;padding:10px 15px;border:none;font-size:1.3rem;border-radius:10px;color:#fff;font-weight:700;cursor:pointer;transition:.3s}.btn_red i{margin-right:10px;font-size:1.2rem}.btn_red:hover{background:#d53}.btn_red:active{transform:scale(.95)}li{font-size:1.2rem}.list-enter-active,.list-leave-active{transition:all .4s ease}.list-enter-from{opacity:0;transform:translateY(20px)}.list-leave-to{opacity:0;transform:translateY(-20px)}.profit_block{padding:15px;background:linear-gradient(135deg,#27ae601a,#2ecc7133);border:1px solid rgba(39,174,96,.35);border-radius:10px;color:#2ecc71}.profit_block li{font-size:1.2rem}.btn_green{background:#75ef4c;padding:10px 15px;border:none;font-size:1.3rem;border-radius:10px;color:#fff;font-weight:700;cursor:pointer;transition:.3s}.btn_green i{margin-right:10px;font-size:1.2rem}.btn_green:hover{background:#4bc92c}.btn_green:active{transform:scale(.95)}ul{list-style-type:none;padding:0}li{margin-bottom:5px;font-weight:700}.statistics__block{padding:15px;background:linear-gradient(135deg,#3498db26,#2980b940);border:1px solid rgba(46,204,113,.3);border-radius:10px;margin-top:30px;color:#3498db}.statistics__block li{font-size:1.3rem}.categories__block{background:linear-gradient(135deg,#3498db26,#2980b940);padding:15px;border-radius:10px}.category{margin-bottom:15px}.category li{font-size:1.2rem}.category h3{margin:0 0 8px;color:#2980b9}.preloader{position:fixed;top:0;left:0;width:100%;height:100%;background:#ffffffe6;display:flex;justify-content:center;align-items:center}.spinner{width:60px;height:60px;border:8px solid #DDDDDD;border-top:8px solid #3097db;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.wrapper{min-height:100vh;font-family:sans-serif;display:flex;flex-direction:column;gap:20px;padding:20px;box-sizing:border-box;animation:block .5s ease}.title__block{text-align:center}.forms__block,.lists__block{display:flex;margin-bottom:20px;flex-wrap:wrap}.forms__block>.card__block,.lists__block>.card__block{flex:1 1 48%;min-width:280px}@keyframes block{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}@media screen and (max-width: 768px){.forms__block,.lists__block{flex-direction:column}.forms__block>.card__block,.lists__block>.card__block{flex:1 1 100%}h1{font-size:1.5rem;text-align:center}input,select,button{font-size:1rem;padding:8px 12px}li{font-size:1rem}}@media screen and (max-width: 480px){.wrapper{padding:10px}.title__block{font-size:1.8rem}input,select,button{width:100%}li{flex-direction:column;align-items:flex-start;gap:15px}li button{width:100%;text-align:center;font-size:.9rem}}
