:root{--blue:#075ee8;--ink:#07152f;--muted:#69758a;--bg:#f3f6fb;--card:#fff;--red:#d84040;--green:#14865f}*{box-sizing:border-box}body{margin:0;font:15px system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--ink)}button,input,select{font:inherit}.hidden{display:none!important}.login{min-height:100vh;display:grid;place-content:center;justify-items:center;gap:18px;padding:28px;text-align:center}.login img{width:min(360px,80vw)}.login p{font-size:18px;color:var(--muted)}a{color:var(--blue)}button,.primary{border:0;border-radius:12px;padding:11px 16px;cursor:pointer}.primary{background:var(--blue);color:#fff;text-decoration:none;font-weight:700}.google{font-size:17px}.ghost{background:#e8eef9;color:var(--ink)}.notice{background:#fff0c7;padding:12px;border-radius:10px}header{position:sticky;top:0;z-index:4;display:flex;align-items:center;justify-content:space-between;padding:12px 5vw;background:#fff;border-bottom:1px solid #dce3ee}.brand{display:flex;align-items:center;gap:8px;font-size:20px}.brand img{width:36px;border-radius:10px}.month{display:flex;align-items:center;gap:5px}.month button{font-size:25px;background:transparent}.month strong{min-width:140px;text-align:center}main{max-width:1050px;margin:auto;padding:24px 20px 90px}.page{display:none}.page.active{display:block}.summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.metric,.panel{background:var(--card);border:1px solid #e1e7f0;border-radius:18px;padding:18px;box-shadow:0 7px 24px #1b40700b}.metric span,.muted,small{color:var(--muted)}.metric b{display:block;margin-top:8px;font-size:22px}.panel{margin-top:16px}.panel h2,.title h1{margin:0 0 14px}.title{display:flex;align-items:center;justify-content:space-between}.row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 0;border-bottom:1px solid #edf0f5}.row:last-child{border:0}.row .actions{display:flex;gap:6px}.pill{padding:4px 8px;border-radius:99px;background:#edf2fb;font-size:12px}.paid{color:var(--green)}.over{color:var(--red)}.bar{height:9px;background:#e8edf4;border-radius:99px;overflow:hidden;margin:7px 0}.bar i{display:block;height:100%;background:var(--blue)}.bar.warn i{background:#df9b15}.bar.over i{background:var(--red)}nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;background:#fff;border-top:1px solid #dce3ee;z-index:5}nav button{min-width:90px;background:transparent;padding:15px 10px}nav button.active{color:var(--blue);font-weight:700}.import{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:10px;align-items:end}.import label{display:grid;gap:5px}.form{display:grid;grid-template-columns:1fr 1fr;gap:13px}.form label{display:grid;gap:6px}.form input,.form select,.panel select{width:100%;border:1px solid #cfd8e6;border-radius:10px;padding:11px;background:#fff}.form .wide{grid-column:1/-1}dialog{width:min(620px,94vw);border:0;border-radius:20px;padding:22px}dialog::backdrop{background:#07152f88}#toast{position:fixed;right:20px;bottom:78px;background:#07152f;color:#fff;padding:12px 16px;border-radius:12px;display:none;z-index:9}.cardbox summary{cursor:pointer;font-weight:700;padding:10px 0}@media(max-width:700px){header{padding:9px 12px}.brand b,#syncBtn{display:none}.summary{grid-template-columns:1fr 1fr}.metric b{font-size:18px}.import,.form{grid-template-columns:1fr}.form .wide{grid-column:auto}nav{justify-content:space-around}nav button{min-width:auto;font-size:12px}.month strong{min-width:115px}.row{align-items:flex-start}}