:root{--paper:#fffaf2;--paper-shadow:#e8dcc4;--ink:#2b2118;--ink-soft:#6b5d4f;--cream:#fbf3e3;--accent:#3a6df0;--accent-dark:#2650bd;--violet:#7c4dff;--violet-dark:#5a32b8;--income:#2a9d8f;--income-dark:#1f766b;--danger:#d24d3f;--border-soft:#2b21181f;--chip-ink:#2b2118;--font-display:"Baloo 2", "Segoe UI Rounded", sans-serif;--font-mono:"IBM Plex Mono", ui-monospace, monospace;--font-body:"Nunito Sans", "Segoe UI", sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--paper:#2a2420;--paper-shadow:#171310;--ink:#f4ece0;--ink-soft:#cabfae;--cream:#1f1a16;--border-soft:#f4ece024;--income-dark:#4fd6c1;--danger:#ff8a75;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}input,textarea,select,button{font:inherit;color:inherit}html,body{margin:0;padding:0}body{background:var(--cream);color:var(--ink);font-family:var(--font-body);-webkit-tap-highlight-color:transparent;background-image:radial-gradient(circle at 1px 1px,#2b21180d 1px,#0000 0);background-size:22px 22px}#root{justify-content:center;min-height:100dvh;display:flex}@media (prefers-reduced-motion:reduce){*{transition-duration:.001ms!important;animation-duration:.001ms!important}}.app-shell{flex-direction:column;gap:20px;width:100%;max-width:760px;padding:20px 20px 48px;display:flex}.app-header{text-align:center;padding-top:8px;position:relative}.settings-button{background:var(--paper);border:none;border:2px solid var(--border-soft);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;padding:0;font-size:1.1rem;line-height:1;display:flex;position:absolute;top:4px;right:0}.settings-button:active{transform:scale(.94)}.surprise-button{border:1px solid var(--border-soft);background:var(--paper);opacity:.45;cursor:pointer;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;padding:0;font-size:.95rem;line-height:1;transition:opacity .2s;display:flex;position:fixed;bottom:14px;right:14px}.surprise-button:hover,.surprise-button:focus-visible{opacity:.9}.surprise-button:active{transform:scale(.94)}.app-header h1{font-family:var(--font-display);letter-spacing:.01em;margin:0;font-size:clamp(1.9rem,5vw,2.6rem);font-weight:800}.app-subtitle{color:var(--ink-soft);margin:4px 0 0;font-weight:600}.tab-bar{background:var(--paper);border:2px solid var(--border-soft);border-radius:999px;gap:8px;padding:6px;display:flex}.tab-button{font-family:var(--font-display);color:var(--ink-soft);cursor:pointer;background:0 0;border:none;border-radius:999px;flex:1;padding:12px 16px;font-size:1rem;font-weight:600;transition:background .2s,color .2s,transform .15s}.tab-button.is-active{background:var(--violet);color:#fff}.tab-button:active{transform:scale(.97)}.app-main{flex-direction:column;gap:24px;display:flex}.home-banner{object-fit:cover;width:100%;max-height:220px;box-shadow:0 8px 0 var(--paper-shadow), 0 12px 20px #2b21182e;border-radius:18px}.total-card{background:linear-gradient(135deg, var(--accent), var(--violet));color:#fff;box-shadow:0 8px 0 var(--violet-dark), 0 12px 20px #2b211833;border-radius:18px;justify-content:space-between;align-items:center;gap:12px;padding:18px 22px;display:flex}.total-label{font-family:var(--font-display);font-size:1rem;font-weight:700}.total-value{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:1.6rem;font-weight:700}.envelope-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;display:grid}.envelope-card{background:var(--paper);box-shadow:0 10px 0 var(--paper-shadow), 0 14px 24px #2b21182e;opacity:0;animation:.55s cubic-bezier(.22,1,.36,1) both card-in;animation-delay:var(--stagger-delay,0s);border-radius:18px;position:relative;overflow:hidden}@keyframes card-in{0%{opacity:0;transform:translateY(18px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.envelope-flap{background:var(--envelope-color);clip-path:polygon(0 0,100% 0,50% 100%);height:68px;position:absolute;inset:0 0 auto}.envelope-body{text-align:center;padding:72px 18px 22px;position:relative}.envelope-emoji{filter:drop-shadow(0 2px 2px #00000026);font-size:1.8rem;display:block}.envelope-name{font-family:var(--font-display);margin:8px 0 4px;font-size:1.05rem;font-weight:700}.envelope-balance{font-family:var(--font-mono);font-variant-numeric:tabular-nums;margin:0;font-size:1.5rem;font-weight:600}.cta-row{flex-wrap:wrap;gap:14px;display:flex}.btn{font-family:var(--font-display);cursor:pointer;border:none;border-radius:14px;padding:14px 20px;font-size:1rem;font-weight:700;transition:transform .12s,box-shadow .12s}.btn:active{transform:translateY(2px)}.btn-big{flex:1;min-width:220px;padding:18px 20px;font-size:1.1rem}.btn-primary{background:var(--accent);color:#fff;box-shadow:0 5px 0 var(--accent-dark)}.btn-primary:active{box-shadow:0 2px 0 var(--accent-dark)}.btn-primary:disabled{box-shadow:none;cursor:not-allowed;background:#aab8dd}.btn-secondary{background:var(--violet);color:#fff;box-shadow:0 5px 0 var(--violet-dark)}.btn-secondary:active{box-shadow:0 2px 0 var(--violet-dark)}.btn-ghost{color:var(--ink-soft);border:2px solid var(--border-soft);background:0 0}.modal-backdrop{z-index:20;background:#140f0a73;justify-content:center;align-items:flex-end;animation:.2s both fade-in;display:flex;position:fixed;inset:0}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.modal-sheet{background:var(--paper);border-radius:22px 22px 0 0;width:100%;max-width:560px;max-height:90dvh;padding:22px 20px 28px;animation:.28s cubic-bezier(.22,1,.36,1) both sheet-in;overflow-y:auto}@media (width>=640px){.modal-backdrop{align-items:center}.modal-sheet{border-radius:22px}}@keyframes sheet-in{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}.modal-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.modal-header h2{font-family:var(--font-display);margin:0;font-size:1.3rem}.modal-close{background:var(--border-soft);cursor:pointer;width:36px;height:36px;color:var(--ink);border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:1rem;line-height:1;display:flex}.app-form{flex-direction:column;gap:16px;display:flex}.field{color:var(--ink-soft);flex-direction:column;gap:6px;font-weight:600;display:flex}.field input{font-family:var(--font-body);border:2px solid var(--border-soft);background:var(--cream);color:var(--ink);border-radius:12px;padding:12px 14px;font-size:1.05rem}.field input:focus{outline:2px solid var(--accent);outline-offset:1px}.form-hint{color:var(--ink-soft);margin:0;font-size:.95rem;font-weight:700}.envelope-amount-list{flex-direction:column;gap:10px;display:flex}.envelope-amount-row{background:var(--cream);border:2px solid var(--envelope-color);border-radius:14px;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;display:flex}.envelope-amount-label{font-size:.95rem;font-weight:700}.amount-input-wrap{background:var(--paper);border:2px solid var(--border-soft);border-radius:10px;align-items:center;gap:6px;padding:6px 10px;display:flex}.amount-input-wrap input{width:90px;font-family:var(--font-mono);text-align:right;color:var(--ink);background:0 0;border:none;padding:4px 0;font-size:1.05rem}.amount-input-wrap input:focus{outline:none}.amount-suffix{font-family:var(--font-mono);color:var(--ink-soft)}.envelope-pill-list{flex-wrap:wrap;gap:10px;display:flex}.envelope-pill{border:2px solid var(--envelope-color);background:var(--cream);color:var(--ink);font-weight:700;font-family:var(--font-display);cursor:pointer;border-radius:999px;padding:10px 16px}.envelope-pill.is-selected{background:var(--envelope-color);color:#fff}.form-total{margin:0;font-weight:700}.form-total strong{font-family:var(--font-mono)}.form-total.is-negative strong{color:var(--danger)}.form-actions{justify-content:flex-end;gap:10px;margin-top:6px;display:flex}.empty-state{text-align:center;color:var(--ink-soft);padding:40px 20px;font-weight:600}.history-list{flex-direction:column;gap:12px;margin:0;padding:0;list-style:none;display:flex}.history-item{background:var(--paper);box-shadow:0 6px 0 var(--paper-shadow), 0 8px 16px #2b21181f;border-radius:14px;align-items:stretch;display:flex;overflow:hidden}.history-item-edge{background:var(--ink-soft);flex-shrink:0;width:6px}.history-item-edge.is-positive{background:var(--income)}.history-item-edge.is-negative{background:var(--danger)}.history-item-main{flex-direction:column;flex:1;gap:6px;min-width:0;padding:14px 16px;display:flex}.history-item-top{justify-content:space-between;align-items:baseline;gap:10px;display:flex}.history-date{color:var(--ink-soft);font-size:.85rem;font-weight:600}.history-amount{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:1.1rem;font-weight:700}.history-amount.is-positive{color:var(--income-dark)}.history-amount.is-negative{color:var(--danger)}.history-title{margin:0;font-weight:700}.history-breakdown{flex-wrap:wrap;gap:8px;display:flex}.history-breakdown-chip,.history-envelope-tag{font-family:var(--font-mono);color:var(--chip-ink);background:var(--envelope-color-soft,var(--paper));border:1px solid var(--envelope-color);border-radius:999px;padding:3px 10px;font-size:.85rem;font-weight:600}.history-actions{flex-shrink:0;align-items:center;display:flex}.history-action{color:var(--ink-soft);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;width:48px;height:48px;display:flex}.history-action svg{width:24px;height:24px}.history-action:hover{color:var(--violet)}.history-action:last-child:hover{color:var(--danger)}