*{box-sizing:border-box;font-family:Arial;}
body{margin:0;background:#f4f7fb;}
header{background:#4f8cff;color:white;text-align:center;padding:20px;}
.hero img{width:100%;max-height:280px;object-fit:cover;}
.container{padding:30px;}
.form{background:white;padding:20px;border-radius:10px;max-width:400px;margin:auto;text-align:center;box-shadow:0 0 10px rgba(0,0,0,.1);}
.form input,select{width:100%;padding:8px;margin:8px 0;}
button{padding:10px 15px;background:#4f8cff;color:white;border:none;border-radius:6px;cursor:pointer;}
.resumen{display:flex;justify-content:center;gap:15px;margin:30px 0;flex-wrap:wrap;}
.box{padding:15px 25px;border-radius:8px;color:white;font-size:18px;}
.ingreso{background:#4caf50;}
.gasto{background:#f44336;}
.balance{background:#2196f3;}
table{width:100%;background:white;border-collapse:collapse;}
th,td{padding:10px;border-bottom:1px solid #ddd;text-align:center;}
footer{text-align:center;padding:15px;background:#ddd;margin-top:30px;}