:root{--bg:#f5f5fb;--card:#fff;--tx:#1d1b2e;--mut:#8a87a0;--pr:#6d5dfc;--pr2:#ece9ff;--ok:#1fb57a;--bad:#ef4f5f;--warn:#f5a524;--r:20px}
@media(prefers-color-scheme:dark){:root{--bg:#121220;--card:#1d1c2e;--tx:#f1f0f8;--mut:#8f8ca8;--pr2:#2b2850}}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
body{margin:0;font:15px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--tx);padding-bottom:90px}
#app{max-width:560px;margin:auto;padding:16px 16px calc(16px + env(safe-area-inset-bottom))}
h1{font-size:24px;margin:8px 0 16px}h2{font-size:17px;margin:22px 0 10px}
.card{background:var(--card);border-radius:var(--r);padding:16px;box-shadow:0 2px 12px rgba(30,20,90,.06);margin-bottom:12px}
.hero{background:linear-gradient(135deg,#8b7cff,#5a46e8);color:#fff}
.hero .big{font-size:38px;font-weight:800;letter-spacing:-1px}.hero .lbl{opacity:.85;font-size:13px}
.row{display:flex;align-items:center;gap:10px}.sp{flex:1}.mut{color:var(--mut);font-size:13px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.stat .v{font-size:19px;font-weight:700}
.bar{height:8px;background:rgba(127,127,160,.18);border-radius:8px;overflow:hidden;margin-top:6px}.bar i{display:block;height:100%;background:var(--pr);border-radius:8px}
.hero .bar{background:rgba(255,255,255,.25)}.hero .bar i{background:#fff}
.item{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid rgba(127,127,160,.12)}.item:last-child{border:0}
.ico{width:40px;height:40px;border-radius:13px;background:var(--pr2);display:grid;place-items:center;font-size:20px;flex:none}
.amt{font-weight:700;white-space:nowrap}.neg{color:var(--bad)}.pos{color:var(--ok)}
nav{position:fixed;bottom:0;left:0;right:0;background:var(--card);display:flex;justify-content:space-around;align-items:center;padding:8px 6px calc(8px + env(safe-area-inset-bottom));box-shadow:0 -2px 16px rgba(30,20,90,.08);z-index:5}
nav a{display:flex;flex-direction:column;align-items:center;font-size:11px;color:var(--mut);cursor:pointer;min-width:60px}nav a span{font-size:21px}nav a.on{color:var(--pr);font-weight:600}
#fab{width:56px;height:56px;border-radius:50%;border:0;background:var(--pr);color:#fff;font-size:30px;margin-top:-30px;box-shadow:0 6px 18px rgba(109,93,252,.45);cursor:pointer}
button,.btn{font:inherit;border:0;border-radius:14px;padding:12px 16px;background:var(--pr);color:#fff;font-weight:600;cursor:pointer}
.btn2{background:var(--pr2);color:var(--pr)}.btn-s{padding:6px 12px;font-size:13px;border-radius:10px}.danger{background:#fde8ea;color:var(--bad)}
input,select{font:inherit;width:100%;padding:12px 14px;border-radius:14px;border:1.5px solid rgba(127,127,160,.25);background:var(--bg);color:var(--tx);margin:4px 0 10px}
input:focus,select:focus{outline:0;border-color:var(--pr)}label{font-size:13px;color:var(--mut)}
#sheet{position:fixed;inset:0;z-index:10}.sheet-bg{position:absolute;inset:0;background:rgba(10,8,30,.45)}
.sheet-body{position:absolute;bottom:0;left:0;right:0;max-width:560px;margin:auto;background:var(--card);border-radius:24px 24px 0 0;padding:20px 18px calc(20px + env(safe-area-inset-bottom));max-height:90vh;overflow:auto;animation:up .2s}
@keyframes up{from{transform:translateY(40px);opacity:.5}}
.cats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:8px 0 14px}
.cat{background:var(--bg);border-radius:14px;padding:10px 4px;text-align:center;font-size:12px;cursor:pointer;border:2px solid transparent}.cat b{display:block;font-size:24px;font-weight:400}.cat.on{border-color:var(--pr);background:var(--pr2)}
.amount-in{font-size:34px;font-weight:800;text-align:center;border:0;background:transparent}
.tabs{display:flex;background:var(--pr2);border-radius:14px;padding:4px;margin-bottom:14px}.tabs a{flex:1;text-align:center;padding:8px;border-radius:10px;cursor:pointer;color:var(--pr);font-weight:600}.tabs a.on{background:var(--card);box-shadow:0 1px 4px rgba(0,0,0,.08)}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}.cal .h{font-size:11px;color:var(--mut)}
.cal .d{aspect-ratio:1;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:14px;position:relative;cursor:pointer}
.cal .d.t{border:2px solid var(--pr);font-weight:700}.cal .d.has{background:var(--pr2)}.cal .d.sel{background:var(--pr);color:#fff}
.cal .d small{font-size:9px;line-height:1;margin-top:2px;color:var(--pr);font-weight:700}.cal .d.sel small{color:#fff}.cal .d.allp small{color:var(--ok)}
.chip{font-size:11px;padding:3px 8px;border-radius:8px;background:var(--pr2);color:var(--pr);font-weight:600}.chip.ok{background:#dff6ec;color:var(--ok)}.chip.bad{background:#fde8ea;color:var(--bad)}
.chart{display:flex;align-items:flex-end;gap:8px;height:140px;padding-top:10px}.chart div{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;font-size:11px;color:var(--mut)}.chart i{width:100%;background:var(--pr);border-radius:8px 8px 4px 4px;min-height:3px;opacity:.85}.chart div.cur i{opacity:1;background:linear-gradient(#8b7cff,#5a46e8)}
.donut{display:flex;gap:16px;align-items:center}.legend{flex:1;font-size:13px}.legend div{display:flex;gap:6px;align-items:center;margin:3px 0}.legend s{width:10px;height:10px;border-radius:3px;display:inline-block}
#toast{position:fixed;left:50%;bottom:100px;transform:translateX(-50%);background:#1d1b2e;color:#fff;padding:10px 18px;border-radius:12px;opacity:0;transition:.3s;pointer-events:none;z-index:20}#toast.on{opacity:1}
.login{min-height:85vh;display:flex;flex-direction:column;justify-content:center;text-align:center}.login img{width:84px;margin:0 auto 12px}
.mnav{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.mnav a{font-size:22px;padding:4px 12px;cursor:pointer;color:var(--pr)}
.gear{font-size:22px;cursor:pointer;text-decoration:none}.empty{text-align:center;color:var(--mut);padding:18px}
