:root{--yellow:#ffd400;--ink:#111;--paper:#fff;--tomato:#ff4d2e;--mint:#3ddc97;--lilac:#b8a6ff;--bg:#f7f2e2;--fg:var(--ink);--accent:var(--ink);--font:"Bricolage Grotesque Variable";--muted:#55524a;--hair:#11111124;--up:#0b7a45;--bw:2.5px;--line:var(--bw) solid var(--ink);--sh:5px 5px 0 var(--ink);--sh-sm:3px 3px 0 var(--ink);--r:18px;--r-btn:10px;--ease:cubic-bezier(.16, 1, .3, 1);--spring:cubic-bezier(.34, 1.56, .64, 1);--col:440px;--side:300px;--gap:40px;--c-bills:#111;--c-japan:#ff4d2e;--c-rainy:#b8a6ff;--c-home:#3ddc97;--c-spend:#ffd400}body.app{grid-template-columns:minmax(0, var(--col));letter-spacing:-.005em;background:radial-gradient(#11111121 1.1px, transparent 1.4px) 0 0 / 22px 22px, var(--bg);justify-content:center;min-height:100vh;font-size:15px;display:grid}h1,h2{letter-spacing:-.04em;margin:0;font-weight:800}::selection{background:var(--ink);color:var(--yellow)}:focus-visible{outline:3px solid var(--ink);outline-offset:3px;border-radius:10px}.muted{color:var(--muted)}.small{font-size:13px;line-height:1.45}.up{color:var(--up)}.label{letter-spacing:-.01em;margin:0;font-size:14px;font-weight:700}.big{letter-spacing:-.05em;font-variant-numeric:tabular-nums;margin:2px 0 0;font-size:34px;font-weight:800;line-height:1.05}.brand{letter-spacing:-.06em;align-items:center;gap:9px;font-size:27px;font-weight:800;line-height:1;display:inline-flex}.brand span{margin-top:-3px}.avatar{border:2px solid var(--ink);background:var(--lilac);border-radius:12px;flex:none;place-items:center;width:40px;height:40px;font-size:14px;font-weight:800;display:grid}.btn{border:var(--line);border-radius:var(--r-btn);background:var(--paper);height:48px;color:var(--ink);box-shadow:var(--sh-sm);letter-spacing:-.015em;white-space:nowrap;transition:transform .16s var(--ease), box-shadow .16s var(--ease), background .2s, opacity .2s;justify-content:center;align-items:center;gap:8px;padding:0 18px;font-size:15px;font-weight:700;display:inline-flex}.btn:hover{box-shadow:5px 5px 0 var(--ink);transform:translate(-1px,-1px)}.btn:active{box-shadow:0 0 0 var(--ink);transition-duration:50ms;transform:translate(3px,3px)}.btn:disabled{opacity:.45;box-shadow:none;cursor:not-allowed;transform:none}.btn--yellow{background:var(--yellow)}.btn--tomato{background:var(--tomato)}.btn--white{background:var(--paper)}.btn--wide{width:100%}.btn--sm{height:38px;padding:0 13px;font-size:14px}.row{flex-wrap:wrap;gap:10px;display:flex}.row.end{justify-content:flex-end;margin-top:18px}.main{min-width:0;min-height:100vh;flex-direction:column;gap:16px;min-height:100dvh;padding:16px 16px 0;display:flex}.top{padding-top:4px;display:grid}.top__bar{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.top h1{letter-spacing:-.055em;font-size:clamp(34px,9.6vw,44px);line-height:.95}.top__sub{color:var(--muted);margin:8px 0 0;font-size:15px;font-weight:500}.top__sub:empty{display:none}.top__actions{gap:12px;margin-top:16px;display:flex}.top__actions .btn{flex:1}.demo{border:2px dashed var(--ink);background:var(--paper);border-radius:12px;align-items:center;gap:10px;margin:0;padding:8px 12px 8px 8px;font-size:13px;line-height:1.35;display:flex}.demo b{border:2px solid var(--ink);background:var(--tomato);border-radius:7px;flex:none;padding:1px 8px 3px;font-size:13px;font-weight:800;rotate:-3deg}.view{animation:rise .45s var(--ease);gap:16px;display:grid}@keyframes rise{0%{opacity:0;transform:translateY(10px)}}.block{background:var(--paper);border:var(--line);border-radius:var(--r);min-width:0;box-shadow:var(--sh);padding:18px;position:relative}.block--yellow{background:var(--yellow)}.block--mint{background:var(--mint)}.block--lilac{background:var(--lilac)}.block--tomato{background:var(--tomato)}.block__head,.group__head{justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px;display:flex}.block__head h2,.group__head h2{letter-spacing:-.04em;font-size:21px;line-height:1.1}.more{text-underline-offset:3px;flex:none;font-size:14px;font-weight:700;text-decoration:underline;text-decoration-thickness:2px}.chip{border:2px solid var(--ink);white-space:nowrap;border-radius:7px;padding:1px 8px 3px;font-size:12.5px;font-weight:800;display:inline-block}.chip--ok{background:var(--mint)}.chip--gold{background:var(--yellow)}.safe__value{letter-spacing:-.065em;font-variant-numeric:tabular-nums;margin:4px 0 0;font-size:clamp(52px,15vw,66px);font-weight:800;line-height:.95}.safe__sub{margin:8px 0 0;font-size:14px;font-weight:500;line-height:1.4}.split{border:var(--line);background:var(--paper);border-radius:10px;height:24px;margin-top:18px;display:flex;overflow:hidden}.split i{min-width:0;height:100%;transition:flex-grow .6s var(--ease);display:block}.split i+i{border-left:2px solid var(--ink)}.split--tall{border-radius:12px;height:50px}.legend{font-variant-numeric:tabular-nums;flex-wrap:wrap;gap:6px 14px;margin:12px 0 0;padding:0;font-size:13px;font-weight:600;list-style:none;display:flex}.legend li{align-items:center;gap:6px;display:inline-flex}.legend i,.breakdown i{border:2px solid var(--ink);border-radius:4px;flex:none;width:13px;height:13px}.breakdown{gap:8px;margin:16px 0 0;padding:0;list-style:none;display:grid}.breakdown li{grid-template-columns:13px 1fr auto;align-items:center;gap:10px;font-size:15px;font-weight:600;display:grid}.breakdown b{font-variant-numeric:tabular-nums;font-weight:800}.pair{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;display:grid}.pair .block{padding:14px 14px 16px}.payday{flex-direction:column;align-items:flex-start;display:flex}.ring{width:92px;height:92px;margin:10px 0;position:relative}.ring svg{width:100%;height:100%;overflow:visible;transform:rotate(-90deg)}.ring circle{fill:none;stroke-width:13px}.ring__bg{stroke:var(--paper)}.ring__fg{stroke:var(--ink);stroke-dasharray:326.7;transition:stroke-dashoffset 1s var(--ease)}.ring__mid{text-align:center;place-content:center;line-height:1;display:grid;position:absolute;inset:0}.ring__mid b{letter-spacing:-.05em;font-size:30px;font-weight:800}.ring__mid span{font-size:12px;font-weight:600}.payday__when{letter-spacing:-.02em;margin:0;font-size:16px;font-weight:800}.payday .small{margin:2px 0 0}.totals .big{white-space:nowrap;font-size:clamp(22px,6.4vw,28px)}.totals dl{margin:12px 0 0;display:grid}.totals dl div{border-top:2px solid var(--ink);justify-content:space-between;gap:8px;padding:7px 0 6px;font-size:13px;display:flex}.totals dt{font-weight:500}.totals dd{font-variant-numeric:tabular-nums;margin:0;font-weight:800}.group{gap:4px;display:grid}.group__head{padding:0 2px}.jars{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin:0;padding:0;list-style:none;display:grid}.jar{background:var(--c);border:var(--line);border-radius:var(--r);min-width:0;box-shadow:var(--sh);flex-direction:column;padding:14px 14px 15px;display:flex}.jar:last-child:nth-child(odd){grid-column:1/-1}.jar__top{justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:10px;display:flex}.jar .pct{letter-spacing:-.06em;font-size:38px;font-weight:800;line-height:.9}.jar svg{flex:none;width:44px;height:60px}.jar b{letter-spacing:-.025em;font-size:16px;font-weight:800;line-height:1.2}.jar>span{font-variant-numeric:tabular-nums;font-size:13px;font-weight:500}.rows{margin:0;padding:0;list-style:none}.rows li{grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 0;display:grid}.rows li+li{border-top:1.5px solid var(--hair)}.rows .ico{border:2px solid var(--ink);background:var(--paper);border-radius:11px;place-items:center;width:40px;height:40px;font-size:15px;font-weight:800;display:grid}.rows .ico--in{background:var(--mint)}.rows .ico--gold{background:var(--yellow)}.rows .ico--date{background:var(--paper);place-content:center;gap:0;line-height:1}.rows .ico--date b{letter-spacing:-.03em;font-size:16px;font-weight:800}.rows .ico--date small{font-size:10.5px;font-weight:700}.rows .what{min-width:0}.rows .what b{letter-spacing:-.01em;font-weight:700;display:block}.rows .what small{color:var(--muted);font-size:12.5px;line-height:1.35;display:block}.rows .amt{letter-spacing:-.015em;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap;font-weight:800}.rows .amt.up{color:var(--up)}.rows--bills .amt{justify-items:end;gap:4px;display:grid}.rows--grouped .day{letter-spacing:-.02em;padding:16px 0 4px;font-size:15px;font-weight:800;display:block;border:0!important}.rows--grouped .day:first-child{padding-top:0}.rows--grouped .day+li{border-top:0}.rule-list{counter-reset:r;gap:10px;margin:14px 0 0;padding:0;list-style:none;display:grid}.rule-item{border:2px solid var(--ink);background:var(--paper);counter-increment:r;border-radius:14px;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:2px 12px;padding:12px 14px;display:grid}.rule-item:before{content:counter(r);border:2px solid var(--ink);background:var(--c,var(--paper));border-radius:9px;place-items:center;width:30px;height:30px;font-size:14px;font-weight:800;display:grid}.rule-item[data-key=bills]:before{color:var(--paper)}.rule-item b{letter-spacing:-.02em;font-weight:800}.rule-item .amt{font-variant-numeric:tabular-nums;font-weight:800}.rule-item small{color:var(--muted);grid-column:2/-1;font-size:13px}.rule-item small b{color:var(--ink)}.rule-item input{grid-column:2/-1}input[type=range]{appearance:none;cursor:pointer;background:0 0;width:100%;height:28px}input[type=range]::-webkit-slider-runnable-track{border:2px solid var(--ink);background:linear-gradient(90deg, var(--c,var(--ink)) var(--p,50%), var(--paper) var(--p,50%));border-radius:99px;height:10px}input[type=range]::-moz-range-track{border:2px solid var(--ink);background:var(--paper);border-radius:99px;height:10px}input[type=range]::-moz-range-progress{background:var(--c,var(--ink));border-radius:99px;height:10px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;border:var(--line);background:var(--paper);width:24px;height:24px;box-shadow:2px 2px 0 var(--ink);border-radius:7px;margin-top:-9px}input[type=range]::-moz-range-thumb{border:var(--line);background:var(--paper);width:19px;height:19px;box-shadow:2px 2px 0 var(--ink);border-radius:7px}input[type=range]:active::-webkit-slider-thumb{box-shadow:none;transform:translate(1px,1px)}.goal-cards{gap:16px;margin:0;padding:0;list-style:none;display:grid}.goal-card{grid-template-columns:92px minmax(0,1fr);align-items:start;gap:16px;display:grid}.goal-card__art{background:var(--c);border:2px solid var(--ink);border-radius:14px;place-items:center;height:124px;display:grid}.goal-card svg{width:62px;height:86px}.goal-card h2{letter-spacing:-.04em;font-size:21px;line-height:1.05}.goal-card .nums{font-variant-numeric:tabular-nums;margin:6px 0 0;font-size:14px}.goal-card .nums b{letter-spacing:-.05em;font-size:28px;font-weight:800}.goal-card .bar{border:2px solid var(--ink);background:var(--paper);border-radius:99px;height:14px;margin:10px 0 8px;overflow:hidden}.goal-card .bar i{background:var(--c);transform-origin:0;height:100%;transition:transform .8s var(--ease);display:block}.goal-card .meta{color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:2px 8px;font-size:13px;display:flex}.goal-card .row{margin-top:14px}.vault .small{margin:8px 0 0}.meter{border:var(--line);background:var(--paper);border-radius:99px;height:20px;margin:16px 0 4px;overflow:hidden}.meter i{background:var(--ink);transform-origin:0;height:100%;transition:transform .8s var(--ease);display:block}.debit{aspect-ratio:1.586;background:var(--yellow);border:3px solid var(--ink);box-shadow:7px 7px 0 var(--ink);isolation:isolate;border-radius:22px;flex-direction:column;justify-content:space-between;padding:20px 22px;display:flex;position:relative;overflow:hidden}.debit:before{content:"";z-index:-1;border:3px solid var(--ink);background:var(--tomato);border-radius:50%;width:200px;height:200px;position:absolute;bottom:-70px;right:-46px}.debit:after{content:"";z-index:-1;border:3px solid var(--ink);background:var(--mint);border-radius:50%;width:44px;height:44px;position:absolute;top:40px;right:118px}.debit__top{justify-content:space-between;align-items:center;font-size:17px;font-weight:800;display:flex}.debit__num{letter-spacing:.06em;font-variant-numeric:tabular-nums;margin:0;font-size:clamp(17px,5.4vw,22px);font-weight:700}.debit__foot{justify-content:space-between;font-size:14px;font-weight:700;display:flex}.debit__frozen{z-index:2;background:var(--lilac);opacity:0;place-items:center;margin:0;transition:opacity .3s;display:grid;position:absolute;inset:0}.debit__frozen span{border:var(--line);background:var(--paper);box-shadow:var(--sh-sm);letter-spacing:-.04em;border-radius:10px;padding:4px 16px 7px;font-size:24px;font-weight:800;rotate:-4deg}.debit.is-frozen .debit__frozen{opacity:1}.toggles{padding-top:6px;padding-bottom:6px}.toggle{cursor:pointer;grid-template-columns:1fr auto;align-items:center;gap:14px;padding:12px 0;display:grid}.toggle+.toggle{border-top:1.5px solid var(--hair)}.toggle b{letter-spacing:-.01em;font-weight:700;display:block}.toggle small{color:var(--muted);font-size:13px;line-height:1.35;display:block}.toggle input{opacity:0;pointer-events:none;position:absolute}.toggle i{border:var(--line);background:var(--paper);border-radius:99px;width:54px;height:31px;transition:background .25s;position:relative}.toggle i:after{content:"";border:2px solid var(--ink);background:var(--paper);width:22px;height:22px;box-shadow:2px 2px 0 var(--ink);transition:transform .35s var(--spring);border-radius:50%;position:absolute;top:2px;left:2px}.toggle input:checked+i{background:var(--mint)}.toggle input:checked+i:after{transform:translate(23px)}.toggle input:focus-visible+i{outline:3px solid var(--ink);outline-offset:2px}.seg{flex-wrap:wrap;gap:8px;display:flex}.seg button{border:2px solid var(--ink);background:var(--paper);height:38px;transition:background .2s, transform .16s var(--ease), box-shadow .16s var(--ease);border-radius:10px;padding:0 13px;font-size:14px;font-weight:700}.seg button:hover{background:#fff6c2}.seg button.is-on{background:var(--yellow);box-shadow:var(--sh-sm);transform:translate(-1px,-1px)}.tabs{bottom:calc(12px + env(safe-area-inset-bottom));z-index:20;margin:auto 0 calc(12px + env(safe-area-inset-bottom));background:var(--paper);border:var(--line);box-shadow:var(--sh);border-radius:18px;grid-template-columns:repeat(6,minmax(0,1fr));gap:2px;padding:6px;display:grid;position:sticky}.tabs a{letter-spacing:-.01em;border:2px solid #0000;border-radius:12px;flex-direction:column;align-items:center;gap:2px;padding:7px 0 6px;font-size:11.5px;font-weight:700;transition:background .2s;display:flex}.tabs a:hover{background:#fff6c2}.tabs a.is-on{background:var(--yellow);border-color:var(--ink)}.tabs svg{fill:none;stroke:currentColor;stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px}.sheet{border:var(--line);background:var(--paper);width:min(420px,100% - 28px);color:var(--ink);box-shadow:8px 8px 0 var(--ink);border-radius:20px;padding:0}.sheet[open]{animation:pop .4s var(--spring)}@keyframes pop{0%{opacity:0;transform:translateY(16px)scale(.96)}}.sheet::backdrop{background:#11111180}.sheet__body{gap:14px;padding:22px;display:grid}.sheet h2{letter-spacing:-.05em;margin-bottom:2px;font-size:30px}.field{gap:6px;font-size:14px;font-weight:700;display:grid}.field input,.field select{border:var(--line);height:50px;font:inherit;color:var(--ink);background:var(--paper);border-radius:10px;padding:0 14px;font-size:17px;font-weight:500;transition:box-shadow .15s,background .15s}.field select{appearance:none;background:var(--paper) no-repeat right 14px center / 14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 9 7 7 7-7'/%3E%3C/svg%3E");padding-right:40px}.field input:focus,.field select:focus{box-shadow:var(--sh-sm);background-color:#fffbe0;outline:none}.sheet .row.end{margin-top:6px}.toast{left:50%;bottom:calc(108px + env(safe-area-inset-bottom));z-index:50;border:var(--line);background:var(--yellow);width:max-content;max-width:min(400px,100% - 32px);color:var(--ink);box-shadow:var(--sh-sm);opacity:0;pointer-events:none;transition:opacity .25s, translate .45s var(--spring), rotate .45s var(--spring);border-radius:12px;padding:11px 16px 13px;font-size:14.5px;font-weight:700;line-height:1.35;position:fixed;translate:-50% 16px;rotate:0deg}.toast.is-on{opacity:1;translate:-50%;rotate:-1.5deg}.side{display:none}@media (min-width:1000px){body.app{grid-template-columns:var(--side) minmax(0, var(--col));column-gap:var(--gap)}.main{padding:28px 0 0}.top__bar,.top__actions{display:none}.top h1{font-size:48px}.side{background:var(--yellow);border:var(--line);height:calc(100vh - 56px);box-shadow:var(--sh);border-radius:24px;flex-direction:column;align-self:start;gap:16px;margin-top:28px;padding:22px;display:flex;position:sticky;top:28px;overflow-y:auto}.side .brand{font-size:34px}.me{background:var(--paper);border:2px solid var(--ink);border-radius:14px;align-items:center;gap:12px;padding:12px;display:flex}.me p{color:var(--muted);margin:0;font-size:13px;line-height:1.35}.me b{color:var(--ink);font-size:15px}.side__split{background:var(--paper);border:2px solid var(--ink);border-radius:14px;padding:16px}.side__split .small{margin:2px 0 0}.side__split .split{height:20px;margin-top:14px}.breakdown--side{gap:6px;margin-top:14px}.breakdown--side li{font-size:14px}.side__sticker{text-align:center;border:var(--line);background:var(--mint);width:124px;height:124px;box-shadow:var(--sh-sm);letter-spacing:-.035em;border-radius:50%;flex:none;align-self:center;place-items:center;margin:auto 0;font-size:19px;font-weight:800;line-height:1;display:grid;rotate:9deg}.side__actions{gap:12px;display:grid}.toast{left:calc(50% + (var(--side) + var(--gap)) / 2)}}@media (min-width:1000px) and (max-height:780px){.side__sticker{display:none}.side__actions{margin-top:auto}}@media (max-width:360px){.tabs a{font-size:10.5px}.pair,.jars{gap:12px}}@media (prefers-reduced-motion:reduce){.view,.sheet[open]{animation:none}.btn,.toast,.toggle i:after{transition:opacity .2s}}