:root{--teal:#149b92;--teal2:#39b9ae;--mint:#e8faf6;--ink:#222;--muted:#758080;--bg:#f4f7f7;--red:#d45c69}*{box-sizing:border-box}body{margin:0;background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink)}#app{max-width:620px;margin:auto;min-height:100vh;padding-bottom:88px}header{background:linear-gradient(155deg,var(--teal),var(--teal2));color:white;padding:calc(20px + env(safe-area-inset-top)) 20px 22px;border-radius:0 0 28px 28px}.top{display:flex;justify-content:space-between;align-items:center}.top small{opacity:.9}.top h1{font-size:42px;margin:4px 0 0}.plus{border:0;background:#ffffff22;color:#fff;width:46px;height:46px;border-radius:50%;font-size:28px}.tabs{display:flex;gap:7px;overflow:auto;margin:22px 0 18px}.tabs button,.toggle button{border:0;background:transparent;padding:9px 13px;border-radius:12px;color:inherit}.tabs .active{background:#ffffff22}.summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.summary div{background:#ffffff18;padding:12px;border-radius:14px}.summary span{display:block;font-size:11px;opacity:.85}.summary b{font-size:15px}main{padding:16px}.card{background:white;border-radius:22px;padding:18px;margin-bottom:16px;box-shadow:0 3px 16px #173b3a0b}.hero h2,.sectionTitle h2{margin:2px 0 12px}.hero small{color:var(--muted)}.toggle{display:flex;background:#eef4f3;border-radius:12px;padding:4px;margin-bottom:18px}.toggle button{flex:1;color:#536160}.toggle .on{background:white;color:var(--teal);box-shadow:0 2px 8px #0000000c}.category{margin:15px 0}.catTop{display:flex;justify-content:space-between;margin-bottom:7px}.bar{height:9px;background:#e9eeee;border-radius:10px;overflow:hidden}.bar i{display:block;height:100%;background:var(--teal);border-radius:10px}.bar i.over{background:var(--red)}.sectionTitle{display:flex;justify-content:space-between;align-items:center}.sectionTitle button{border:0;background:var(--mint);color:var(--teal);padding:8px 11px;border-radius:10px}.row{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid #edf0f0}.row:last-child{border:0}.icon{width:40px;height:40px;background:var(--mint);display:grid;place-items:center;border-radius:50%;color:var(--teal)}.grow{flex:1}.grow b,.grow small{display:block}.grow small{color:var(--muted);margin-top:3px}.amt{font-weight:650}.status{font-size:11px;padding:5px 8px;border-radius:9px;background:#fff5dd;color:#9b7115}.paid{background:#e9f9ef;color:#267747}nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(620px,100%);display:flex;background:white;border-top:1px solid #e5e9e9;padding:8px 6px calc(8px + env(safe-area-inset-bottom));z-index:4}nav button{flex:1;border:0;background:none;color:#7b8585;font-size:20px}nav button span{display:block;font-size:10px;margin-top:4px}nav .active{color:var(--teal)}dialog{border:0;border-radius:22px;width:min(92vw,460px);padding:22px}dialog::backdrop{background:#0006}dialog h2{margin-top:0}label{display:block;font-size:13px;color:#566;margin:12px 0}input,select{width:100%;padding:13px;border:1px solid #dfe5e4;border-radius:12px;margin-top:6px;font:inherit}.actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.actions button{border:0;padding:11px 16px;border-radius:12px}.primary{background:var(--teal)!important;color:white}.paybox{padding:14px;background:#f3faf8;border-radius:15px;margin:10px 0}.paybox h3{margin:0 0 4px}.paybox small{color:var(--muted)}@media(min-width:700px){body{padding:20px}#app{border-radius:28px;overflow:hidden;box-shadow:0 20px 60px #0002}nav{bottom:20px}}
.page{display:none}.page.active{display:block}.spendingTotal,.bigMetric{padding:14px 0 8px}.spendingTotal span,.bigMetric span{display:block;color:var(--muted);font-size:13px}.spendingTotal strong,.bigMetric strong{display:block;font-size:34px;margin-top:3px}.accountCard{display:flex;justify-content:space-between;align-items:center;background:#f3faf8;border-radius:16px;padding:16px;margin:14px 0}.accountCard small{display:block;color:var(--muted);margin-top:3px}.infoBox{background:#f5f7f7;border-radius:14px;padding:14px;color:#667;font-size:13px;line-height:1.4}.nwList{margin:12px 0}.nwList div{display:flex;justify-content:space-between;padding:15px 0;border-bottom:1px solid #edf0f0}.wideButton{width:100%;border:0;background:var(--mint);color:var(--teal);padding:13px;border-radius:12px;font-weight:650}.moreList{display:grid}.moreList button{display:flex;justify-content:space-between;align-items:center;border:0;border-bottom:1px solid #edf0f0;background:white;padding:17px 4px;text-align:left;font:inherit}.moreList button:last-child{border-bottom:0}.moreList b{font-size:24px;color:#899}.clickable{cursor:pointer}.static{cursor:default}.empty{color:var(--muted);padding:20px 0;text-align:center}.danger{color:var(--red)!important}
.monthNav{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:8px}.card.compact{padding:8px 12px}.monthNav button{border:0;background:var(--mint);color:var(--teal);border-radius:12px;font-size:28px;height:42px}.monthNav button:disabled{opacity:.35}.monthNav input{margin:0;text-align:center;border:0;background:transparent;font-weight:650}.accountGroup h3{font-size:14px;color:var(--muted);margin:20px 0 6px;text-transform:uppercase;letter-spacing:.04em}.wideDialog{width:min(96vw,640px);max-height:88vh;overflow:auto}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.editHeader{display:flex;justify-content:space-between;align-items:center;margin:18px 0 8px}.editHeader button{border:0;background:var(--mint);color:var(--teal);padding:8px 10px;border-radius:10px}.budgetEditLabels,.budgetEditRow{display:grid;grid-template-columns:1.5fr .8fr .8fr .8fr 34px;gap:6px;align-items:center}.budgetEditLabels{font-size:11px;color:var(--muted);padding:0 4px}.budgetEditRow input{min-width:0;padding:9px;margin:5px 0}.deleteMini{border:0;background:#fff0f1;color:var(--red);border-radius:10px;width:32px;height:32px}.checkLabel{display:flex;align-items:center;gap:9px}.checkLabel input{width:auto;margin:0}.splitActions{display:grid;grid-template-columns:auto 1fr auto auto}.dangerButton{background:#fff0f1!important;color:var(--red)}.stickyActions{position:sticky;bottom:-22px;background:white;padding:12px 0 2px}.moreList button,.accountCard{touch-action:manipulation}@media(max-width:520px){.budgetEditLabels{display:none}.budgetEditRow{grid-template-columns:1fr 1fr 1fr}.budgetEditRow .catName{grid-column:1/4}.budgetEditRow .deleteMini{grid-column:3;grid-row:1;justify-self:end}.wideDialog{padding:16px}.grid2{grid-template-columns:1fr}.grid2>span{display:none}}
