@font-face{font-family:'Sunghyun Sans';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/SunghyunSans-Regular-068baca.woff2') format('woff2')}
@font-face{font-family:'Sunghyun Sans';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/SunghyunSans-Medium-068baca.woff2') format('woff2')}
@font-face{font-family:'Sunghyun Sans';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/SunghyunSans-SemiBold-068baca.woff2') format('woff2')}
@font-face{font-family:'Sunghyun Sans';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/SunghyunSans-Bold-068baca.woff2') format('woff2')}
@font-face{font-family:'Sunghyun Sans';font-style:normal;font-weight:800;font-display:swap;src:url('fonts/SunghyunSans-ExtraBold-068baca.woff2') format('woff2')}
:root{--ink:#202020;--secondary:var(--text-secondary);--wash:#f5f5f2;--blue:#00b6ef;--green:#00d867;--orange:#ffb726;--pink:#ff3ea6;--purple:#9d48fa;--spring:cubic-bezier(.23,1,.32,1)}*{box-sizing:border-box}body{margin:0;background:#fff;color:var(--ink);font-family:'Sunghyun Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:14px;-webkit-font-smoothing:antialiased;letter-spacing:-.45px}button,input,select{font:inherit;letter-spacing:inherit}button{border:0;background:none;cursor:pointer;color:inherit;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid #00b6ef;outline-offset:5px}button{transition:transform 160ms var(--spring),background 120ms ease}button:active{transform:scale(.97)}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.filled{fill:currentColor;stroke:none}.svg-library{position:absolute;width:0;height:0;overflow:hidden}.app-shell{max-width:1060px;margin:auto;padding:0 45px 80px}.app-header{height:112px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:9px;font-weight:700;font-size:24px;letter-spacing:-1.2px;padding:0}.brand svg{width:24px;height:24px}.top-right{display:flex;align-items:center;gap:20px}#demo-label{font-size:10px;color:#8e8e88;background:#f4f4ef;border-radius:6px;padding:5px 8px;font-weight:600}.icon-button{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;color:#777773}@media(hover:hover) and (pointer:fine){.icon-button:hover{background:#f2f2ef}}.icon-button svg{width:20px;height:20px}.profile-button{height:35px;width:35px;border-radius:50%;background:#ffe0b0;overflow:hidden;display:grid;place-items:center}.face{font-size:34px;color:#744a2b;line-height:1;padding-bottom:10px;font-weight:600;position:relative}.face:before,.face:after{content:'';width:3px;height:4px;border-radius:50%;background:currentColor;position:absolute;top:2px;left:7px}.face:after{left:18px}.workspace{display:grid;grid-template-columns:370px 1fr;gap:65px;padding-top:26px}.wallet-side{min-width:0}.account-line{display:flex;align-items:center;justify-content:space-between;margin-bottom:27px;font-size:14px;font-weight:600}.account-title{display:flex;align-items:center;gap:8px}.account-title>span{width:25px;height:25px;background:#f2f2ed;border-radius:8px;display:grid;place-items:center}.account-title svg{width:15px;height:15px}.month-control{display:flex;gap:4px;align-items:center;font-weight:500;color:var(--text-secondary);font-size:11px}.month-control button{display:grid;place-items:center;width:24px;height:24px;border-radius:50%}@media(hover:hover) and (pointer:fine){.month-control button:hover{background:#f3f3f0}}.month-control button svg{width:12px;height:12px}.month-control span{text-transform:capitalize;min-width:83px;text-align:center}.balance-label{font-size:13px;color:var(--text-secondary);font-weight:500}.big-balance{font-size:57px;letter-spacing:-3px;line-height:1.12;font-weight:700;margin:10px 0 13px;white-space:nowrap}.big-balance em{font-size:36px;letter-spacing:-1.5px;font-style:normal;color:#b0b0a8;font-weight:600}.balance-status{font-size:11px;color:var(--text-secondary);display:flex;align-items:center;gap:6px}.balance-status svg{color:#18bd75;width:13px;height:13px}.quick-actions{display:flex;gap:11px;margin-top:28px}.action-pill{background:#f4f4f1;display:flex;align-items:center;justify-content:center;gap:7px;flex:1;padding:13px 12px;border-radius:30px;font-size:12px;font-weight:600}.action-pill svg{width:17px;height:17px}.action-pill.black{background:#202020;color:white}@media(hover:hover) and (pointer:fine){.action-pill:hover{background:#eaeae4}}@media(hover:hover) and (pointer:fine){.action-pill.black:hover{background:#3a3a3a}}.wallet-heading{display:flex;align-items:center;justify-content:space-between;margin:37px 0 14px}.wallet-heading h2{font-size:14px;font-weight:600;margin:0}.wallet-heading>span{font-size:11px;color:var(--text-secondary)}.wallet-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.pocket{position:relative;border-radius:20px;overflow:hidden;min-height:153px;display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:17px;color:#fff;isolation:isolate;box-shadow:inset 0 1px 0 #ffffff30;transition:transform 160ms var(--spring)}@media(hover:hover) and (pointer:fine){.pocket:hover{transform:translateY(-2px)}}.pocket:active{transform:scale(.97)}.pocket.green{background:#00cf63}.pocket.blue{background:#00b4ef}.pocket.orange{background:#ffb71b}.pocket.purple{background:#a04bfa}.pocket-icon{display:grid;place-items:center}.pocket-icon svg{width:27px;height:27px;stroke-width:2.4}.pocket small{position:absolute;top:18px;right:15px;font-size:10px;color:#ffffffa8;font-weight:500}.pocket b{font-weight:600;font-size:14px;margin-top:auto;position:relative;z-index:1}.pocket .pocket-amount{font-size:12px;color:#ffffffbf;margin-top:5px;position:relative;z-index:1}.pocket:after{content:'';position:absolute;width:120px;height:120px;border-radius:50%;right:-63px;top:45px;background:#ffffff09;z-index:-1}.pocket-dot{position:absolute;right:15px;bottom:17px;color:#ffffff80}.pocket-dot svg{width:16px;height:16px}.aside-note{font-size:10px;color:var(--text-secondary);display:flex;align-items:center;justify-content:center;gap:5px;margin-top:21px}.aside-note svg{width:11px;height:11px}.activity-side{padding-top:0}.list-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;height:28px}.list-heading h2{margin:0;font-size:16px;font-weight:600}.text-button{font-size:11px;color:var(--text-secondary);display:flex;align-items:center;gap:3px}.text-button svg{width:12px;height:12px}.mini-tabs{display:flex;gap:21px}.mini-tabs button{font-size:13px;color:var(--text-secondary);padding:0;font-weight:600}.mini-tabs button.selected{color:#202020}.day-label{font-size:11px;color:var(--text-secondary);font-weight:500;margin:22px 0 15px;padding-inline:16px}.transaction{transition:background 120ms ease;display:flex;align-items:center;width:100%;padding:11px 16px;gap:12px;text-align:left;border-radius:13px}@media(hover:hover) and (pointer:fine){.transaction:hover{background:#f8f8f5}}.token{width:39px;height:39px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;color:white;position:relative}.token svg{width:21px;height:21px;stroke-width:2}.token.green{background:#00ca6b}.token.blue{background:#36b7ed}.token.orange{background:#ffb227}.token.pink{background:#ff4f9a}.token.purple{background:#a34bf2}.token.red{background:#f82842}.token.black{background:#181818}.token.grey{background:#9aabb6}.token.netflix{font-weight:800;color:#fff;font-size:22px}.token.spotify svg{stroke-width:1.8}.token.spotify{background:#19c76d}.token .status-dot{width:11px;height:11px;display:grid;place-items:center;position:absolute;bottom:-1px;right:-1px;border-radius:50%;border:2px solid #fff;background:#f0f0eb;color:#9e9e96;font-size:7px}.tx-copy{flex:1;min-width:0}.tx-copy b{display:block;font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tx-copy small{display:block;font-size:11px;color:var(--text-secondary);margin-top:5px}.tx-value{font-size:12px;font-weight:500;text-align:right;white-space:nowrap}.tx-value small{display:block;font-size:10px;color:var(--text-secondary);margin-top:5px;font-weight:400}.tx-value.income{color:#17b26d}.next-up{margin-top:33px}.next-up .list-heading{margin-bottom:7px}.next-up h2{font-size:13px}.next-up .transaction{padding:10px 16px}.next-up .token{width:31px;height:31px}.next-up .token svg{width:17px;height:17px}.next-up .tx-copy b,.next-up .tx-value{font-size:12px}.next-up .tx-copy small{font-size:10px}.dotted-divider{height:1px;background:repeating-linear-gradient(to right,#e8e8e0 0,#e8e8e0 3px,transparent 3px,transparent 7px);margin-top:27px}.dock{display:flex;align-items:center;justify-content:center;gap:47px;width:max-content;margin:48px auto 0;background:#f6f6f2;border:5px solid #fff;padding:9px 20px;border-radius:28px;box-shadow:0 2px 12px #16160a05}.dock button{display:flex;align-items:center;gap:7px;color:var(--text-secondary);padding:7px 0;position:relative}.dock button svg{width:19px;height:19px}.dock button span{font-size:11px;font-weight:500}.dock button.active{color:#202020}.dock button.active:after{content:'';width:3px;height:3px;border-radius:50%;position:absolute;bottom:0;left:8px;background:#202020}.view-heading{display:flex;align-items:center;justify-content:space-between;margin:26px 0 25px}.view-heading h1{margin:0;font-size:29px;letter-spacing:-1.2px;font-weight:700}.view-heading p{color:var(--text-secondary);font-size:12px;margin-top:9px}.wide-view{max-width:680px;margin:0 auto}.view-balance{margin-bottom:28px}.view-balance .big-balance{font-size:46px}.view-balance .balance-label{font-size:12px}.segmented{display:flex;align-items:center;gap:3px;background:#f5f5f1;padding:4px;border-radius:12px;margin:22px 0;width:max-content;max-width:100%;flex-wrap:wrap}.segmented button{border-radius:9px;font-size:11px;color:var(--text-secondary);padding:9px 15px;font-weight:600}.segmented button.active{background:#fff;color:#252525;box-shadow:0 2px 4px #00000006}.search-box{position:relative;display:flex;align-items:center;background:#f6f6f3;border-radius:13px;padding:0 13px;gap:9px;margin-bottom:20px}.search-box svg{color:#b9b9b0;width:17px;height:17px}.search-box input{border:0;background:transparent;padding:13px 0;width:100%;outline:none;color:#272727;font-size:12px}.search-box input::placeholder{color:var(--text-secondary)}.floating-add{position:fixed;bottom:37px;right:max(35px,calc((100vw - 1000px)/2));width:49px;height:49px;display:grid;place-items:center;background:#202020;color:white;border-radius:50%;z-index:3;box-shadow:0 3px 8px #20202015}.floating-add svg{width:25px;height:25px}.recurring-list{margin:28px 0}.recurring-list h2{font-size:13px;font-weight:600;margin-bottom:16px}.recurring-list .transaction{padding:14px 16px}.recurring-summary{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin:26px 0}.mini-pocket{color:#fff;border-radius:20px;padding:20px;position:relative;overflow:hidden}.mini-pocket.orange{background:#ffb522}.mini-pocket.purple{background:#a24bfa}.mini-pocket svg{width:25px;height:25px;margin-bottom:24px}.mini-pocket b{display:block;font-size:14px}.mini-pocket strong{display:block;font-weight:500;font-size:24px;letter-spacing:-1px;margin-top:7px}.mini-pocket small{position:absolute;top:23px;right:18px;font-size:11px;color:#ffffffac}.expense-track{display:flex;width:100%;height:14px;gap:4px;margin-top:20px}.expense-track span{border-radius:6px;min-width:4px}.breakdown-row{padding:18px 0;display:flex;align-items:center;gap:11px}.breakdown-row>i{width:10px;height:10px;border-radius:50%}.breakdown-row>span{flex:1;font-size:13px;font-weight:500}.breakdown-row>b{font-size:12px;font-weight:500}.breakdown-row small{display:block;color:var(--text-secondary);font-size:11px;text-align:right;margin-top:5px;font-weight:400}.plain-card{background:#f7f7f3;border-radius:23px;padding:25px;margin-top:28px}.plain-card h2{font-size:14px;margin:0 0 10px}.plain-card p{font-size:12px;line-height:1.6;color:var(--text-secondary);margin:0}.setting-row{display:flex;gap:15px;align-items:center;padding:20px 0}.setting-row>svg{color:var(--text-secondary);width:19px;height:19px}.setting-row div{flex:1}.setting-row b{font-weight:500;font-size:13px}.setting-row small{display:block;font-size:11px;color:var(--text-secondary);line-height:1.6;margin-top:5px}.setting-row>button{background:#f5f5f0;font-size:11px;font-weight:600;padding:9px 15px;border-radius:30px}.setting-row>button.danger{color:#ff3350;background:#fff0f0}.empty{text-align:center;padding:48px 10px;color:var(--text-secondary);font-size:12px;line-height:1.7}.empty strong{display:block;color:#33332b;font-size:15px;margin-top:20px;margin-bottom:6px}.empty>svg{width:38px;height:38px;stroke-width:1.4;color:#deded3}.empty .action-pill{display:flex;flex:0 0 auto;gap:8px;margin:22px auto 0;width:max-content;max-width:100%;min-height:44px;padding:12px 18px;font-size:13px;line-height:20px;color:var(--ink)}.empty .action-pill svg{width:17px;height:17px;color:inherit;stroke-width:1.9}.private-mode .money{filter:blur(9px);user-select:none}@media(hover:hover) and (pointer:fine){.private-mode .money:hover{filter:blur(7px)}}.money{transition:filter .3s}#content{animation:page-in .4s var(--spring)}#content.slide-left{animation:slide-left .4s var(--spring)}#content.slide-right{animation:slide-right .4s var(--spring)}@keyframes page-in{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}@keyframes slide-left{from{opacity:0;transform:translateX(13px)}to{opacity:1;transform:none}}@keyframes slide-right{from{opacity:0;transform:translateX(-13px)}to{opacity:1;transform:none}}
/* Family's transient trays: one action at a time, changing height, with the app still underneath. */
dialog{border:0;border-radius:31px;width:420px;max-width:calc(100vw - 24px);padding:9px 23px 23px;position:fixed;margin:auto;inset:auto 0 26px;background:#fff;color:#202020;box-shadow:0 15px 90px #00000020;overflow:visible;transition:height .32s var(--spring),background .25s,color .25s;animation:tray-in .4s var(--spring)}dialog::backdrop{background:#0005;backdrop-filter:blur(2px)}.tray-handle{width:33px;height:4px;border-radius:4px;background:#e9e9e2;margin:0 auto 19px}.tray-heading{display:flex;align-items:center;gap:10px;margin-bottom:22px}.tray-heading h2{font-size:16px;font-weight:600;letter-spacing:-.5px;flex:1;margin:0}.tray-heading>svg{color:#b2b2a8;width:20px;height:20px}.tray-heading .icon-button{background:#f5f5f0;width:25px;height:25px}.tray-heading .icon-button svg{width:13px;height:13px}.choice-row{display:flex;align-items:center;gap:12px;width:100%;padding:14px 10px;border-radius:13px;text-align:left}@media(hover:hover) and (pointer:fine){.choice-row:hover{background:#f7f7f3}}.choice-row>div{flex:1}.choice-row b{font-size:13px;font-weight:600}.choice-row small{display:block;font-size:11px;color:var(--text-secondary);margin-top:5px}.choice-row>svg{width:15px;height:15px;color:#c6c6ba}.choice-row .token{width:37px;height:37px}.tray-caption{text-align:center;color:var(--text-secondary);font-size:10px;line-height:1.6;margin:20px 14px 1px}.amount-entry{display:flex;align-items:baseline;justify-content:center;margin:26px 0 31px;position:relative}.amount-entry input{font-size:53px;letter-spacing:-2px;font-weight:600;max-width:270px;min-width:0;width:100%;border:0;background:transparent;color:inherit;outline:none;text-align:center;padding:0;appearance:textfield}.amount-entry input::-webkit-inner-spin-button{appearance:none}.amount-entry input::placeholder{color:#deded4}.amount-entry>span{font-size:36px;letter-spacing:-1.5px;color:#c6c6ba;font-weight:500;margin-left:7px}.field{background:#f6f6f2;border-radius:12px;margin-bottom:8px;display:flex;align-items:center;padding:0 13px;gap:10px}.field>span{font-size:11px;color:var(--text-secondary);min-width:61px}.field>input,.field>select{font-size:12px;width:100%;border:0;background:transparent;color:#44443d;padding:15px 0;outline:none;min-width:0;text-align:right;appearance:none}.field>input::placeholder{color:#bdbdb1}.field:focus-within{box-shadow:0 0 0 2px #d7f2fc}.submit-pill{border-radius:30px;padding:15px 20px;width:100%;font-weight:600;font-size:13px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;gap:7px;margin-top:21px}.submit-pill svg{width:17px;height:17px}@media(hover:hover) and (pointer:fine){.submit-pill:hover{filter:brightness(.97)}}.submit-pill:disabled{background:#f1f1ec!important;color:#c6c6bb!important;cursor:default}.field-error{color:#e45566;font-size:11px;min-height:14px;margin-top:11px;text-align:center}.danger-link{color:#fb3852;font-size:11px;font-weight:500;display:block;margin:17px auto 0}.dark-tray{background:#080808;color:#fff}.dark-tray .tray-handle{background:#2b2b2b}.dark-tray .tray-heading .icon-button{background:#222;color:#777}.dark-tray .tray-heading>svg{color:#777}.review-icon{margin-top:8px}.review-title{font-size:24px;font-weight:600;letter-spacing:-.9px;line-height:1.3;margin:16px 0 27px}.review-title small{display:block;color:#777;font-size:13px;margin-top:6px;font-weight:400;letter-spacing:-.3px}.review-line{display:flex;align-items:center;justify-content:space-between;margin:19px 0;font-size:12px}.review-line>span{color:#777}.review-line>b{font-weight:500}.dark-tray .submit-pill{background:#fff;color:#151515;margin-top:28px}.dark-tray .tray-caption{color:#555}.success-tray{text-align:center;padding:21px 0 6px}.success-art{position:relative;width:110px;height:110px;margin:4px auto 25px;border-radius:50%;background:#00d86a;display:grid;place-items:center;animation:success-in 220ms var(--motion-ease)}.success-art svg{width:55px;height:55px;color:#fff;stroke-width:3}.success-art:before,.success-art:after{content:'✦';position:absolute;color:#ffca41;font-size:24px;left:-24px;top:6px}.success-art:after{left:auto;right:-20px;top:63px;font-size:18px;color:#00b6ef}.success-tray h2{font-size:23px;letter-spacing:-.8px;margin:0 0 10px}.success-tray p{font-size:12px;color:var(--text-secondary);line-height:1.7}.success-tray .submit-pill{background:#f3f3ee;color:#202020}.month-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.month-picker button{padding:13px 5px;font-size:12px;border-radius:10px;background:#f6f6f2}.month-picker button.selected{background:#00b6ef;color:white}.picker-year{display:flex;align-items:center;justify-content:space-between;margin:15px 0 22px}.picker-year b{font-size:19px}.picker-year svg{width:16px;height:16px}#toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,15px);opacity:0;pointer-events:none;padding:13px 21px;border-radius:30px;background:#202020;color:white;font-size:12px;z-index:20;box-shadow:0 4px 10px #0002;transition:transform 160ms var(--motion-ease),opacity 140ms ease-out;max-width:90vw;text-align:center;width:max-content}#toast.visible{transform:translate(-50%,0);opacity:1;pointer-events:auto}.delete-actions{display:flex;gap:9px}.delete-actions button{flex:1;border-radius:30px;background:#f5f5ef;padding:13px;font-size:12px;font-weight:600}.delete-actions button.danger{background:#ff3352;color:white}.choice-row.active{background:#e7f8fe}.choice-row.active>svg{color:var(--blue)}[hidden]{display:none!important}@keyframes tray-in{from{opacity:0;transform:translateY(35px) scale(.96)}to{opacity:1;transform:none}}@keyframes pop{from{opacity:0;transform:scale(.55) rotate(-15deg)}to{opacity:1;transform:none}}.field.flash{animation:flash .3s}@keyframes flash{50%{transform:translateX(4px)}}
@media(min-width:1500px){.app-shell{padding-top:20px}.workspace{padding-top:55px;gap:85px;grid-template-columns:370px 1fr}.app-header{height:110px}.dock{margin-top:55px}}
@media(max-width:900px){.app-shell{max-width:800px;padding:0 30px 85px}.workspace{grid-template-columns:310px 1fr;gap:35px}.big-balance{font-size:47px}.big-balance em{font-size:31px}.pocket{min-height:145px;padding:15px}.pocket small{font-size:9px;right:12px}.dock{gap:30px}.tx-copy b{font-size:12px}.transaction{gap:9px}.token{height:34px;width:34px}.tx-value{font-size:11px}}
@media(max-width:700px){.app-shell{max-width:470px;padding:0 24px 115px}.app-header{height:84px}.brand{font-size:21px}.brand svg{width:21px;height:21px}.top-right{gap:13px}.profile-button{width:31px;height:31px}.workspace{display:block;padding-top:17px}.account-line{margin-bottom:23px}.account-title{font-size:12px}.balance-label{font-size:12px}.big-balance{font-size:52px;margin-top:9px}.big-balance em{font-size:34px}.balance-status{font-size:10px}.quick-actions{margin-top:24px}.action-pill{padding:12px 10px;font-size:12px}.wallet-heading{margin-top:28px}.pocket{min-height:153px;border-radius:19px;padding:17px}.pocket b{font-size:14px}.pocket small{font-size:10px;right:16px}.pocket-icon svg{width:27px;height:27px}.activity-side{margin-top:33px}.list-heading{margin-bottom:20px}.mini-tabs button{font-size:14px}.transaction{padding:12px 16px;gap:12px}.token{width:38px;height:38px}.tx-copy b{font-size:13px}.tx-value{font-size:12px}.next-up{margin-top:25px}.dock{position:fixed;bottom:14px;left:50%;transform:translateX(-50%);z-index:4;margin:0;gap:30px;padding:9px 23px;border:5px solid white;box-shadow:0 3px 28px #00000008;background:#f7f7f3}.dock button span{display:none}.dock button{padding:6px}.dock button svg{width:21px;height:21px}.dock button.active:after{left:15px;bottom:-2px}.floating-add{bottom:99px;right:max(23px,calc((100vw - 420px)/2));width:43px;height:43px}.view-heading{margin:19px 0 25px}.view-heading h1{font-size:26px}.view-heading p{font-size:11px}.view-heading .month-control{gap:0}.view-balance .big-balance{font-size:43px}.segmented{gap:0;justify-content:space-between;width:100%}.segmented button{font-size:10px;padding:9px 10px}.recurring-summary{gap:10px}.mini-pocket{padding:18px}.mini-pocket strong{font-size:23px}.mini-pocket small{font-size:10px;right:15px}.setting-row small{font-size:10px}.setting-row>button{padding:9px 11px;font-size:10px}.plain-card{padding:22px}.plain-card p{font-size:11px}.aside-note{font-size:9px}.day-label{margin:21px 0 12px}dialog{bottom:12px;padding:9px 21px 21px;border-radius:29px}.tray-heading{margin-bottom:20px}.amount-entry{margin:22px 0 28px}.choice-row{padding:13px 8px}.review-title{font-size:23px}.tray-caption{font-size:9px}#toast{bottom:100px;font-size:11px}}
@media(max-width:370px){.app-shell{padding-left:19px;padding-right:19px}.big-balance{font-size:46px}.pocket{min-height:140px;padding:15px}.pocket b{font-size:12px}.month-control span{min-width:75px;font-size:10px}.top-right{gap:8px}.segmented button{padding:9px 7px}.dock{gap:26px}.pocket small{right:12px}.mini-pocket strong{font-size:21px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.month-control .month-button{width:auto;height:auto;border-radius:7px;padding:3px 1px}@media(hover:hover) and (pointer:fine){.month-control .month-button:hover{background:#f4f4ef}}

.pocket:after{display:none}.empty-art{width:100px;height:77px;margin:0 auto 8px;position:relative}.empty-art i{position:absolute;width:75px;height:49px;border-radius:10px;background:#00d26b;top:0;left:12px;transform:rotate(-8deg)}.empty-art i:nth-child(2){top:12px;background:#ffbd25;left:8px;transform:rotate(5deg)}.empty-art i:nth-child(3){top:25px;background:#00b6ef;left:15px;transform:rotate(-2deg);box-shadow:0 4px 8px #00000005}.empty-art i:nth-child(3):after{content:'';position:absolute;right:9px;top:9px;width:23px;height:7px;border-radius:8px;background:#ffffff55}
@media(min-width:701px){.floating-add{bottom:30px;right:max(30px,calc((100vw - 1060px)/2 - 30px))}}
.sync-indicator{display:grid;place-items:center;color:#b7b7aa}.sync-indicator svg{width:16px;height:16px;stroke-width:1.7}.sync-indicator.error{color:#e58d6c}.sync-indicator.saving svg,.loading-view>svg{animation:spin 1.5s linear infinite}.token .status-dot svg{width:6px;height:6px;stroke-width:2}.loading-view{padding:110px 0;text-align:center;color:var(--text-secondary);font-size:12px}.loading-view>svg{width:23px;height:23px;stroke-width:1.5}.loading-view p{margin-top:18px}.booting .dock,.booting .app-header button{pointer-events:none;opacity:.5}.is-saving #tray-content button{pointer-events:none;opacity:.6}.empty a{text-decoration:none;max-width:240px}.token.netflix{font-size:20px}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:700px){.top-right{gap:10px}.sync-indicator svg{width:14px;height:14px}}
:root{--control-bg:#f6f6f2;--control-radius:13px;--menu-shadow:0 10px 35px #20202018,0 0 0 1px #eeeeE6}.profile-button{padding:0;background:none;overflow:visible;width:35px;height:35px}.avatar-disc{display:inline-grid;place-items:center;width:35px;height:35px;flex-shrink:0;border-radius:50%;color:#845b2d;background:#ffe3b7}.avatar-disc svg{width:19px;height:19px;stroke-width:1.9}.avatar-disc.blue,.avatar-color.blue{background:#d5f2ff;color:#0089bb}.avatar-disc.green,.avatar-color.green{background:#d3f7e3;color:#11965d}.avatar-disc.purple,.avatar-color.purple{background:#ecddff;color:#8f44d6}.avatar-disc.pink,.avatar-color.pink{background:#ffe0ee;color:#d54983}.avatar-color.sand{background:#ffe3b7;color:#845b2d}.face{display:none}.field-trigger{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex:1;min-width:0;padding:15px 0;font-size:12px;text-align:right}.field-trigger>svg{width:14px;height:14px;color:var(--text-secondary);stroke-width:1.7}.field:has(.field-trigger):focus-within{box-shadow:0 0 0 2px #c8ecf8}.control-wrap{position:relative}.select-menu{position:absolute;top:calc(100% + 3px);right:0;left:0;border-radius:16px;background:#fff;box-shadow:var(--menu-shadow);padding:6px;z-index:10;max-height:235px;overflow:auto;overscroll-behavior:contain;animation:page-in .15s ease}.select-menu [role=option]{width:100%;display:flex;align-items:center;gap:11px;text-align:left;padding:11px 12px;border-radius:10px;font-size:12px}.select-menu [role=option]>svg{width:17px;height:17px;color:#9e9e94}.select-menu [role=option]>span{flex:1}.select-menu [role=option]>svg:last-child{opacity:0;width:15px;color:#00a9df}.select-menu [role=option][aria-selected=true]{background:#edf9fd}.select-menu [role=option][aria-selected=true]>svg:last-child{opacity:1}.select-menu [role=option]:focus-visible{background:#f5f5f0;outline:none}@media(hover:hover) and (pointer:fine){.select-menu [role=option]:hover{background:#f5f5f0;outline:none}}.calendar-heading{display:flex;align-items:center;justify-content:space-between;margin:8px 0 24px}.calendar-period{display:flex;gap:8px;align-items:center;text-transform:capitalize;font-size:14px;font-weight:600}.calendar-period svg{width:13px;color:var(--text-secondary)}.calendar-week,.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;text-align:center}.calendar-week{font-size:10px;color:var(--text-secondary);margin-bottom:12px}.calendar-grid button{height:39px;max-width:42px;width:100%;margin:auto;display:grid;place-items:center;border-radius:50%;font-size:12px}@media(hover:hover) and (pointer:fine){.calendar-grid button:hover{background:#f4f4ed}}.calendar-grid button.today{box-shadow:inset 0 0 0 1px #dadacf}.calendar-grid button.selected{background:#202020;color:#fff;box-shadow:none}.calendar-shortcuts{display:flex;justify-content:center;gap:9px;margin:23px 0 5px}.calendar-shortcuts button{border-radius:30px;background:#f5f5ef;font-size:11px;padding:10px 17px}.account-hero{text-align:center;margin:12px 0 25px}.account-hero .avatar-disc,.profile-preview .avatar-disc{width:69px;height:69px}.account-hero .avatar-disc svg,.profile-preview .avatar-disc svg{width:32px;height:32px}.account-hero h3{font-size:21px;letter-spacing:-.7px;margin:16px 0 6px;overflow-wrap:anywhere}.account-hero p{font-size:11px;color:var(--text-secondary);overflow-wrap:anywhere}.session-badge{display:inline-flex;align-items:center;gap:5px;color:#23946b;background:#ebf8f0;border-radius:30px;padding:6px 9px;font-size:9px;margin-top:5px}.session-badge svg{width:11px;height:11px}.signout{text-decoration:none;color:#e85f6c;margin-top:9px}.choice-row>svg:first-child{color:var(--text-secondary);width:19px;height:19px}.signout>svg:first-child{color:inherit}.profile-preview{text-align:center;margin:15px 0 22px}.avatar-colors{display:flex;justify-content:center;gap:12px;margin-bottom:28px}.avatar-color{width:29px;height:29px;border-radius:50%;display:grid;place-items:center}.avatar-color svg{width:14px;height:14px}.avatar-color[aria-pressed=true]{outline:2px solid currentColor;outline-offset:3px}.account-summary{display:flex;align-items:center;gap:13px;text-align:left;width:100%;margin-top:22px;padding:17px;border-radius:18px;background:#f6f6f1}.account-summary>span:nth-child(2){flex:1;min-width:0}.account-summary b{font-size:13px}.account-summary small{display:block;font-size:10px;color:var(--text-secondary);margin-top:5px;overflow-wrap:anywhere}.account-summary>svg{width:16px;color:var(--text-secondary)}.login-view{text-align:center;max-width:390px;margin:55px auto}.login-art{width:100px;height:85px;background:#00b6ef;color:#fff;border-radius:23px;display:grid;place-items:center;margin:0 auto 34px;transform:rotate(-6deg)}.login-art svg{width:46px;height:46px;stroke-width:1.5}.login-view h1{font-size:38px;letter-spacing:-1.8px;line-height:1.12;margin:0}.login-view>p{font-size:13px;color:var(--text-secondary);line-height:1.8;margin:20px 0 32px}.signed-in{display:flex;align-items:center;gap:12px;text-align:left;background:#f6f6f1;padding:15px;border-radius:15px}.signed-in>span:nth-child(2){flex:1;min-width:0}.signed-in b{font-size:12px}.signed-in small{display:block;font-size:10px;color:var(--text-secondary);margin-top:4px;overflow-wrap:anywhere}.signed-in>svg{width:17px;color:#00b36a}.login-view>.action-pill{width:100%;margin:13px 0 20px}.switch-account{color:var(--text-secondary);text-decoration:none;font-size:11px}.login-foot{display:flex;justify-content:center;align-items:center;gap:6px;color:var(--text-secondary);font-size:9px;margin-top:35px}.login-foot svg{width:12px;height:12px}dialog{max-height:calc(100dvh - 24px);overflow-y:auto}dialog:has(.select-menu:not([hidden])){overflow:visible}.control-wrap:last-of-type .select-menu{top:auto;bottom:calc(100% + 3px)}@media(max-width:700px){.login-view{margin-top:42px}.login-view h1{font-size:34px}.calendar-grid button{height:37px}.account-hero{margin-bottom:22px}}
.select-menu.opens-up{top:auto;bottom:calc(100% + 3px)}.select-menu:not(.opens-up){top:calc(100% + 3px);bottom:auto}
.is-anonymous .top-right,.is-anonymous .dock{display:none!important}.classic-login{max-width:370px;margin:28px auto 0}.classic-login .login-art{width:68px;height:62px;border-radius:19px;margin-bottom:25px;transform:rotate(-5deg)}.classic-login .login-art svg{width:31px;height:31px}.classic-login h1{font-size:31px;letter-spacing:-1.3px}.classic-login>p{font-size:12px;margin:15px 0 24px}.auth-tabs{display:flex;background:#f5f5f1;padding:4px;border-radius:13px;margin-bottom:24px;gap:4px}.auth-tabs button{flex:1;padding:10px 12px;border-radius:10px;font-size:12px;font-weight:500;color:var(--text-secondary)}.auth-tabs button.active{background:white;color:#252525;box-shadow:0 2px 5px #00000006}.auth-field{display:block;text-align:left;font-size:11px;font-weight:500;color:var(--text-secondary);margin:17px 0}.auth-field>input,.password-wrap{display:block;width:100%;margin-top:8px;background:#f6f6f2;border:1px solid transparent;border-radius:12px;padding:14px;font-size:13px;outline:none;color:#242424}.auth-field>input::placeholder,.password-wrap input::placeholder{color:#bebeb1}.auth-field>input:focus,.password-wrap:focus-within{border-color:#86d9f3;box-shadow:0 0 0 3px #eafbff}.password-wrap{display:flex;align-items:center;padding:0 12px 0 14px}.password-wrap input{width:100%;min-width:0;background:none;border:0;outline:none;padding:14px 0;color:#242424;font-size:13px}.password-wrap button{display:grid;place-items:center;color:#b1b1a5;padding:5px}.password-wrap svg{width:17px;height:17px}.auth-submit{width:100%;margin:18px 0 23px}.auth-submit:disabled{opacity:.45;cursor:default}.auth-notice{font-size:11px;line-height:1.7;text-align:left;background:#fff6df;padding:14px;border-radius:12px;color:#a28a4a;margin:16px 0}.classic-login .field-error{line-height:1.7}.classic-login .login-foot{margin-top:30px}.reset-to{font-size:11px;color:var(--text-secondary);line-height:1.7;overflow-wrap:anywhere}.reset-to b{color:#6e6e62;font-weight:500}@media(max-width:700px){.classic-login{margin:20px auto}.classic-login h1{font-size:28px}.classic-login .login-art{margin-bottom:24px}}
/* Motion and primary-action tokens, informed by the Family tray and ConnectKit demos. */
:root{--primary-blue:#0090ff;--primary-hover:#0084ee;--primary-pressed:#0078df;--primary-radius:16px;--motion-ease:cubic-bezier(.23,1,.32,1)}
@supports(color:color(display-p3 0 .565 1)){:root{--primary-blue:color(display-p3 0 .565 1);--primary-hover:color(display-p3 0 .52 .96);--primary-pressed:color(display-p3 0 .47 .91)}}
.submit-pill:not(#success-close),.dark-tray .submit-pill,.auth-submit{background:var(--primary-blue);color:white;border-radius:var(--primary-radius);min-height:48px;font-size:14px;font-weight:600;box-shadow:none;transition:background 150ms ease,transform 160ms var(--motion-ease),box-shadow 150ms ease;filter:none}@media(hover:hover) and (pointer:fine){
.submit-pill:not(#success-close):hover,.dark-tray .submit-pill:hover,.auth-submit:hover{background:var(--primary-hover);filter:none}}
.submit-pill:not(#success-close):active,.auth-submit:active{background:var(--primary-pressed);transform:scale(.975)}
.submit-pill:focus-visible,.auth-submit:focus-visible{outline:3px solid #8cd2ff;outline-offset:3px}
.submit-pill:disabled,.auth-submit:disabled{background:#f1f1ed!important;color:#b8b8ac!important;opacity:1;cursor:not-allowed;transform:none;box-shadow:none}
#success-close{border-radius:16px;min-height:48px;font-size:14px}dialog{animation:none;transition:background-color 230ms ease,color 230ms ease;isolation:isolate;box-shadow:0 24px 100px #00000020;border-radius:30px}#tray-content{position:relative}.tray-outgoing{position:absolute;pointer-events:none;user-select:none;z-index:2}.tray-outgoing *{pointer-events:none!important}.tray-heading{margin-bottom:23px}.tray-heading h2{font-size:16px}.tray-heading .icon-button{width:28px;height:28px}@media(hover:hover) and (pointer:fine){.tray-heading .icon-button:hover{background:#eaeae5}}.choice-row{transition:background 140ms ease,transform 160ms var(--motion-ease)}.choice-row:active{transform:scale(.985)}.select-menu{animation:menu-in 180ms var(--motion-ease);transform-origin:top center}.select-menu.opens-up{transform-origin:bottom center}.calendar-grid button{transition:background 120ms ease,transform 160ms var(--motion-ease)}
dialog::backdrop{background:rgba(0,0,0,.34);backdrop-filter:blur(2px);animation:overlay-in 170ms ease-out}dialog.is-closing::backdrop{animation:overlay-out 140ms ease-out forwards}.is-saving #tray-content button{opacity:1}.is-saving #confirm-entry,.is-saving #confirm-action{color:#ffffffbd}.is-saving #confirm-entry>svg{animation:spin 1.1s linear infinite}
@keyframes overlay-in{from{opacity:0}to{opacity:1}}@keyframes overlay-out{to{opacity:0}}@keyframes menu-in{from{opacity:0;transform:translateY(-3px) scale(.98)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){dialog,dialog::backdrop,.tray-outgoing,#tray-content{animation:none!important;transition:none!important}.select-menu{animation:none!important}}
.is-saving #confirm-entry>svg,.is-saving #confirm-action>svg{animation:spin 1s linear infinite}#content{animation-duration:220ms;animation-timing-function:var(--motion-ease)}#content.slide-left,#content.slide-right{animation-duration:240ms;animation-timing-function:var(--motion-ease)}
.input-guidance{display:block;text-align:left;font-size:10px;font-weight:400;letter-spacing:-.1px;line-height:1.6;margin:6px 2px 0}.input-hint{color:var(--text-secondary)}.input-error{color:#d75b68}.auth-field .input-guidance{font-size:10px;margin-top:7px}.auth-field input[aria-invalid=true],.password-wrap.invalid,.field.invalid{border-color:#e9a2aa;box-shadow:0 0 0 3px #fff1f2}.auth-field input[aria-invalid=true]:focus,.password-wrap.invalid:focus-within{border-color:#df7e89;box-shadow:0 0 0 3px #fff1f2}.field.invalid{box-shadow:0 0 0 1px #e9a2aa,0 0 0 3px #fff1f2}#entry-form>.input-guidance,#profile-form>.input-guidance{margin-top:-2px;margin-bottom:11px;padding:0 3px}#entry-form>.amount-entry+.input-guidance{text-align:center;margin-top:-18px;margin-bottom:20px}#amount[aria-invalid=true]{color:#d75b68}.field-error:empty{display:none}.auth-field:has(input[aria-invalid=true]){color:#c86a73}
.input-guidance,.auth-field .input-guidance{font-size:11px}.input-hint{color:var(--text-secondary)}
.password-wrap input[aria-invalid=true],.password-wrap input[aria-invalid=true]:focus{border:0;box-shadow:none;background:none}.action-pill.black.auth-submit{background:var(--primary-blue);color:white}@media(hover:hover) and (pointer:fine){.action-pill.black.auth-submit:hover{background:var(--primary-hover)}}.action-pill.black.auth-submit:active{background:var(--primary-pressed)}
.duplicate-action{display:flex;justify-content:center;align-items:center;gap:7px;width:100%;border-radius:13px;background:#f4f7fa;color:var(--text-secondary);font-size:11px;font-weight:500;padding:12px;margin-top:12px}.duplicate-action svg{width:15px;height:15px}@media(hover:hover) and (pointer:fine){.duplicate-action:hover{background:#ebf4fc;color:#0087df}}.duplicate-preview{display:flex;align-items:center;gap:12px;margin:27px 0;padding:17px 0}.duplicate-preview>div{flex:1;min-width:0}.duplicate-preview b{display:block;font-size:13px;font-weight:600;overflow-wrap:anywhere}.duplicate-preview small{display:block;color:var(--text-secondary);font-size:10px;margin-top:5px}.duplicate-preview strong{font-size:15px;font-weight:600;white-space:nowrap}.duplicate-date{padding:15px;background:#f6f6f2;border-radius:13px;display:flex;justify-content:space-between;gap:10px;align-items:center}.duplicate-date>span{display:flex;align-items:center;gap:7px;color:var(--text-secondary);font-size:11px}.duplicate-date svg{width:15px;height:15px}.duplicate-date b{font-size:12px;font-weight:500;text-align:right}.recurring-hint{color:var(--text-secondary);font-size:10px;text-align:center;line-height:1.6;margin:15px 0 0}

/* Frequency-aware motion. Hover feedback never changes list geometry. */
#content,#content.slide-left,#content.slide-right{animation:none}
@keyframes success-in{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
html[data-input=keyboard] *,html[data-input=keyboard] *::before,html[data-input=keyboard] *::after{animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){
 button:active,.pocket:active,.pocket:hover{transform:none!important}
 #toast{transform:translateX(-50%);transition:opacity 100ms ease-out!important}
 #toast.visible{transform:translateX(-50%)}
}

/* Shared interaction system — emil-design-eng. Wallet hues stay semantic. */
:root{--text-secondary:#71736b;--surface:#f5f5f1;--surface-hover:#eeeee8;--focus:#0076d9;--danger:#c53650;--ease-in-out:cubic-bezier(.77,0,.175,1)}
body{line-height:1.45}
button{touch-action:manipulation}
button:disabled{cursor:not-allowed;transform:none!important}
button:focus-visible,a:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
#content:focus{outline:none}
.numeric,.big-balance,.tx-value,.pocket-amount,.mini-pocket strong,.review-line b,.duplicate-preview strong{font-variant-numeric:tabular-nums}
.big-balance{line-height:1.15;font-size:clamp(38px,4.5vw,54px)}
.big-balance.long-amount,.view-balance .big-balance.long-amount{font-size:clamp(26px,3vw,37px);letter-spacing:-1.3px}
.big-balance.long-amount em{font-size:.65em}
.balance-label,.balance-status,.wallet-heading>span,.account-line,.text-button,.day-label,.aside-note,.view-heading p{font-size:12px}
.tx-copy b{font-size:14px;line-height:1.35}
.tx-copy small,.tx-value small,.next-up .tx-copy small{font-size:12px;line-height:1.4}
.tx-value{font-size:13px}
.transaction{min-height:64px}
.next-up .transaction{min-height:58px}
.next-up .tx-copy b,.next-up .tx-value{font-size:13px}
.pocket small{font-size:11px;color:inherit;opacity:.85}
.pocket .pocket-amount{font-size:14px;color:inherit;opacity:1}
.pocket b{font-size:15px}
.pocket.green,.pocket.blue,.pocket.orange,.pocket.purple{color:#fff}
.pocket.purple small,.pocket.purple .pocket-amount{color:white;opacity:1}
.pocket-icon,.pocket-dot{color:white}
.pocket-dot{opacity:.8}
.mini-pocket{color:#fff}
.mini-pocket.purple{color:white}
.mini-pocket small{font-size:11px;color:inherit;opacity:.9}
.mini-pocket strong{font-size:26px}
.mini-pocket b{font-size:15px}
.view-heading h1{line-height:1.2;text-wrap:balance}
.view-heading p{line-height:1.6;max-width:35ch}
.view-heading{gap:16px;align-items:flex-start}
.month-control{flex-shrink:0;gap:2px}
.month-control button{width:32px;height:32px}
.month-control .month-button{min-height:32px;padding:0 5px}
.month-control span{font-size:12px;min-width:87px}
.text-button{min-height:32px}
.icon-button,.profile-button{width:36px;height:36px;flex-shrink:0}
.avatar-disc{width:36px;height:36px}
.dock,.segmented,.auth-tabs,.mini-tabs{position:relative;isolation:isolate}
.selection-indicator{position:absolute;left:0;top:0;z-index:-1;background:white;border-radius:10px;box-shadow:0 1px 3px #2020200a;pointer-events:none;transform-origin:0 0}
.dock .selection-indicator{border-radius:17px;box-shadow:0 1px 5px #20202008}
.dock button{min-height:40px;padding:8px 12px;border-radius:17px;color:var(--text-secondary)}
.dock{gap:8px;padding:6px;border-radius:26px}
.dock button.active:after{display:none}
.dock button span{font-size:12px}
.segmented button,.auth-tabs button{min-height:38px;font-size:12px;color:var(--text-secondary)}
.segmented button.active,.auth-tabs button.active{background:transparent;box-shadow:none}
.mini-tabs{gap:2px;background:var(--surface);padding:3px;border-radius:12px}
.mini-tabs button{padding:7px 12px;min-height:34px;font-size:13px;border-radius:9px;color:var(--text-secondary)}
.mini-tabs .selection-indicator{border-radius:9px}
.search-box:focus-within,.field:focus-within,.field:has(.field-trigger):focus-within{box-shadow:0 0 0 2px #86c7ff}
.search-box input,.field>input,.field-trigger{font-size:14px;min-height:48px}
.search-box input{padding:14px 0}
.field{border-radius:14px;min-height:48px;gap:12px}
.field>span{font-size:12px;color:var(--text-secondary)}
.field-trigger{padding:13px 0;line-height:1.5}
.field-trigger>svg{color:var(--text-secondary)}
.input-guidance,.auth-field .input-guidance{font-size:12px;line-height:1.5;margin-bottom:4px}
.input-hint{color:var(--text-secondary)}
.input-error,.field-error,.danger-link{color:var(--danger)}
.input-error{display:flex;gap:6px;align-items:flex-start}
.input-error:before{content:'!';display:inline-grid;place-items:center;flex-shrink:0;width:14px;height:14px;border:1px solid currentColor;border-radius:50%;font-size:10px;font-weight:600;margin-top:2px}
.auth-field{font-size:12px;color:var(--text-secondary);margin:18px 0}
.auth-field>input,.password-wrap{border-radius:14px}
.auth-field>input,.password-wrap input{font-size:15px}
.auth-field>input::placeholder,.password-wrap input::placeholder,.search-box input::placeholder,.field>input::placeholder{color:#808178}
.password-wrap button{width:36px;height:40px;padding:8px;flex-shrink:0;color:var(--text-secondary)}
.password-wrap svg{width:19px;height:19px}
.classic-login>p,.login-foot,.reset-to{font-size:13px;line-height:1.65}
.classic-login{margin-top:28px;max-width:380px}
.switch-account{font-size:13px;min-height:40px;padding:8px 12px;border-radius:10px}
.auth-notice{color:#775b16;font-size:12px}
.tray-heading .icon-button{height:36px;width:36px}
.tray-heading .icon-button svg{height:16px;width:16px}
.tray-heading{gap:12px;margin-bottom:20px}
.tray-heading h2{font-size:16px;line-height:1.3}
.tray-caption,.recurring-hint,.duplicate-preview small,.duplicate-date>span,.choice-row small{font-size:12px;line-height:1.6;color:var(--text-secondary)}
.choice-row{min-height:66px}
.choice-row b{font-size:14px}
.choice-row small{margin-top:3px}
.duplicate-action{font-size:13px;min-height:44px;border-radius:14px;color:#12659c;background:#eef6fd}
.duplicate-preview b{font-size:15px}
.duplicate-date b{font-size:13px}
.danger-link{font-size:12px;min-height:40px;margin-top:10px;padding:8px 12px;border-radius:10px}
.delete-actions button{font-size:14px;min-height:48px;border-radius:16px}
.delete-actions button.danger{background:#d92d4c;color:#fff}
.review-line{font-size:14px;gap:20px;align-items:flex-start}
.review-line b{text-align:right;overflow-wrap:anywhere;min-width:0}
.review-title{overflow-wrap:anywhere}
.dark-tray .review-line>span,.dark-tray .review-title small,.dark-tray .tray-caption{color:#aaa9a4}
.dark-tray .icon-button:focus-visible{outline-color:#8cd2ff}
.success-tray p{font-size:13px;color:var(--text-secondary)}
.select-menu{padding:5px;border-radius:17px;box-shadow:0 8px 30px #2020201a,0 0 0 1px #e9e9e2}
.select-menu [role=option]{font-size:14px;min-height:44px;padding:11px 12px;transition:background 100ms ease}
.select-menu [role=option][aria-selected=true]{background:#edf6ff;color:#0065ab}
.select-menu [role=option]:focus-visible{background:#edf6ff;outline:2px solid #86c7ff;outline-offset:-2px}
.select-menu.opens-up{animation-name:menu-up}
@keyframes menu-up{from{opacity:0;transform:translateY(3px) scale(.98)}to{opacity:1;transform:none}}
.calendar-heading{margin-bottom:20px}
.calendar-period{font-size:15px;min-height:40px;padding:6px 10px;border-radius:12px}
.calendar-week{font-size:12px;color:var(--text-secondary)}
.calendar-grid button{font-size:14px;height:40px;max-width:42px}
.calendar-grid button.today:not(.selected){box-shadow:inset 0 0 0 1px #d9d9d0;color:#0066ad;font-weight:600}
.calendar-grid button.selected{background:#202020;color:white}
.calendar-help{font-size:11px;color:var(--text-secondary);text-align:center;line-height:1.5;margin:15px 0 0}
.calendar-shortcuts{margin-top:16px}
.calendar-shortcuts button{font-size:12px;min-height:40px}
.month-picker button{font-size:14px;min-height:46px}
.month-picker button.selected{background:#e7f3ff;color:#0065ab;font-weight:600;box-shadow:inset 0 0 0 1px #c2e2ff}
.account-hero p,.account-summary small,.signed-in small{font-size:12px;color:var(--text-secondary)}
.session-badge{font-size:11px;color:#14704e}
.setting-row small,.plain-card p{font-size:13px;line-height:1.7}
.setting-row b,.plain-card h2{font-size:15px}
.setting-row{gap:12px;align-items:flex-start}
.setting-row>button{font-size:12px;min-height:40px;flex-shrink:0}
.empty{font-size:13px;line-height:1.7;color:var(--text-secondary)}
.empty strong{font-size:16px}
#toast{display:flex;align-items:center;gap:12px;font-size:13px;line-height:1.5;padding:10px 12px 10px 18px;border-radius:18px;max-width:calc(100vw - 32px);box-shadow:0 6px 24px #20202020;text-align:left;letter-spacing:-.2px}
#toast[popover]{inset:auto auto max(24px,env(safe-area-inset-bottom)) 50%;margin:0;border:0;color:white}
#toast>span{flex:1;min-width:0}
.toast-action{color:#bce4ff;font-size:13px;font-weight:600;padding:8px 6px;min-height:36px;white-space:nowrap}
.toast-close{display:grid;place-items:center;flex-shrink:0;width:32px;height:36px;color:#c3c4bc;border-radius:10px}
.toast-close svg{width:16px;height:16px}
#toast button:focus-visible{outline-color:#8cd2ff;outline-offset:0}
#toast:not(.visible){pointer-events:none}
.loading-view>svg,.sync-indicator.saving svg{animation-duration:900ms}
@media(hover:hover) and (pointer:fine){
 .dock button:not(.active):hover,.mini-tabs button:not(.selected):hover,.segmented button:not(.active):hover{color:var(--ink)}
 .calendar-period:hover,.calendar-shortcuts button:hover,.month-picker button:not(.selected):hover{background:var(--surface-hover)}
 .danger-link:hover{background:#fff0f3}
 .toast-close:hover{background:#ffffff18;color:white}
}
@media(max-width:700px){
 .app-shell{padding-left:20px;padding-right:20px;padding-bottom:calc(112px + env(safe-area-inset-bottom))}
 .top-right{gap:8px}
 .big-balance{font-size:clamp(38px,12vw,52px)}
 .big-balance.long-amount,.view-balance .big-balance.long-amount{font-size:clamp(25px,8vw,34px)}
 .view-heading{display:block;margin-bottom:24px}
 .view-heading .month-control{margin-top:14px;justify-content:flex-start;width:max-content}
 .view-heading h1{font-size:28px}
 .view-heading p{font-size:12px;margin-bottom:0}
 .view-balance .big-balance{font-size:42px}
 .month-control span{font-size:12px}
 .segmented{overflow-x:auto;flex-wrap:nowrap;justify-content:initial;gap:2px;scrollbar-width:none;max-width:100%}
 .segmented button{flex:1;font-size:11px;padding:8px;white-space:nowrap}
 .dock{position:fixed;left:50%;transform:translateX(-50%);z-index:4;margin:0;bottom:calc(12px + env(safe-area-inset-bottom));gap:10px;padding:6px 10px}
 .dock button{width:44px;min-height:44px;justify-content:center;padding:10px}
 .floating-add{bottom:calc(96px + env(safe-area-inset-bottom));height:48px;width:48px;right:20px}
 .setting-row{flex-wrap:wrap}
 .setting-row>div{min-width:calc(100% - 40px)}
 .setting-row>button{margin-left:34px}
 .pocket small{right:13px;font-size:11px}
 .pocket b{font-size:14px}.pocket .pocket-amount{font-size:13px}
 .plain-card{padding:22px}
 .account-line{gap:8px}
 .account-title{font-size:13px;gap:6px}
 .account-title>span{display:none}
 .aside-note{font-size:11px}
 .mini-pocket{padding:17px}.mini-pocket small{font-size:10px;right:12px}
 .mini-pocket strong{font-size:24px}
 dialog{bottom:max(12px,env(safe-area-inset-bottom));max-height:calc(100dvh - 24px);padding:9px 20px 20px;overflow-y:auto;scroll-padding:16px}
 dialog:has(.select-menu:not([hidden])){overflow-y:auto}
 .select-menu{position:relative;inset:auto!important;max-height:190px!important;margin:0 0 12px;box-shadow:inset 0 0 0 1px #e7e7df;background:#fbfbf8}
 .select-menu.opens-up{transform-origin:top center;animation-name:menu-in}
 .calendar-help{display:none}
 #toast[popover]{bottom:calc(96px + env(safe-area-inset-bottom))}
 #toast{gap:7px;font-size:12px;max-width:calc(100vw - 24px)}
 .classic-login{margin-top:18px}
 .classic-login h1{font-size:30px}
 .classic-login>p{font-size:13px}
}
@media(pointer:coarse){
 .icon-button,.profile-button,.tray-heading .icon-button,.password-wrap button{min-width:44px;min-height:44px}
 .month-control button{min-width:36px;min-height:44px}.month-control .month-button{min-width:88px}
 .calendar-grid button{min-height:42px}
 .avatar-color{width:40px;height:40px}
 .field>input,.search-box input,.auth-field>input,.password-wrap input{font-size:16px}
 .amount-entry input{font-size:clamp(40px,13vw,53px)}
}
@media(prefers-reduced-motion:reduce){
 .money{transition:filter 100ms ease!important}
 .selection-indicator{transition:opacity 90ms ease!important}
 button{transition:background-color 100ms ease,color 100ms ease!important}
}

/* Navigation stays within reach while long lists scroll. */
@media(min-width:701px){
 .app-shell{padding-bottom:118px}
 .app-header{height:98px}
 .workspace{padding-top:18px}
 .wallet-heading{margin-top:29px}
 .dock{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:4;margin:0}
}

.tray-feedback{font-size:13px;line-height:1.6;padding:13px 15px;margin:20px 0 0;border-radius:14px;background:#fff1f3;color:#a22c43;text-align:left}
.dark-tray .tray-feedback{color:#ffc2cf;background:#391b23}
dialog>#toast[popover]{top:max(16px,env(safe-area-inset-top));bottom:auto}

/* Decorative Solar alert mark, kept out of accessible field descriptions. */
.input-error:before{content:"";border:0;background:url("alert.svg") center/contain no-repeat;width:15px;height:15px}

/* Drawer insets and rhythm: grip, header, fields, then one primary action. */
dialog{padding:4px 24px 24px;overscroll-behavior:contain}
.tray-grip{display:grid;place-items:center;height:24px;margin:0 -12px 4px;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none}
.tray-handle{display:block;width:36px;height:4px;margin:0;border-radius:4px;background:#deded6}
.tray-heading{min-height:40px;gap:10px;margin:0 0 20px;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}
.tray-heading h2{min-width:0}
.tray-heading .icon-button{padding:0;width:36px;height:36px;flex-shrink:0;display:grid;place-items:center}
.tray-heading>svg{flex-shrink:0}
.tray-heading .entry-menu-wrap{flex-shrink:0}
#entry-form .amount-entry{margin:12px 0 4px}
#entry-form>.amount-entry+.input-guidance{margin:0 0 24px;padding:0;text-align:center}
#entry-form .field,#profile-form .field,#calendar-month-form .field{margin-bottom:12px;min-height:52px;padding:0 14px}
#entry-form .field:has(+.input-guidance),#profile-form .field:has(+.input-guidance),#calendar-month-form .field:has(+.input-guidance){margin-bottom:0}
#entry-form>.input-guidance,#profile-form>.input-guidance,#calendar-month-form>.input-guidance{margin:6px 2px 16px;padding:0}
.field>input,.field-trigger{min-height:52px;padding-top:14px;padding-bottom:14px}
#entry-form>.submit-pill{margin-top:20px}
#entry-form>.field:last-of-type{margin-bottom:0}
.recurring-hint{margin:16px 4px 0}
.tray-caption{margin-left:0;margin-right:0}
.duplicate-preview{margin:24px 0;padding:8px 0}
.duplicate-date{padding:16px}
.review-line{margin:20px 0}
.pocket,.mini-pocket{color:#fff}
.pocket small,.pocket .pocket-amount,.mini-pocket small{color:inherit;opacity:1}
.pocket small,.mini-pocket small{opacity:.85}
.pocket{padding:18px}.pocket small{top:18px;right:18px}.pocket-dot{right:18px;bottom:18px}
.mini-pocket{padding:20px}
.entry-menu-wrap{position:relative;display:flex;align-items:center}
.entry-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:12;width:224px;max-width:calc(100vw - 72px);padding:5px;background:#fff;color:#202020;border:1px solid #eeeee8;border-radius:16px;box-shadow:0 8px 28px #20202020;transform-origin:top right;animation:menu-in 150ms var(--motion-ease);cursor:default}
.entry-menu [role=menuitem]{display:flex;gap:10px;align-items:center;width:100%;min-height:44px;padding:11px 12px;border-radius:11px;text-align:left;font-size:12px;line-height:1.5}
.entry-menu svg{width:17px;height:17px;stroke-width:1.8}
.entry-menu .menu-danger{color:var(--danger)}
.entry-menu [role=menuitem]:focus-visible{background:#eef6ff;outline:none}
.entry-menu .menu-danger:focus-visible{background:#fff0f3}
@media(hover:hover) and (pointer:fine){.entry-menu [role=menuitem]:hover{background:#f4f4ef}.entry-menu .menu-danger:hover{background:#fff0f3}}
dialog.is-dragging{user-select:none;-webkit-user-select:none;cursor:grabbing}
dialog.is-dragging .tray-grip,dialog.is-dragging .tray-heading{cursor:grabbing}
dialog.is-dragging #tray-content{pointer-events:none}
dialog::backdrop{opacity:var(--tray-backdrop,1)}
@media(max-width:700px){
 dialog{padding:4px 20px 20px}
 .pocket{padding:17px}.pocket small{top:17px;right:17px}.pocket-dot{right:17px;bottom:17px}.mini-pocket{padding:18px}
 .tray-heading{gap:8px;margin-bottom:18px}
 .tray-heading h2{font-size:15px}
 #entry-form .amount-entry{margin-top:8px}
 #entry-form>.amount-entry+.input-guidance{margin-bottom:22px}
 .entry-menu{right:-4px}
}
@media(pointer:coarse){.tray-heading .icon-button{min-width:44px;min-height:44px}.entry-menu [role=menuitem]{min-height:48px}}

.entry-period{font-size:12px;line-height:1.6;color:var(--text-secondary);margin:14px 2px 0}
.success-secondary{display:flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:8px 12px;border-radius:12px;margin:8px auto 0;font-size:12px;color:var(--text-secondary)}
.success-secondary svg{width:15px;height:15px}
@media(hover:hover) and (pointer:fine){.success-secondary:hover{background:var(--surface);color:var(--ink)}}

.recurring-list{scroll-margin-top:24px}.recurring-list h2:focus{outline:none}

/* Page transitions leave the shell and floating controls outside the moving layer. */
html{scrollbar-gutter:stable}
body{font-synthesis:none}
.app-header{position:relative;z-index:5;background:#fff}
.page-view{position:relative;z-index:2;min-width:0;transform-origin:50% 20%}
.page-outgoing{position:fixed;z-index:1;overflow:hidden;pointer-events:none;user-select:none;contain:layout paint style}
.page-outgoing *{pointer-events:none!important}

/* The Popoche mark and the savings envelope share the app's rounded geometry. */
.brand svg{width:28px;height:30px;stroke:none;fill:currentColor}
.brand{gap:8px}
.pocket.coral{grid-column:1/-1;background:#ff5d8f;min-height:112px}
.token.coral{background:#f8558c}
.pocket.coral .pocket-icon svg{width:29px;height:29px;stroke-width:2}
.saving-guidance{font-size:12px;line-height:1.6;color:var(--text-secondary);padding:13px 15px;border-radius:14px;background:#fff3f7;margin:16px 0 18px}
#entry-form .saving-guidance{margin:14px 0 0}
.saving-summary .text-button{margin-top:12px;color:#b43060;font-weight:600}
@media(max-width:700px){.brand svg{width:25px;height:28px}.pocket.coral{min-height:112px}.segmented{scroll-padding-inline:4px}}

.design-credit{margin:32px 0 0;color:var(--muted);font-size:11px;line-height:1.7;text-align:center}.design-credit a{color:inherit;text-decoration:underline;text-underline-offset:3px}.design-credit a:hover{color:var(--ink)}

/* Keep the inset arrows legible in compact navigation controls. */
svg:has(>use[href="#icon-chevron"]),svg:has(>use[href="#icon-back"]),svg:has(>use[href="#icon-expand"]){min-width:18px;min-height:18px}