html,body{height:100%;overflow-y:auto;scroll-behavior:smooth}body{background:linear-gradient(180deg,#f7f9fa,#eef4f1);color:#222;font-family:Roboto,system-ui,-apple-system,Segoe UI,Arial,sans-serif}.container{min-height:100vh;max-width:900px;margin:0 auto;padding:24px 16px;display:flex;flex-direction:column;justify-content:flex-start}.header{text-align:center;margin-bottom:16px}.title{display:inline-flex;align-items:center;justify-content:center;gap:12px;font-size:2rem;font-weight:700;margin:.5rem 0 .25rem;color:#256c28}.subtitle{font-weight:500;color:#2f7d4e;margin:0}#recycleIcon{width:40px;height:40px;animation:in 4s linear 0s infinite normal}@keyframes in{0%{transform:rotate(0)}to{transform:rotate(360deg)}}#intro,#main,#totals-weekly,#totals-yearly,#totals-reset{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000a;padding:16px;margin:16px 0;transition:all .25s ease-in-out}#intro:hover,#main:hover,#totals-weekly:hover,#totals-yearly:hover,#totals-reset:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000014}h3{color:#256c28;font-size:1.3rem;margin-bottom:.75rem;text-align:center}h4{color:#2f7d4e;font-size:1.1rem;margin-bottom:.5rem;text-align:center}#intro{text-align:center}#totals-weekly p,#totals-yearly p,#totals-reset p{font-size:1rem;text-align:center;margin:.25rem 0}button{background-color:#1faa59;color:#fff;border:none;border-radius:6px;padding:.5rem 1rem;margin:.25rem;font-size:1rem;cursor:pointer;transition:all .2s ease-in-out;box-shadow:0 2px 5px #00000014}button:hover{background-color:#178f4d;transform:translateY(-1px) scale(1.03)}button:active{transform:scale(.97);box-shadow:0 1px 3px #0000001f}#targetButton{display:block;margin:0 auto 12px;padding:.5rem 1rem;background-color:#1faa59;color:#fff;border:none;border-radius:6px;font-size:1rem;cursor:pointer;transition:all .2s ease-in-out;box-shadow:0 2px 5px #00000014}#targetButton:hover{background-color:#178f4d;transform:translateY(-1px) scale(1.03)}#targetButton:active{transform:scale(.97);box-shadow:0 1px 3px #0000001f}#main #targetButton{align-self:center;margin-bottom:12px}#totals-reset,#main{display:flex;flex-direction:column;align-items:center}#totals-reset .button-row,#main .button-row{display:flex;justify-content:center;gap:12px;width:100%;margin-top:8px}#totals-reset button,#main button{flex:1 1 auto;width:45%;min-width:120px;max-width:200px;margin:0}#totals-group{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px}#totals-weekly,#totals-yearly,#totals-reset{flex:1 1 30%;min-width:250px}@media(max-width:800px){#totals-weekly,#totals-yearly,#totals-reset{flex:1 1 100%}}#main{gap:.75rem}#main label{font-weight:500;color:#0a5c2c}#main input[type=number],#main input[type=text],#main select{display:inline-block;width:100%;box-sizing:border-box;height:40px;padding:.5rem;font-size:1rem;border:1px solid #bbb;border-radius:6px;background-color:#fafafa;transition:all .2s ease-in-out}#main input:focus,#main select:focus{border-color:#1faa59;box-shadow:0 0 4px #1987544d;outline:none}#main input::placeholder{color:#999}.input-row{display:flex;flex-direction:row;justify-content:space-between;align-items:flex-start;gap:16px}.input-group{display:flex;flex-direction:column;flex:1}.chart-container{width:160px;height:160px;margin:0 auto 12px;position:relative}.chart-container canvas{width:100%!important;height:100%!important}.chart-center-label .profit{color:#1faa59}.chart-center-label .loss{color:#dc3545}@media(max-width:600px){h3{font-size:1.1rem}button{font-size:.9rem;padding:.4rem .8rem}}@media(max-width:400px){.container{padding:16px 10px}}