:root{font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color:#203b34;background:#f4f6f2;font-synthesis:none}*{box-sizing:border-box}body{margin:0}main{max-width:720px;margin:auto;padding:24px 18px 180px}header{display:flex;align-items:center;justify-content:space-between;gap:12px}h1{font-size:25px;margin:5px 0 22px;letter-spacing:.04em}small,.hint,.footnote{color:#64766d;font-size:12px}#status{font-size:11px;white-space:nowrap}button,input,select,textarea{font:inherit}button{cursor:pointer;border:1px solid #d9e1da;background:white;color:inherit;border-radius:12px;min-height:46px;padding:10px 14px}button:disabled{opacity:.5;cursor:wait}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #d59136;outline-offset:2px}input,select,textarea{border:1px solid #cbd6cd;border-radius:10px;padding:12px;width:100%;background:#fff;color:#203b34;min-height:46px}input[type=checkbox]{width:24px;min-height:24px;accent-color:#146653}.monthbar{display:flex;justify-content:center;gap:16px;margin:0 0 20px}.monthbar input{background:transparent;border:0;font-weight:700;text-align:center}.hero{padding:24px;border-radius:22px;background:#146653;color:white}.hero .amount{font-size:clamp(30px,8vw,44px);font-weight:750;margin:8px 0;overflow-wrap:anywhere}.hero p{font-size:12px;margin:8px 0;opacity:.85}.subbalance{border-top:1px solid #ffffff40;margin-top:14px;padding-top:14px;display:flex;justify-content:space-between;gap:8px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0 26px}.metric{background:#fff;border-radius:14px;padding:14px 10px;min-width:0}.metric span{display:block;font-size:11px;color:#65776e}.metric strong{display:block;font-size:clamp(13px,3.5vw,18px);margin-top:6px;overflow-wrap:anywhere}h2{font-size:19px}h3{font-size:16px;margin:0}.sectionhead{display:flex;align-items:center;justify-content:space-between}.card{background:#fff;border:1px solid #e0e6df;border-radius:16px;padding:16px;margin-bottom:10px}.row{display:flex;align-items:center;justify-content:space-between;gap:12px}.row>div{min-width:0}.name{font-weight:700;overflow-wrap:anywhere}.meta{font-size:12px;color:#687970;margin-top:6px;overflow-wrap:anywhere}.money{white-space:nowrap;font-weight:700}.actions{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}.actions button{font-size:13px;flex:1}.paid{background:#e4f2e8;border-color:#badbc5;color:#236446}.overdue{color:#ae492c}.empty{padding:38px 20px;text-align:center;background:#eaf0e9;border-radius:18px;line-height:1.9;color:#627568}.primary,.add{background:#146653;color:#fff;border:0;font-weight:700}.add{position:fixed;bottom:calc(82px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(90%,680px);box-shadow:0 5px 20px #163f3425;min-height:52px}nav{position:fixed;bottom:0;left:0;right:0;background:#fffffff5;border-top:1px solid #dce5dc;display:flex;justify-content:center;padding:8px 8px calc(8px + env(safe-area-inset-bottom));gap:4px}nav button{border:0;background:transparent;font-size:13px;max-width:170px;flex:1;padding:10px 4px}nav button.active{background:#e5efe7;color:#146653;font-weight:750}label{display:block;margin:14px 0;font-size:14px}label input,label select,label textarea{margin-top:7px}.check{display:flex;align-items:center;gap:10px}.check input{margin:0}dialog{border:0;border-radius:22px;padding:22px;width:min(94vw,500px);max-height:90dvh;color:inherit}dialog::backdrop{background:#102d2466}.dialoghead{display:flex;justify-content:space-between;align-items:center}form>.primary{width:100%;margin-top:12px}.hint{line-height:1.7}.footnote{text-align:center;margin-top:28px}.negative{color:#ffd9aa}#toast{position:fixed;left:50%;transform:translateX(-50%);bottom:155px;background:#263f36;color:#fff;padding:12px 18px;border-radius:12px;max-width:90vw;z-index:5;display:none}.settings button{width:100%;margin:5px 0}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}[hidden]{display:none!important}@media(min-width:700px){main{padding-top:40px}.hero{padding:30px}.metrics{gap:12px}}

.monthbar{align-items:center}.monthbar label{margin:0}.monthbar button{min-width:46px}.actions button{flex:1 1 calc(50% - 8px)}

.header-tools{display:flex;flex-direction:column;align-items:flex-end;gap:2px;flex-shrink:0}#qrButton{min-width:44px;min-height:44px;padding:8px;color:#65776e;background:transparent;border:0;font-size:12px}#qrButton:hover{background:#e5efe7}#qrGraphic{text-align:center;margin:16px 0}#qrGraphic canvas{display:block;margin:auto;width:280px;max-width:100%;height:auto;image-rendering:pixelated}#qrUrl{font-size:13px}#qrNote{font-size:13px;line-height:1.8}