*{box-sizing:border-box;margin:0;padding:0;font-family:Arial,Helvetica,sans-serif}body{background:#0f172a}.app{background:linear-gradient(135deg,#0f172a,#1e293b,#334155);width:100%;min-height:100vh;padding:30px 15px;position:relative;overflow-x:hidden}.overlay{filter:blur(50px);background:#ffffff0d;border-radius:50%;width:300px;height:300px;position:absolute;top:-100px;left:-100px}.container{z-index:2;max-width:650px;margin:auto;position:relative}.title{text-align:center;color:#fff;margin-bottom:30px;font-size:3rem}.balance-card{text-align:center;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff14;border-radius:25px;margin-bottom:25px;padding:30px;transition:all .4s}.balance-card:hover{transform:translateY(-5px)}.balance-card h1{margin-top:10px;font-size:2.5rem}.summary{grid-template-columns:repeat(2,1fr);gap:20px;margin-bottom:25px;display:grid}.income-box,.expense-box{text-align:center;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff14;border-radius:20px;padding:25px;transition:all .4s}.income-box:hover,.expense-box:hover{transform:scale(1.03)}.income-box p{color:#22c55e;margin-top:10px;font-size:1.5rem}.expense-box p{color:#ef4444;margin-top:10px;font-size:1.5rem}.form{flex-direction:column;gap:15px;margin-bottom:30px;display:flex}.form input{color:#fff;background:#ffffff14;border:none;border-radius:15px;outline:none;padding:15px;font-size:1rem}.form input::placeholder{color:#ccc}.form button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#06b6d4,#0891b2);border:none;border-radius:15px;padding:15px;font-size:1rem;font-weight:700;transition:all .4s}.form button:hover{transform:scale(1.03);box-shadow:0 10px 20px #06b6d466}.transaction-list{flex-direction:column;gap:15px;display:flex}.transaction{color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff14;border-radius:18px;justify-content:space-between;align-items:center;padding:18px;transition:all .4s;display:flex}.transaction:hover{transform:translateY(-5px)}.transaction.plus{border-left:5px solid #22c55e}.transaction.minus{border-left:5px solid #ef4444}.transaction button{color:#fff;cursor:pointer;background:0 0;border:none;font-size:1.1rem}.empty{text-align:center;color:#fff}.spinner{border:8px solid #fff3;border-top-color:#06b6d4;border-radius:50%;width:80px;height:80px;margin:100px auto;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=768px){.title{font-size:2.3rem}.summary{grid-template-columns:1fr}}@media (width<=480px){.title,.balance-card h1{font-size:2rem}.income-box p,.expense-box p{font-size:1.3rem}.transaction{flex-direction:column;align-items:flex-start;gap:10px}}