@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#173c35;--muted:#6d7d77;--green:#248268;--line:#e0e7df}*{box-sizing:border-box}body{margin:0;background:#f6f8f3;color:var(--ink);font-family:'DM Sans',sans-serif;font-size:14px}header{height:88px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:32px;padding:0 max(5%,calc((100vw - 1180px)/2));background:#fff}.brand{font:800 25px Manrope,sans-serif;text-decoration:none;color:var(--ink);white-space:nowrap;display:flex;align-items:center}.dot{color:#3c9c78}.logo{display:grid;place-items:center;width:37px;height:37px;border-radius:12px;background:var(--ink);color:#c6e9a7;margin-right:10px;font-size:28px}.header-note{color:var(--muted);font-size:13px}.free{margin-left:auto;font-size:10px;letter-spacing:1.2px;color:var(--green);background:#eff6ec;padding:9px 12px;border-radius:30px}main{max-width:1180px;margin:auto;padding:48px 0 20px}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:38px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:var(--green)}h1{font:800 48px/1.15 Manrope,sans-serif;letter-spacing:-2px;margin:13px 0 18px}h1 em{font-style:normal;color:var(--green)}.intro p{color:var(--muted);font-size:15px;line-height:1.7}.note{display:flex;align-items:center;gap:18px;margin-right:45px;transform:rotate(-3deg)}.note>span{font-size:46px;color:#80a26a}.note p{font-size:14px}.note strong{color:var(--ink);font-weight:500}.workspace{display:grid;grid-template-columns:340px 1fr;gap:24px}.panel{background:white;border:1px solid var(--line);border-radius:18px;padding:26px}.setup{align-self:start}.section-title{display:flex;align-items:center;gap:11px;margin-bottom:25px}.number{font-size:11px;color:#748b7d;background:#f1f5ee;border:1px solid #e0e7dc;border-radius:50%;width:27px;height:27px;display:grid;place-items:center;flex-shrink:0}h2{font:700 16px Manrope,sans-serif;margin:0;letter-spacing:-.3px}label{display:block;font-size:12px;font-weight:600;margin-bottom:8px}.hint{color:var(--muted);font-size:12px;line-height:1.6;margin:8px 0 16px}.money{display:flex;align-items:center;gap:12px;border:1px solid #c7d7ca;border-radius:10px;padding:0 15px;background:#fafcf8}.money span{color:#789080;font-size:17px}.money input{border:0;background:none;padding:14px 0;font-size:27px;font-weight:600;width:100%;min-width:0}.divider{height:1px;background:var(--line);margin:25px 0}input{font-family:inherit;border:1px solid #dfe6dd;border-radius:8px;background:#fff;color:var(--ink);padding:11px 12px;width:100%;font-size:14px}input:focus{outline:2px solid #70ad94;outline-offset:2px}input:invalid{border-color:#c47758}button{cursor:pointer;font-family:inherit}button:focus-visible,a:focus-visible{outline:3px solid #70ad94;outline-offset:3px}.presets{display:flex;gap:10px;margin-top:12px}.presets button{flex:1;background:white;border:1px solid var(--line);border-radius:9px;padding:12px;font-weight:600;color:var(--ink)}.presets button.active{background:#edf5e9;border-color:#90b99c}.presets small{display:block;font-size:10px;font-weight:400;margin-top:5px;color:var(--muted)}.percent-row{display:flex;justify-content:space-between;align-items:center;margin:13px 0}.percent-row label{margin:0;display:flex;gap:8px;align-items:center}.percent-row>div{display:flex;align-items:center;gap:5px;color:var(--muted);font-size:12px}.percent-row input{width:62px;padding:7px}i{width:8px;height:8px;border-radius:50%;display:inline-block}.green{background:#338b70}.blue{background:#789bb5}.gold{background:#d2af67}.tip{background:#f6f8f2;border-radius:10px;padding:14px;color:#72806b;font-size:12px;line-height:1.7;margin-top:20px}.text-button{border:0;background:none;color:var(--green);font-size:12px;padding:20px 0 0}.results{min-width:0}.overview{background:#153e35;color:white;border-radius:18px;padding:26px;margin-bottom:22px}.overview .number{background:#2c5147;border-color:#416154;color:#b4ceb9}.tag{margin-left:auto;font-size:9px;letter-spacing:1.2px;color:#aac6b3}.allocation{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.allocation article{padding:0 15px;border-left:1px solid #426256}.allocation article:first-child{padding-left:0;border:0}.allocation .pct{font-size:11px;color:#bbcebf;display:block;margin-bottom:9px}.allocation strong{font:700 25px Manrope,sans-serif;letter-spacing:-1px;display:block;overflow-wrap:anywhere}.allocation h3{font-size:12px;font-weight:500;margin:10px 0 5px}.allocation p{font-size:10px;color:#b5c9bc;line-height:1.5;margin:0}.allocation article:nth-child(1) strong{color:#9ed7b0}.allocation article:nth-child(2) strong{color:#b6d0e1}.allocation article:nth-child(3) strong{color:#edce8d}.distribution{display:flex;gap:4px;height:7px;margin-top:26px}.distribution span{border-radius:5px;transition:width .2s}#bar0{background:#84c69b}#bar1{background:#aac9dd}#bar2{background:#e5c177}.overview>.hint{color:#b5c9bc;margin:11px 0 0}.reality .section-title{margin-bottom:8px}.expense-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:20px}.expense-grid label{font-size:11px}.insight{background:#f0f6eb;border:1px solid #e0ecd8;border-radius:8px;padding:13px 16px;font-size:12px;line-height:1.6;margin:18px 0}.insight.warning{background:#fff5e9;border-color:#efdbc1;color:#8a5b2e}.mini-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}.mini-stats span{display:block;color:var(--muted);font-size:11px;margin-bottom:7px}.mini-stats strong{font:700 20px Manrope,sans-serif}.footnote{font-size:10px;line-height:1.5;color:var(--muted);margin-bottom:0}.goal{display:grid;grid-template-columns:1fr 1.1fr;gap:50px;margin-top:24px;padding:30px;background:#eef3e7}.goal h2{font-size:24px;margin:12px 0}.goal-symbol{font-size:35px;color:#67916b}.goal-inputs{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}.goal-form .hint{margin:13px 0 10px}.progress{height:7px;background:#dae4d1;border-radius:5px;overflow:hidden}.progress div{background:var(--green);height:100%;width:0}#goal-result{font-size:13px;font-weight:500;line-height:1.6}footer{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;color:var(--muted);font-size:11px;margin:25px 0}footer button{color:var(--muted);background:none;border:0;text-decoration:underline;font-size:11px}footer p{width:100%;text-align:center;font-size:10px;padding-top:22px} @media(max-width:1240px){main{margin:0 5%}}@media(max-width:850px){.workspace{grid-template-columns:290px 1fr;gap:15px}.panel,.overview{padding:20px}.expense-grid{grid-template-columns:1fr 1fr}.tag{display:none}.allocation{gap:8px}.allocation strong{font-size:20px}.allocation article{padding:0 8px}.note{margin:0}.header-note{display:none}}@media(max-width:650px){header{height:72px;padding:0 5%;gap:10px}.brand{font-size:22px}.free{font-size:8px;padding:8px}.intro{margin-bottom:24px}.intro .note{display:none}main{padding-top:32px}h1{font-size:37px}.intro p{font-size:13px}.workspace{grid-template-columns:1fr}.goal{grid-template-columns:1fr;gap:12px}.goal-symbol{display:none}.allocation strong{font-size:21px}.allocation p{font-size:9px}.goal h2{font-size:21px}.desktop{display:none}.setup{padding:22px}.overview{margin-top:5px}.section-title{margin-bottom:20px}footer{line-height:1.7;gap:10px}}@media print{header,.setup,footer button,#example{display:none}.workspace{display:block}.panel,.overview{break-inside:avoid}.overview{print-color-adjust:exact}.goal{break-inside:avoid}main{margin:0}}

.backup{margin-top:24px}.backup-actions{display:flex;gap:12px;flex-wrap:wrap}.backup-actions button{min-height:44px;padding:12px 18px;border:1px solid #9abaad;border-radius:8px;background:#edf5e9;color:#173c35;font-weight:600}.backup input[hidden]{display:none}input[aria-invalid="true"]{border-color:#aa4c32}@media(max-width:650px){.expense-grid input,.goal input{font-size:16px}.backup-actions button{width:100%}}