:root { --ink:#29263a; --muted:#77738c; --bg:#f6f3ff; --lav:#e5defe; --lav-strong:#8d74d6; --cream:#fff4dc; --mint:#d8f4e5; --peach:#ffe1d1; --card:#fff; --line:#ece8f5; --danger:#bf4a67; --shadow:0 12px 30px rgba(72, 55, 120, .12); }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; background:linear-gradient(160deg,#f7f3ff 0%,#fffaf4 100%); color:var(--ink); font:15px/1.4 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
button,input,select,textarea { font:inherit; }
button { border:0; cursor:pointer; }
.app-shell { width:min(100%,760px); min-height:100vh; margin:0 auto; padding:20px 16px 102px; }
.loading { color:var(--muted); text-align:center; padding:4rem 0; }
.topbar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:4px 2px 20px; }
.eyebrow { color:var(--muted); font-size:.78rem; margin:0 0 2px; }
h1,h2,h3,p { margin-top:0; } h1 { font-size:1.65rem; margin-bottom:0; letter-spacing:-.04em; } h2 { font-size:1.1rem; margin:0; } h3 { font-size:.95rem; }
.icon-button,.nav-button { display:grid; place-items:center; border-radius:50%; background:#fff; color:var(--ink); box-shadow:0 4px 14px rgba(50,35,92,.1); width:42px; height:42px; }
.hero { padding:20px; border-radius:26px; background:linear-gradient(135deg,#9780dd,#bcaaf3); color:white; box-shadow:var(--shadow); position:relative; overflow:hidden; }
.hero:after { content:""; position:absolute; width:150px; height:150px; border-radius:50%; background:rgba(255,255,255,.16); right:-55px; bottom:-80px; }
.hero .amount { font-size:2.25rem; font-weight:760; letter-spacing:-.06em; margin:8px 0; }.hero p { margin-bottom:0; opacity:.9; max-width:300px; }
.metrics,.cards-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:14px 0; }
.metric,.card,.panel { background:var(--card); border-radius:20px; box-shadow:0 5px 18px rgba(60,45,105,.06); }
.metric { padding:14px; }.metric:nth-child(1) { background:var(--mint); }.metric:nth-child(2) { background:var(--cream); }.metric-label { color:#666176; font-size:.78rem; }.metric-value { font-weight:750; font-size:1.1rem; margin-top:5px; }
.section { margin-top:24px; }.section-head { display:flex; align-items:center; justify-content:space-between; margin:0 3px 10px; }.link-button { background:none; color:var(--lav-strong); padding:4px; font-weight:650; }
.card { padding:15px; }.card.pastel-mint{background:var(--mint)}.card.pastel-cream{background:var(--cream)}.card.pastel-peach{background:var(--peach)}.card p{color:var(--muted);margin-bottom:0;font-size:.86rem}.card strong{font-size:1.05rem;display:block;margin-top:5px}
.balance-row,.movement-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 0; border-bottom:1px solid var(--line); }.balance-row:last-child,.movement-row:last-child{border-bottom:0}.balance-label{display:flex;align-items:center;gap:10px}.dot{width:12px;height:12px;border-radius:50%;background:var(--lav-strong)}.dot.mint{background:#75c99c}.dot.peach{background:#eea17d}.subtle{color:var(--muted);font-size:.8rem}.amount-positive{color:#27845d;font-weight:700}.amount-negative{color:var(--danger);font-weight:700}
.fab { position:fixed; z-index:3; bottom:72px; left:50%; transform:translateX(-50%); min-width:176px; padding:14px 20px; border-radius:100px; background:var(--ink); color:#fff; font-weight:700; box-shadow:0 10px 24px rgba(27,24,45,.27); }
.bottom-nav { position:fixed; z-index:2; bottom:14px; left:50%; transform:translateX(-50%); width:min(calc(100% - 28px),500px); padding:8px; display:flex; justify-content:space-around; background:rgba(255,255,255,.92); backdrop-filter:blur(14px); border:1px solid rgba(255,255,255,.8); border-radius:20px; box-shadow:var(--shadow); }.nav-button{box-shadow:none;background:transparent;font-size:.72rem;gap:1px;width:58px;height:48px}.nav-button.active{background:var(--lav);color:#604ca4}
.form-card { background:#fff; padding:22px; border-radius:24px; box-shadow:var(--shadow); }.form-card h1{margin-bottom:6px}.form-card>p{color:var(--muted);margin-bottom:20px}.field{display:grid;gap:6px;margin:13px 0}.field label{font-size:.82rem;font-weight:650}.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:13px;padding:12px;background:#fcfbff;color:var(--ink)}.field textarea{min-height:76px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid #d6caff;border-color:transparent}.primary,.secondary,.danger{width:100%;padding:13px;border-radius:14px;font-weight:700;margin-top:10px}.primary{background:var(--lav-strong);color:#fff}.secondary{background:var(--lav);color:#58439f}.danger{background:#ffe1e8;color:#a43451}.split-row{display:grid;grid-template-columns:1fr .8fr auto;gap:8px;align-items:end;margin:8px 0}.split-row .field{margin:0}.small-button{padding:11px;border-radius:12px;background:#f0edf7;color:#625a77}.notice{border-radius:14px;padding:12px;background:#fff4dc;color:#755c27;font-size:.86rem}.empty{padding:24px 12px;text-align:center;color:var(--muted)}
.sheet { position:fixed;z-index:5;inset:0;background:rgba(34,28,51,.33);display:flex;align-items:end;justify-content:center;padding:0; }.sheet-card{width:min(100%,760px);max-height:92vh;overflow:auto;background:#faf9ff;border-radius:28px 28px 0 0;padding:20px 16px 34px;box-shadow:0 -8px 30px rgba(28,20,55,.2)}.sheet-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.close{background:#f0edf7;border-radius:50%;width:36px;height:36px;font-size:1.2rem}.hidden{display:none!important}.toast{position:fixed;z-index:9;left:50%;bottom:145px;transform:translateX(-50%) translateY(18px);background:#29263a;color:#fff;padding:11px 16px;border-radius:14px;opacity:0;pointer-events:none;transition:.2s;max-width:calc(100% - 32px);text-align:center}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media (min-width:620px){.app-shell{padding-top:38px}.cards-grid{grid-template-columns:repeat(3,1fr)}.sheet{align-items:center;padding:24px}.sheet-card{border-radius:28px;max-width:620px}.fab{bottom:88px}}
