body { font-family: 'Poppins', sans-serif; background: #f0f4f8; color: #333; margin:0; padding:0; }
h1, h2 { text-align: center; }
.container { max-width: 900px; margin: 20px auto; padding: 20px; background: #fff; border-radius: 12px; box-shadow: 0 4px 10px rgba(0,0,0,0.1); }
form { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; }
form input, form select, form button { padding: 10px; font-size: 1rem; border-radius: 6px; border: 1px solid #ccc; }
form button { background: #007bff; color: #fff; border: none; cursor: pointer; flex: 1; }
form button:hover { background: #0056b3; }
table { width: 100%; border-collapse: collapse; margin-bottom: 20px; }
table th, table td { padding: 12px; text-align: center; border-bottom: 1px solid #ddd; }
table th { background: #007bff; color: #fff; }
.balance, .top-expenses { text-align: center; font-size: 1.2rem; margin-bottom: 20px; }
.filter-group { display: flex; gap: 10px; margin-bottom: 20px; justify-content: center; }
.filter-group select { padding: 8px; font-size: 1rem; border-radius: 6px; border: 1px solid #ccc; }
canvas { margin-bottom: 30px; background:#fff; border-radius:10px; padding:10px; box-shadow: 0 2px 8px rgba(0,0,0,0.1);}
button.action-btn { padding:5px 8px; border:none; border-radius:5px; cursor:pointer; margin:0 2px; }
button.edit { background:#28a745; color:#fff; }
button.delete { background:#dc3545; color:#fff; }