@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap";body{height:100vh;background-color:#f8e9dd}*{box-sizing:border-box;margin:0;overflow:hidden;font-size:18px;font-family:Inter,sans-serif}.background{background-color:#f8e9dd}.home{display:flex;flex-direction:column;justify-content:center;align-items:center}.balance{display:flex;justify-content:space-between;background-color:#ec775f;max-height:6em;width:93%;border-radius:5px;margin-top:3em;margin-bottom:1em;padding:1.5em}.balance h2{color:#f8e9dd;font-weight:400;font-size:.7rem}.balance span{color:#f8e9dd;font-weight:700;line-height:2.1em;font-size:1.2rem}.bar-chart{display:flex;justify-content:space-between;align-items:flex-end;height:17em;padding-top:3em;gap:10px}.bar-chart-bar{display:flex;flex-direction:column;align-items:center;transform:rotate(180deg);height:15em}.bar-chart-label{margin-top:.312em;font-size:.7rem;transform:rotate(180deg);padding-top:.8em;font-weight:400;color:#93867b}.bar-chart-amount{margin-top:.9em;font-size:.3rem;transform:rotate(180deg);padding:.9em;font-weight:400;color:#fff;background-color:#000;width:100%;border-radius:3px;display:none}.bar-chart-progress{width:4.5em;border-radius:5px;background-color:#ec775f;transition:background-color .3s ease}.bar-chart-progress:hover{background-color:#f7c5bb}.bar-chart-progress.max-value{background-color:#58b5e4;transition:background-color .3s ease}.bar-chart-progress.max-value:hover{background-color:#b0dcf2}.spending-card{background-color:#fffaf5;text-align:center;border-radius:7px;max-width:93%;padding:1em}.spending-card h2{font-weight:700;font-size:1.4rem}.horizontal-line{height:2px;background-color:#f8e9dd;margin:.8em 0}.spending-total{display:flex;justify-content:space-between}.spending-total span{font-size:.6rem;font-weight:400;color:#93867b}.spending-this-month h2{line-height:1.6em;font-size:1.6rem}.spending-last-month{margin-top:1.5em}@media (min-width: 500px){.bar-chart-amount{font-size:.5rem;display:none}}@media (min-width: 800px){.balance,.spending-card{width:30%}.bar-chart{height:13em;padding-top:2em}.bar-chart-bar{height:11em}.bar-chart-label{padding-top:.5em}.bar-chart-progress{width:3em;border-radius:7px}.balance{padding:.7em}.balance h2{font-size:.8rem}.balance span{font-size:1rem}.spending-this-month h2{line-height:1.5em;font-size:1.2rem}.spending-last-month{margin-top:1em}}
