/* Stitch mobile compositions. Shared controls remain native and accessible. */
:root { --money-in:#00714d; --money-out:#a10f1d; }
body {font-size:14px;line-height:1.5;background:#f9f9f6}
h4 {font-size:20px} h5 {font-size:18px;font-weight:600} h6 {font-size:16px} h4,h5,h6 {margin-bottom:0}
.main {max-width:430px;padding:0 16px calc(120px + env(safe-area-inset-bottom))}
.card {border-color:#e5eeee;border-radius:20px;box-shadow:0 4px 20px -2px rgb(13 110 110 / 4%);gap:12px;padding:18px}
.stack-lg {gap:22px}.stack {gap:20px}.stack-sm {gap:12px}
.stitch-header {height:62px;margin:0 -16px 18px;padding:8px 16px;display:flex;align-items:center;gap:12px;border-bottom:1px solid #e9eeee;background:#f9f9f6;position:relative;z-index:5}
.header-titles {flex:1;min-width:0;display:flex;flex-direction:column}.header-titles strong{font-size:16px;line-height:1.25;color:#005454;font-weight:700}.header-titles>span {font-size:11px;line-height:1.6}.has-back .header-titles strong,.no-dock .header-titles strong {color:var(--color-text)}
.header-button {display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;background:none;border:0;color:#005454;cursor:pointer;width:32px;min-height:40px;padding:4px;text-decoration:none;border-radius:50%;font-size:24px}
.header-button .ic {width:21px;height:21px}.header-button:focus-visible{outline:2px solid #0d6e6e}
.ic {width:20px;height:20px;vertical-align:middle;flex-shrink:0}.header-titles .status-dot{width:7px;height:7px}
.avatar {width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;background:#d7f7eb;color:#005454;flex-shrink:0;border-radius:50%;position:relative;overflow:hidden;font-weight:700;font-size:13px;border:2px solid #fff}.avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.avatar:nth-child(even){background:#9dedec}.avatar-lg{width:64px;height:64px;font-size:22px;border:2px solid #005454}.avatar-group{display:inline-flex;align-items:center;text-decoration:none;flex-shrink:0}.avatar-group .avatar+.avatar{margin-left:-12px}.hero-message .avatar{width:28px;height:28px;font-size:11px}
.status-dot {width:7px;height:7px;display:inline-block;border-radius:50%;background:#00714d;vertical-align:middle;flex-shrink:0}.offline .status-dot{background:#d47a00}.offline [data-connection-label]{color:#9a4c00}
.tag{font-size:10px;gap:5px;padding:3px 8px;font-weight:500}.tag .ic{width:15px;height:15px}.card-kicker{font-size:10px;font-weight:500;letter-spacing:.03em}
.sec-head {display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px;flex-wrap:nowrap}.sec-head>h5,.sec-head>h4{flex:1}.sec-head>a{font-size:12px}.card .sec-head{margin:0}.row-main{min-width:0;flex:1;display:flex;flex-direction:column;gap:2px}.title-with-badge{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.title-with-badge strong{font-size:14px}.right{text-align:right;display:flex;flex-direction:column}.center{text-align:center}.small{font-size:12px}.tiny{font-size:10px}
.balance-hero {padding:22px 24px;background:linear-gradient(120deg,#0d6e6e,#005454);border-radius:20px;color:white;box-shadow:0 8px 22px rgb(13 110 110 / 17%);gap:14px;overflow:hidden}.balance-hero .big-figure{font:700 30px/1.25 var(--font-money);letter-spacing:-.04em;margin:0;word-break:normal;overflow-wrap:anywhere}.hero-label{font-size:12px;display:flex;gap:8px;align-items:center}.hero-label>span:first-child{flex:1}.hero-label .ic{width:15px;height:15px}.hero-badge{font-size:10px;line-height:1.2;font-weight:500;padding:4px 9px;background:rgb(255 255 255 / 17%);max-width:110px}.hero-stats {gap:8px;margin-top:0;padding-top:8px}.hero-stats>div{border-radius:16px;padding:10px;gap:8px}.hero-stats strong{font-size:12px;line-height:1.35;letter-spacing:-.03em}.hero-stats .ic{width:20px;height:20px}.hero-stats span{font-size:10px}.balance-hero .card-body{font-size:11px;line-height:1.4}.hero-message{display:flex;gap:12px;align-items:center;font-size:12px;border-top:1px solid rgb(255 255 255 / 15%);padding-top:16px;margin:0}.hero-message>.ic{padding:7px;width:34px;height:34px;background:white;color:#005454;border-radius:50%}.hero-message span{flex:1}.hero-message .avatar-group{flex:0}.balance-hero small{font-size:11px;font-weight:400}
.greet{display:flex;align-items:center;justify-content:space-between;gap:12px}.greet h4{font-size:13px;color:#005454;font-weight:600}.greet p{font-size:11px;margin:0}.greet .tag{font-size:10px;white-space:nowrap}
.quick {gap:10px}.quick a{padding:12px 4px;border-radius:20px;gap:6px;min-height:110px;font-size:12px;font-weight:500}.quick strong{font-weight:600}.quick small{font-size:10px}.q-ic {width:46px;height:46px}.q-ic .ic{width:23px;height:23px}.q-ic.t-neutral{background:#c9eeee}
.attention-card {display:flex;gap:12px;align-items:flex-start;border:1px solid #ffd36b;background:#fffbeb;border-radius:20px;padding:16px}.attention-content{flex:1;min-width:0}.attention-content .sec-head{gap:4px;margin-bottom:4px;flex-wrap:wrap}.attention-content .card-kicker{color:#9a4c00}.attention-content p{margin:0;font-size:12px}.attention-content>strong{font-family:var(--font-money);font-size:15px}.attention-card>.row-ic{width:42px;height:42px;border:1px solid #ffe4a3;color:#d47a00}.attention-actions {display:flex;align-items:center;gap:14px;margin-top:10px}.attention-actions .btn{background:#d77a00;color:white;border-radius:999px;min-height:30px;padding:5px 12px;font-size:11px}.attention-actions .linkish{font-size:10px;text-decoration:none;color:var(--color-text)}
.budget-overview .sec-head>.row-ic{width:30px;height:30px;border-radius:50%}.budget-overview .row-main h6{font-size:17px}.budget-pair{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.budget-pair>span,.budget-pair>strong{min-width:0}.budget-pair strong{font-weight:600}.soft-note{display:flex;align-items:center;gap:10px;margin:0;background:#f4f5f2;border:1px solid #e1e9e6;border-radius:12px;padding:12px;font-size:12px;line-height:1.55}.soft-note>.ic{color:#005454;flex-shrink:0}.soft-note small{display:block;font-size:11px;line-height:1.45}.soft-note strong{font-weight:600}.budget-overview .soft-note{font-size:11px}
progress {appearance:none;width:100%;height:9px;border:0;border-radius:999px;overflow:hidden;display:block;background:#eeeeeb}progress::-webkit-progress-bar{background:#eeeeeb;border-radius:999px}progress::-webkit-progress-value{background:#00714d;border-radius:999px}progress::-moz-progress-bar{background:#00714d;border-radius:999px}progress.warning::-webkit-progress-value{background:#d77a00}progress.over::-webkit-progress-value{background:#a10f1d}progress.warning::-moz-progress-bar{background:#d77a00}progress.over::-moz-progress-bar{background:#a10f1d}.balance-hero progress::-webkit-progress-value{background:#6cf8bb}.balance-hero progress::-moz-progress-bar{background:#6cf8bb}.balance-hero progress::-webkit-progress-bar{background:#003e3e}.money-warning{color:#ae5800}
.wallet-strip{gap:10px;margin-right:-16px;padding-right:16px}.card.mini{width:180px;gap:9px;border-radius:16px;padding:14px}.mini .sec-head{margin:0}.provider-mark{display:inline-flex;padding:5px 7px;border-radius:8px;background:#e4f4ff;color:#007bc4;font-size:10px;max-width:95px;overflow:hidden}.provider-mark .ic{width:17px;height:17px}.mini-name{font-size:11px;font-weight:400}.mini-amt{font-size:14px}.mini a{text-decoration:none}
.subscription-preview {padding:12px 14px;border-radius:18px;gap:10px}.service-mark{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:44px;height:44px;border-radius:14px;background:#fff0f0;color:#e40922;font-size:20px;font-weight:700}.subscription-preview .service-mark{width:40px;height:40px;font-size:18px}.subscription-preview strong{font-size:12px;font-weight:600}.subscription-preview .small,.subscription-preview small{font-size:10px}.subscription-preview .right{white-space:nowrap}
.recent-cards {display:flex;flex-direction:column;gap:8px}.recent-cards>.row {background:white;border:1px solid #edf0ee;border-radius:18px;box-shadow:none;padding:12px 14px}.rows{padding:0 14px;border-radius:18px}.stitch-tx-row {display:flex;align-items:center;flex-wrap:nowrap;gap:10px;padding:18px 0;min-width:0}.stitch-tx-row .row-ic{width:42px;height:42px;border-radius:14px}.row-title{font-size:12px;font-weight:600;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.row-sub{font-size:11px;line-height:1.45}.row-byline {display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:3px}.recorded-by{display:inline-flex;align-items:center;gap:4px;font-size:9px;padding:2px 6px;font-weight:500;background:#dbfff0;color:#005454}.row-amount{display:flex;align-items:flex-end;flex-direction:column;gap:3px;flex-shrink:0;max-width:44%;text-align:right}.row-amount strong{font-size:13px;font-weight:600;max-width:100%;font-family:var(--font-money)}.row-amount small{font-size:9px}.row-amt {white-space:normal;overflow-wrap:anywhere}.recent-cards .row-sub{font-size:10px}
.tabbar{max-width:430px;left:50%;transform:translateX(-50%);right:auto;width:100%;z-index:20;padding:8px 12px max(10px,env(safe-area-inset-bottom));border-radius:24px 24px 0 0;min-height:78px;background:#fff;box-shadow:0 -5px 24px rgb(13 110 110 / 5%)}.tabbar>a{font-size:10px;gap:5px;min-height:50px}.tabbar a .ic{width:21px;height:21px}.catat-trigger{display:flex;flex-direction:column;align-items:center;gap:3px;border:0;background:none;color:#005454;font:500 10px var(--font-body);cursor:pointer;padding:0;margin-top:-25px}.catat-icon{width:58px;height:58px;border:2px solid white;background:#0d6e6e;box-shadow:0 5px 16px rgb(13 110 110 / 25%)}.catat-icon .ic{width:26px;height:26px}.no-dock .tabbar{display:none}.has-back .main,.no-dock .main{padding-bottom:120px}.page-head{align-items:flex-start;gap:10px;flex-wrap:nowrap}.page-head .btn{min-height:38px;font-size:12px;padding:9px 14px}.period-pill{margin-top:6px;display:inline-flex;align-items:center;gap:6px;background:#f4f5f2;border:1px solid #e1e9e6;border-radius:999px;padding:4px 10px}.period-pill input{border:0;background:none;max-width:145px;font-size:12px;color:#005454;font-weight:600}.budget-hero{padding:22px}.budget-hero progress{margin-top:10px}.budget-hero .big-figure{font-size:31px;margin:0}.budget-hero .hero-label .hero-badge{width:90px;line-height:1.5}.budget-hero .budget-pair{font-size:11px}.budget-hero .hero-message{font-size:11px}
.filter-pills {display:flex;align-items:center;gap:8px;overflow:auto;scrollbar-width:none;margin-right:-16px;padding-right:16px}.filter-pills::-webkit-scrollbar{display:none}.filter-pills button{white-space:nowrap;border:1px solid #e0e8e5;background:white;border-radius:999px;padding:8px 14px;min-height:36px;color:var(--color-text);cursor:pointer;font-size:12px;flex-shrink:0}.filter-pills button.active{background:#e8f5f1;border-color:#8db9b7;color:#005454}.budget-item{padding:16px;gap:12px}.budget-item-head{display:flex;align-items:center;gap:9px;flex-wrap:nowrap}.budget-item-head>.row-ic{width:40px;height:40px;border-radius:14px}.budget-item-head .row-main{flex:1}.budget-item-head .header-button{width:24px}.budget-item .small{font-size:11px}.budget-item .budget-pair{font-size:12px}.budget-over{border-color:#efb9bc;background:white}.budget-item .soft-note{font-size:11px}.collaboration-note{border-radius:16px}.collaboration-note small{display:block}
.bottom-sheet {border:0;border-radius:24px 24px 0 0;box-shadow:0 -12px 32px rgb(13 110 110 / 15%);padding:16px 20px 24px;background:white;width:min(100%,430px);max-width:100%;max-height:90dvh;margin:auto auto 0;overflow:auto;color:var(--color-text)}.bottom-sheet::backdrop{background:rgb(15 23 42 / 30%);backdrop-filter:blur(8px)}.bottom-sheet[open]{animation:sheet-in .2s ease-out}.bottom-sheet>form{margin-top:16px}.bottom-sheet>.btn{margin-top:12px}.sheet-handle{height:4px;width:40px;border-radius:99px;background:#d6e1dd;margin:0 auto 18px}.bottom-sheet iframe{width:100%;height:70dvh;border:0}.in-sheet .sidebar,.in-sheet .stitch-header,.in-sheet .tabbar{display:none}.in-sheet .main{padding-top:0;max-width:430px;margin:auto}.in-sheet .sticky-actions{max-width:430px}.in-sheet .shell{display:block}.in-sheet .seg{margin-top:0}.toast{position:fixed;z-index:100;bottom:110px;left:50%;transform:translateX(-50%);width:max-content;max-width:90vw;background:#005454;color:white;border-radius:12px;padding:12px 18px;font-size:12px;box-shadow:var(--shadow-md)}
.sticky-actions{position:fixed;z-index:15;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,430px);padding:16px 16px max(16px,env(safe-area-inset-bottom));background:rgb(255 255 255 / 98%);border-top:1px solid #edf0ee;display:flex;gap:14px;box-sizing:border-box}.sticky-actions .btn{min-height:52px;border-radius:16px;font-size:15px;margin:0;width:100%;font-weight:700;letter-spacing:-.015em}.save-footer{display:block}.footer-summary{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:11px;margin-bottom:10px}.footer-summary>.m-in{font-size:10px}.btn-danger{background:#ffe8e6;color:#a10f1d}.detail-actions>*{flex:1}.detail-actions>.btn-primary{flex:1.8}.detail-actions .btn{font-weight:600}
.ledger-form{max-width:100%;gap:22px}.seg{margin-bottom:20px;background:#eeeeeb;padding:4px;display:grid;grid-template-columns:repeat(3,1fr);gap:0}.seg-opt{font-size:12px;padding:7px;text-decoration:none;font-weight:500}.amount-entry{padding:24px 20px;text-align:center;gap:16px;display:flex;flex-direction:column}.amount-entry label{font-size:10px;text-transform:uppercase;font-weight:500;letter-spacing:.06em;color:#596765}.amount-entry .input-affix{justify-content:center;border:0;background:none;gap:6px}.amount-entry .input-affix .input{font:700 34px/1.25 var(--font-money);letter-spacing:-.025em;background:none;border:0;padding:0;min-height:44px;width:150px;max-width:calc(100% - 40px);field-sizing:content;border-radius:0;flex:0 1 auto;min-width:80px}.amount-entry .affix{font-size:18px;align-self:center;padding:0;color:#005454}.amount-budget-state{color:#00714d;font-size:11px}.amount-budget-state .ic{width:15px;height:15px}.amount-shortcuts{display:flex;justify-content:center;gap:8px;border-top:1px solid #edf0ee;padding-top:12px}.amount-shortcuts button{border:0;border-radius:999px;background:#f4f4f1;padding:4px 9px;font-size:10px;cursor:pointer}.field>label,.field .sec-head>label{font-size:12px;font-weight:500;color:var(--color-text);margin:0 0 6px;display:block}.field .sec-head{margin-bottom:5px}.field .sec-head>label{margin:0}.field .sec-head>a{font-size:10px;color:#005454}.input{border:1px solid #e1e9e6;background:#fff;min-height:48px;font-size:14px;border-radius:12px;padding:12px}.wallet-picker{display:flex;align-items:center;position:relative;gap:12px;padding:16px;border:1px solid #e1e9e6;border-radius:18px;min-height:80px}.wallet-picker>.ic{padding:11px;width:45px;height:45px;background:#f4f5f2;border-radius:14px;color:#005454}.wallet-picker>div{flex:1;display:flex;flex-direction:column;min-width:0;gap:3px}.wallet-picker strong{font-size:14px}.wallet-picker select{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:1}.wallet-picker:focus-within{outline:2px solid #0d6e6e;outline-offset:2px}.wallet-picker>.ic:last-child{width:19px;height:19px;padding:0;background:none}.wallet-picker .small{font-size:11px}.wallet-picker [data-wallet-balance]{color:#00714d}
.chips.category-tiles{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.category-tiles .tag{padding:10px 3px;min-height:92px;background:#fff;border:1px solid #e2e9e7;border-radius:16px;display:flex;flex-direction:column;justify-content:flex-start;gap:6px;font-size:10px;line-height:1.35;color:#152b26}.category-icon{display:flex;align-items:center;justify-content:center;width:37px;height:37px;border-radius:50%;background:#fff0f0;color:#931a24}.category-tiles .chip:nth-child(3n) .category-icon{background:#f4f4f1;color:#005454}.category-tiles .chip:nth-child(4n) .category-icon{background:#fffbeb;color:#d77a00}.category-tiles .chip:has(input:checked)>.tag{border:2px solid #005454;background:#e8f5f1;padding:9px 2px}.category-tiles .chip:has(input:checked) .category-icon{background:#005454;color:white}.category-more{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;border:1px dashed #bacbc6;border-radius:16px;text-decoration:none;color:#596765;font-size:10px;min-height:92px;background:#f4f5f2}
.date-time-card{display:flex;flex-direction:row;align-items:center;gap:12px;padding:16px;min-height:72px}.date-display{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.date-display span:last-of-type{font-size:12px;font-weight:500}.date-display input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}.date-display:focus-within{outline:2px solid #0d6e6e;border-radius:4px}.date-display .small{font-size:10px}.time-input{background:#f4f5f2;border:0;border-radius:999px;max-width:94px;padding:7px;color:#005454;font-size:11px}.recorder-card p{font-size:11px;margin:0}.recorder-options{display:flex;gap:10px;flex-wrap:wrap}.recorder-options label{flex:1;min-width:125px;position:relative;display:flex;align-items:center;gap:8px;border:1px solid #e2e9e7;border-radius:999px;padding:7px 9px;font-size:12px;cursor:pointer}.recorder-options input{position:absolute;opacity:0}.recorder-options .avatar{width:27px;height:27px;font-size:10px}.recorder-options label>.ic{width:15px;height:15px;display:none}.recorder-options label:has(input:checked){background:#0d6e6e;border-color:#005454;color:#fff}.recorder-options label:has(input:checked)>.ic{display:block}.recorder-options label:has(input:focus-visible){outline:2px solid #0d6e6e;outline-offset:3px}.recorder-options strong{font-weight:600;flex:1}
.installment-card{background:#f9faf8;padding:0;overflow:hidden}.installment-card>.sec-head{padding:16px;border-bottom:1px solid #e9eeeb;gap:8px}.installment-card>.sec-head strong{font-size:12px;display:flex;gap:8px;align-items:center}.installment-fields{padding:16px;background:#fff}.installment-fields>label{font-size:11px;color:#596765;display:flex;gap:6px;flex-direction:column}.installment-duration{display:flex;align-items:center;gap:8px;background:#f4f5f2;border:1px solid #e1e9e6;border-radius:12px;padding:10px;color:#005454}.installment-duration input{width:44px;min-height:25px;padding:0;border:0;background:none;font-size:14px;font-weight:600}.installment-duration strong{margin-left:auto;font-size:11px}.installment-fields .soft-note{background:#dffff2;border-color:#a6ddc6;font-size:11px}.switch{position:relative;display:inline-flex;width:42px;height:25px;flex-shrink:0;cursor:pointer}.switch input{position:absolute;opacity:0;width:100%;height:100%}.switch>span{border-radius:999px;background:#d6dedb;width:100%;height:100%;border:1px solid #d6dedb;transition:background .15s}.switch>span:after{content:'';position:absolute;width:21px;height:21px;top:2px;left:2px;background:white;border-radius:50%;box-shadow:0 1px 3px #ccc;transition:transform .15s}.switch input:checked+span{background:#005454;border-color:#005454}.switch input:checked+span:after{transform:translateX(17px)}.switch input:focus-visible+span{outline:2px solid #0d6e6e;outline-offset:3px}.receipt-upload{display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;gap:5px;border:1px dashed #cbd9d4;border-radius:16px;padding:16px;cursor:pointer;color:#005454;text-align:center}.receipt-upload strong{font-size:12px}.receipt-upload small{font-size:10px}.receipt-upload input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.receipt-upload:focus-within{outline:2px solid #0d6e6e}
.transfer-pair{gap:0;padding:16px;background:linear-gradient(140deg,#fff,#effcf5)}.transfer-pair .wallet-picker{background:#f4f5f2;border-radius:14px;padding:14px}.transfer-pair .wallet-picker>.ic{background:white}.transfer-pair .wallet-picker strong{font-size:16px}.transfer-divider{position:relative;display:flex;justify-content:center;align-items:center;height:62px}.transfer-divider:before{content:'';position:absolute;width:65%;border-top:1px dashed #adc5bf}.transfer-divider span{z-index:1;display:flex;align-items:center;justify-content:center;background:#0d6e6e;color:white;width:40px;height:40px;border-radius:50%;font-size:27px;box-shadow:0 3px 5px #ccc}.transfer-amount{gap:10px}.transfer-amount>label{font-size:12px}.transfer-amount-line{display:flex;align-items:center;gap:7px;border-bottom:2px solid #8db9b7;padding-bottom:5px}.transfer-amount-line>span{font:700 25px var(--font-money)}.transfer-amount-line input{font:700 29px var(--font-money);padding:0;border:0;flex:1;min-width:0;background:none}.transfer-amount-line .tag{border:0;cursor:pointer;flex-shrink:0;font-size:11px}.conversion-card{gap:16px}.conversion-card .sec-head>strong{font-size:12px}.conversion-card>.sec-head{padding-bottom:12px;border-bottom:1px solid #edf0ee}.reference-rate{background:#f4f5f2;border-radius:12px;padding:12px;margin-bottom:16px}.rate-row{display:flex;gap:5px;align-items:center;font-size:13px;font-weight:600}.rate-row input{border:0;background:none;min-height:30px;padding:0;max-width:130px;flex:1;font:600 15px var(--font-money)}.reference-rate .small{font-size:10px}.received-amount{padding:12px;border:1px solid #bfd9d4;border-radius:12px;background:#f1f6f4}.received-amount>label{font-size:11px}.received-amount .input-affix{display:flex;gap:6px;border:0;background:none}.received-amount .input{background:none;border:0;padding:0;min-height:40px;font:700 28px var(--font-money);color:#005454;min-width:0}.received-amount [data-sym-to]{font:700 24px var(--font-money)}.transfer-fee{display:flex;gap:10px;align-items:center}.transfer-fee label{flex:1;font-size:11px}.transfer-fee input{width:100px;padding:6px;font-size:12px;min-height:32px;text-align:right}.mutation-summary{background:#eeeeeb}.mutation-summary .budget-pair{font-size:11px}.mutation-summary .small{font-size:10px;border-top:1px solid #dde5e0;padding-top:12px;margin:0}
.detail-head{background:linear-gradient(135deg,#fff 45%,#fff4f3,#effffc);padding:30px 20px;gap:20px;text-align:center;align-items:center;border:0;border-radius:28px}.detail-ic{width:90px;height:90px;border-radius:50%;background:#ffdad8}.detail-ic .ic{width:44px;height:44px}.detail-head .big-figure{font-size:36px;letter-spacing:-.035em}.detail-head h3{font-size:23px}.detail-head .tag{font-size:12px}.detail-information{margin-top:14px;gap:0}.information-row{display:flex;align-items:center;gap:12px;padding:16px 0;border-bottom:1px solid #edf0ee}.information-row:first-child{padding-top:0}.information-row .row-ic{width:42px;height:42px;background:#eeeeeb}.information-row .row-main>span{font-size:11px}.information-row strong{font-size:14px;color:#005454}.information-row .right{max-width:40%}.detail-note{margin-top:16px;font-size:12px}.detail-note p{padding:16px;background:#f4f5f2;border-radius:12px;margin:10px 0 0;line-height:1.7}.detail-information>.budget-pair{padding-top:12px;font-size:12px}.recorder-profile{display:flex;flex-direction:row;align-items:center;gap:10px;padding:16px}.recorder-profile>.avatar{width:50px;height:50px;font-size:17px}.recorder-profile .btn{font-size:10px;padding:8px 10px;min-height:34px;border-radius:999px}.recorder-profile strong{font-size:15px}.budget-status{background:#f4f5f2}.budget-status .budget-pair{font-size:12px}.budget-status p{margin:0}
.wallet-total .hero-label{justify-content:flex-start}.wallet-total-line{display:flex;align-items:center;gap:8px}.wallet-total-line .big-figure{font-size:26px;flex:1}.wallet-total-line .btn{border-radius:999px;background:white;color:#005454;font-size:10px;padding:10px;min-height:50px;width:78px;line-height:1.4;flex-shrink:0}.wallet-total .hero-stats{grid-template-columns:1fr 1fr}.wallet-total .hero-stats>div{background:none;padding:6px 0}.wallet-total .hero-stats>div:last-child{border-radius:99px;background:#004f50;padding:8px}.wallet-total .hero-stats strong{font-size:11px}.wallet-total .hero-stats span{font-size:9px}.account-wallet{gap:10px;padding:14px}.wallet-top{display:flex;gap:10px;align-items:center}.wallet-top .row-ic{border-radius:12px;border:1px solid #d1e9e0;width:40px;height:40px}.wallet-icon-bank{background:#edf2ff;color:#174aca}.wallet-icon-cash{background:#fffbeb;color:#d47a00}.wallet-icon-ewallet{background:#effff7;color:#00714d}.wallet-icon-broker{background:#faf0ff;color:#7135cb}.wallet-top .small{font-size:10px}.wallet-top .header-button{width:20px}.wallet-balance-line{display:flex;align-items:center;justify-content:space-between;gap:10px}.wallet-balance-line>div{display:flex;flex-direction:column}.wallet-balance-line strong{font:600 19px var(--font-money)}.primary-wallet .wallet-balance-line{border-top:1px solid #edf0ee;padding-top:12px}.primary-wallet .wallet-balance-line strong{font-size:25px;color:#005454}.wallet-balance-line .btn{font-size:11px;padding:8px 12px;width:112px}.wallet-balance-line small{font-size:10px}.credit-account{padding:16px;gap:16px}.physical-card{background:linear-gradient(135deg,#17253f,#0b1425);color:#fff;border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:6px;text-decoration:none;box-shadow:0 3px 8px #ccc}.physical-card>.card-kicker{color:#a9bacd;font-size:9px}.physical-card>strong{font-size:16px}.card-number{display:flex;align-items:center;gap:9px;font-family:var(--font-money);font-size:14px;letter-spacing:.08em;margin:6px 0}.card-chip{width:30px;height:22px;border-radius:4px;background:linear-gradient(135deg,#e8c35a,#bc8b17)}.physical-card .budget-pair{font-size:10px;align-items:flex-start}.physical-card small{display:block;font-size:8px;color:#a9bacd}.physical-card b{display:block;font-weight:500;font-size:10px}.credit-bill{background:#fff4f3;border:1px solid #ffd2d0;padding:12px;border-radius:16px;color:#a10f1d;display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:10px}.credit-bill strong{display:block;font:600 24px var(--font-money)}.credit-bill .tag{background:#a10f1d;color:#fff;max-width:115px;text-align:center;line-height:1.4;font-size:9px}.credit-bill small{font-size:9px;margin-top:4px}.credit-account .small{font-size:10px}.credit-account .soft-note{justify-content:space-between;font-size:11px}.credit-account .btn{font-size:14px;min-height:48px}.wallet-total+.filter-pills{margin-top:0}
/* Compact recurring bills, with the due date and payment action on one row. */
.subscription-page{gap:16px;padding-bottom:72px}.subscription-page .subscription-total{padding:14px;border-radius:16px;gap:8px}.subscription-total .hero-label{font-size:12px}.subscription-total .hero-badge{font-size:11px;padding:3px 8px}.subscription-total-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.subscription-total .big-figure{font-size:24px;margin:0;line-height:1.4;overflow-wrap:anywhere}.subscription-total .big-figure small{font-size:12px;font-weight:400}.subscription-family{display:flex;align-items:center;gap:6px;font-size:11px;color:#ffffffdf}.subscription-family .avatar{width:18px;height:18px;font-size:9px;border-width:1px}.subscription-info{padding:14px;border-radius:12px;border:1px solid #0054541a;font-size:12px;align-items:flex-start;background:#f4f4f1}.subscription-info>.ic{width:28px;height:28px;padding:5px;border-radius:8px;background:#a0f0f099;color:#005454}.subscription-page .filter-pills button{font-size:12px;min-height:34px;padding:7px 16px}.subscription-grid{gap:14px}.subscription-page .subscription-item{border-radius:12px;padding:12px;gap:10px;border-color:#0054541a;box-shadow:0 2px 10px -2px rgb(13 110 110 / 4%)}.subscription-head{display:flex;align-items:center;gap:10px;min-width:0}.subscription-head .service-mark{width:36px;height:36px;border-radius:8px;flex-shrink:0;font-size:17px}.service-movie{background:#fff0f0;color:#a71923}.service-router{background:#fffbeb;color:#d97706}.service-music{background:#e8f5f1;color:#006c49}.subscription-title{display:flex;align-items:center;gap:6px;min-width:0}.subscription-title strong{font-size:14px;line-height:1.3;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.subscription-title .tag{font-size:10px;padding:2px 6px;line-height:1.2;flex-shrink:0}.subscription-wallet{display:flex;align-items:center;gap:4px;font-size:12px;min-width:0;margin-top:2px}.subscription-wallet .ic{width:13px;height:13px;color:#005454}.subscription-wallet>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.subscription-amount{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;flex-wrap:nowrap;border:0;margin:0;padding:0;text-align:right;flex-shrink:0;max-width:38%;min-width:0;gap:2px}.subscription-amount strong{font:700 14px/1.4 var(--font-money);color:#005454;overflow-wrap:anywhere}.subscription-amount small{font-size:10px;color:#3e4948}.subscription-footer{border-top:1px solid #eeeeeb;padding-top:8px;display:flex;align-items:center;justify-content:space-between;gap:8px}.subscription-date{display:block;padding:0;background:none;border-radius:0;font-size:11px;min-width:0;color:#3e4948;line-height:1.6}.subscription-date>span{display:flex;align-items:center;gap:5px}.subscription-date .ic{width:14px;height:14px;color:#005454}.subscription-date b{font-weight:600}.subscription-date.due-soon{background:#fff0f0;border:1px solid #f7bfc2;border-radius:6px;padding:2px 6px;color:#931a24}.subscription-date.due-soon .ic{color:#931a24}.subscription-actions{display:flex;align-items:center;gap:4px;flex-shrink:0}.subscription-actions form{margin:0}.subscription-actions .btn{min-height:30px;border-radius:8px;padding:4px 10px;font-size:12px;font-weight:600;border-color:#b8d0cb;gap:4px}.subscription-actions .btn .ic{width:15px;height:15px}.subscription-actions .header-button{width:22px;height:30px;min-height:30px}.subscription-actions .header-button .ic{width:16px;height:16px}.subscription-paused{background:#f4f4f1;box-shadow:none}.subscription-paused .service-mark{background:#e2e3e0;color:#3e4948}.subscription-paused .subscription-amount strong{color:#3e4948}.subscription-paused .btn{background:#e2e3e0}.subscription-add-actions{position:fixed;z-index:19;bottom:calc(96px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(100%,430px);padding-inline:16px;pointer-events:none}.add-subscription{min-height:48px;font-size:15px;border-radius:16px;pointer-events:auto;box-shadow:0 8px 24px -2px rgb(13 110 110 / 35%)}
@media(min-width:640px) and (max-width:1023px){.subscription-add-actions{width:min(100%,760px);padding-inline:32px}}
@media(min-width:1024px){.subscription-add-actions{left:calc(50% + 110px);max-width:700px;width:calc(100% - 284px);bottom:24px}.subscription-page{padding-bottom:0}}
@media(max-width:379px){.subscription-title{flex-wrap:wrap;gap:2px}.subscription-head{gap:8px}.subscription-amount strong{font-size:13px}.subscription-actions .btn{padding-inline:7px}.subscription-family{font-size:10px}}
/* Compact debt overview and contacts from the updated Stitch design. */
.debt-page{gap:14px}.debt-note{display:flex;align-items:center;gap:8px;border:1px solid #bec9c84d;border-radius:12px;background:#f4f4f1;padding:8px 12px;font-size:12px}.debt-note>.ic{color:#006c49;width:18px;height:18px;flex-shrink:0}.debt-note>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.debt-note button{border:0;background:none;color:#6e7979;font-size:22px;cursor:pointer;line-height:1;padding:3px}
.debt-page .debt-recap{background:#fff;border-radius:16px;padding:12px;gap:8px}.debt-recap-head{padding-bottom:8px;border-bottom:1px solid #eeeeeb}.debt-recap-head .card-kicker{display:flex;align-items:center;gap:6px;color:#005454;font-size:11px}.debt-recap-head .ic{width:16px;height:16px}.debt-recap-head .tag{font-size:10px}.debt-recap-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;text-align:center}.debt-recap-columns>div{display:flex;flex-direction:column;justify-content:center;gap:3px;padding:3px 4px;min-width:0}.debt-recap-columns>div+div{border-left:1px solid #eeeeeb}.debt-recap-columns .small{font-size:11px;color:#3e4948}.debt-recap-columns strong{font:700 13px/1.5 var(--font-money);overflow-wrap:anywhere}.debt-recap-columns small{font-size:10px;color:#6e7979}.debt-recap-columns .debt-net{background:#eafafb;border:0;border-radius:12px}.debt-net .small{font-weight:700;color:#005454}.debt-recap-columns .debt-net small{color:inherit;font-weight:600}
.debt-contacts{gap:8px}.debt-contacts h5{font-size:16px;font-weight:700;color:#005454}.debt-contacts>.sec-head>.small{font-size:11px;white-space:nowrap}.debt-contacts .filter-pills{gap:8px;padding-bottom:4px}.debt-contacts .filter-pills button{min-height:32px;padding:5px 12px;font-size:12px}.debt-contact-list{gap:8px}.debt-page .debt-party{padding:12px;gap:8px;border-radius:16px}.debt-contact-row{display:flex;align-items:center;gap:8px;min-width:0}.debt-party .avatar{border-radius:12px;width:36px;height:36px;font-size:14px;flex-shrink:0;background:#d0ffeb;color:#006c49}.debt-owing .avatar{background:#fff0f0;color:#931a24}.party-link{min-width:0;text-decoration:none;color:var(--color-text);flex:1}.debt-contact-title{display:flex;align-items:center;gap:6px;min-width:0}.party-link strong{font-size:14px;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.debt-direction{font-size:10px;font-weight:700;padding:1px 6px;border-radius:4px;flex-shrink:0}.party-link>.small{display:block;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.debt-owing{border-color:#ffd6d4}.debt-contact-amount{max-width:38%;min-width:0;display:flex;flex-direction:column;text-align:right;flex-shrink:0}.debt-contact-amount>span{font-size:10px}.debt-contact-amount strong{font:700 14px/1.5 var(--font-money);overflow-wrap:anywhere}.debt-payment{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:32px;height:32px;border-radius:50%;border:1px solid #bec9c84d;background:#f4f4f1}.debt-payment .ic{width:18px;height:18px}.debt-owing .debt-payment{background:#fff0f0;border-color:#efd3d5}.debt-payment:hover{background:#d0ffeb}.debt-contact-footer{border-top:1px solid #eeeeeb;padding-top:8px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:11px;color:#3e4948}.debt-contact-footer progress{flex:1;min-width:0;width:auto;height:6px}.debt-contact-footer progress::-webkit-progress-value{background:#006c49}.debt-contact-footer progress::-moz-progress-bar{background:#006c49}.debt-owing progress::-webkit-progress-value{background:#931a24}.debt-owing progress::-moz-progress-bar{background:#931a24}.debt-contact-footer>span{display:inline-flex;align-items:center;gap:4px}.debt-contact-footer .ic{width:14px;height:14px;flex-shrink:0}.debt-last{font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.debt-page .debt-history{padding:12px;font-size:12px}.debt-page .sticky-actions{background:none;border:0;padding-bottom:calc(16px + env(safe-area-inset-bottom))}.debt-page .sticky-actions .btn{border-radius:999px;min-height:56px;box-shadow:0 8px 24px -2px rgb(13 110 110 / 35%);font-size:16px}
@media(max-width:379px){.debt-contact-row{gap:6px}.debt-party .avatar{width:30px;height:30px;font-size:12px}.debt-contact-title{flex-wrap:wrap;gap:2px}.debt-contact-amount strong{font-size:12px}.debt-page .sticky-actions .btn{font-size:14px}}
.investment-summary-panels{display:grid;grid-template-columns:1fr 1fr;gap:9px;border-top:1px solid rgb(255 255 255 / 20%);padding-top:16px}.investment-summary-panels>div{display:flex;flex-direction:column;gap:6px;background:rgb(255 255 255 / 10%);border:1px solid rgb(255 255 255 / 15%);border-radius:16px;padding:12px;font-size:10px}.investment-summary-panels strong{font-size:13px}.profit-pill{padding:6px;border-radius:99px;background:rgb(108 248 187 / 12%);color:#9dedc8}.sort-select{font-size:10px;border:0;background:none;max-width:125px;padding:4px;color:#005454}.position-card{gap:14px;padding:16px}.position-heading{display:flex;gap:10px;align-items:center;color:var(--color-text);text-decoration:none}.position-heading strong{font-size:14px;font-weight:600}.position-heading small{font-size:10px}.position-heading .row-ic{width:42px;height:42px}.position-value{background:#f4f5f2;padding:12px;border-radius:12px;display:flex;flex-direction:column;gap:8px}.position-value .budget-pair{align-items:flex-start;gap:8px}.position-value .small{font-size:10px;flex:1}.position-value strong{font:600 14px var(--font-money)}.position-value .tag{max-width:150px;font:600 10px var(--font-money);text-align:center}.position-card>.budget-pair{font-size:10px;border-bottom:1px solid #edf0ee;padding-bottom:9px}.position-price{display:flex;gap:8px;align-items:center}.position-price .price-status{border-radius:999px;white-space:normal;font-size:10px;flex:1;padding:9px;background:#f4f5f2;line-height:1.5;max-width:none}.position-price .market-price{background:#e8f5f1;color:#00714d;border:1px solid #a8d5c0}.position-price .manual-price{background:#fff5cf;color:#b76500;border:1px solid #f1d68a}.position-price .linkish{font-size:10px;white-space:nowrap}.goal-card .budget-pair{font-size:11px}.goal-card .budget-pair strong{font-size:12px}.goal-card progress{height:8px}
.report-period{margin-bottom:0;padding:10px;justify-content:space-between;border-radius:999px}.report-period form label{display:flex;align-items:center;gap:10px}.report-period input{background:none;border:0;font-size:16px;font-weight:600;max-width:170px;color:#005454}.report-highlights{gap:14px}.report-highlights .card{padding:22px 16px;gap:12px}.report-highlights .row-ic{position:absolute;top:20px;right:16px;width:35px;height:35px;border-radius:50%}.report-highlights .text-muted{font-size:11px;max-width:70%}.report-highlights strong{font-size:17px;letter-spacing:-.03em}.report-highlights .small{font-size:10px}.report-net .hero-label{font-size:12px;text-transform:uppercase}.report-net .big-figure{font-size:30px}.report-net .hero-message{font-size:11px;padding-top:12px}.savings-rate{display:flex;flex-direction:row;align-items:center;gap:14px}.savings-rate .row-ic{width:40px;height:44px}.savings-rate h4{font-size:17px}.savings-rate p{margin:0;font-size:10px}.savings-rate>strong{font:700 26px var(--font-money);color:#00714d}.weekly-trend h4,.partner-activity h4,.category-expenses h4{font-size:18px}.weekly-trend>.sec-head{flex-wrap:wrap}.weekly-trend .small{font-size:11px}.weekly-trend .weekly-row{margin-top:8px}.weekly-row .budget-pair{font-size:11px;align-items:flex-start;gap:5px}.weekly-row .budget-pair>span{font-size:10px}.weekly-track{display:flex;background:#eeeeeb;height:12px;border-radius:999px;overflow:hidden;margin-top:6px}.weekly-in{background:#00714d}.weekly-out{background:#a10f1d}.weekly-trend .soft-note{font-size:11px;margin-top:12px}.partner-activity .sec-head{flex-wrap:wrap}.activity-row{display:flex;align-items:center;gap:9px;background:#f4f5f2;padding:12px;border-radius:12px;flex-wrap:wrap}.activity-row .avatar{width:31px;height:31px}.activity-row strong{font-size:12px}.activity-row>.small{margin-left:auto;font-size:10px}.activity-row progress{height:9px;flex-basis:100%}.expense-category{text-decoration:none;color:var(--color-text);display:flex;flex-direction:column;gap:10px;margin-top:10px}.expense-category .row-ic{width:32px;height:32px;border-radius:10px;background:#fff0f0;color:#931a24}.expense-category .sec-head>strong{font-size:12px}.expense-category .sec-head>strong:last-child{font-family:var(--font-money);max-width:50%;text-align:right}.expense-category small{font-size:9px}.expense-category progress{height:8px}.expense-category:nth-child(3n) .row-ic{background:#fff5cf;color:#d77a00}.expense-category:nth-child(4n) .row-ic{background:#e8f5f1;color:#00714d}
.profile-card{display:flex;flex-direction:row;align-items:center;padding:16px;background:linear-gradient(120deg,#fff,#effcfb);gap:14px}.profile-card h4{font-size:18px}.profile-card .small{font-size:11px}.profile-card .tag{width:fit-content;margin-top:4px}.profile-card .avatar{width:54px;height:54px}.family-settings,.preferences-card,.system-settings{padding:16px;gap:20px}.family-settings>.sec-head{padding-bottom:12px;border-bottom:1px solid #edf0ee}.family-settings h4,.preferences-card h4,.system-settings h4{font-size:17px}.family-settings .sec-head>.row-ic,.preferences-card .sec-head>.row-ic,.system-settings .sec-head>.row-ic{width:33px;height:33px;border-radius:7px}.family-members{display:flex;flex-direction:column;gap:10px}.family-member{display:flex;align-items:center;gap:10px;background:#f4f5f2;border-radius:12px;padding:10px}.family-member strong{font-size:12px}.family-member .small{font-size:10px}.family-member .avatar{width:34px;height:34px;border:0}.family-member .tag{font-size:9px}.family-member .header-button{width:16px}.invite-section{border-top:1px solid #edf0ee;padding-top:20px;display:flex;flex-direction:column;gap:12px}.copy-row{display:flex;align-items:center;gap:8px;background:#f4f5f2;border:1px solid #e1e9e6;border-radius:12px;padding:10px}.copy-row label{font-size:10px;flex:1;min-width:0}.copy-row input{display:block;width:100%;background:none;border:0;padding:0;font-size:11px;color:#005454;min-width:0}.copy-row .invite-code{font-size:15px;font-weight:700;letter-spacing:.07em}.copy-row .btn{min-height:32px;background:white;font-size:10px;padding:5px 9px}.preferences-card label{font-size:12px}.preferences-card .input{margin-top:6px;background:#f9f9f6;font-size:11px}.preferences-card .small{font-size:11px}.theme-options{display:flex;flex-direction:column;gap:10px}.theme-options>button{display:flex;align-items:center;gap:10px;background:#f4f5f2;border:1px solid #e1e9e6;border-radius:12px;padding:12px;text-align:left;cursor:pointer;color:var(--color-text)}.theme-options>button[aria-pressed=true]{background:#f0faf9;border:2px solid #005454;padding:11px}.theme-radio{border:1px solid #596765;width:13px;height:13px;border-radius:50%;flex-shrink:0}.theme-options>button[aria-pressed=true] .theme-radio{border:4px solid #005454}.theme-options strong{font-size:12px;font-weight:500}.theme-options small{font-size:10px}.theme-options button[aria-pressed=false] .tag{display:none}.theme-options .tag{font-size:8px;padding:2px 4px;background:#005454;color:white;border-radius:3px}.theme-swatches{display:flex;gap:4px}.theme-swatches i{width:13px;height:13px;border-radius:50%;background:#00714d}.theme-swatches i:nth-child(2){background:#6cf8bb}.theme-swatches i:nth-child(3){background:#005454}.theme-options button[data-theme-choice=klasik] i{background:#d4d8d4}.theme-options button[data-theme-choice=klasik] i:nth-child(3){background:#3c4642}.system-settings>.sec-head{padding-bottom:14px;border-bottom:1px solid #edf0ee}.pwa-status{display:flex;align-items:center;gap:10px;border:1px solid #e1e9e6;background:#f4f5f2;border-radius:12px;padding:12px;text-align:left;cursor:pointer;color:#005454}.pwa-status strong{font-size:11px;color:var(--color-text)}.pwa-status .small{font-size:10px}.settings-row{display:flex;align-items:center;gap:12px;background:none;border:0;border-bottom:1px solid #edf0ee;padding:0 0 14px;text-align:left;cursor:pointer;font-size:12px}.settings-row span:last-child{margin-left:auto}.system-settings form .btn{margin:0;font-size:12px}
.transaction-period{padding:16px;gap:14px}.transaction-period .periode{border:0;background:none;padding:0;box-shadow:none;justify-content:flex-start;margin:0}.transaction-period .periode-controls{width:100%;justify-content:space-between}.transaction-period .periode-label{font-size:18px;font-weight:700;padding:0;border:0;gap:8px}.transaction-period .periode-label .ic{width:18px;height:18px}.transaction-period .periode-controls>.btn-icon{width:20px;min-height:25px;height:25px}.transaction-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.transaction-metrics>div{background:#f4f5f2;padding:10px 8px;border-radius:12px;display:flex;flex-direction:column;gap:8px;font-size:11px}.transaction-metrics strong{font:600 12px var(--font-money);overflow-wrap:anywhere}.transaction-metrics>div:last-child{border:1px solid #d3e4df}.tx-toolbar{display:flex;gap:16px;flex-wrap:wrap}.tx-toolbar>.filter-row{flex-basis:100%;width:100%;margin:0}.tx-search{position:relative;width:100%;display:flex;align-items:center;gap:8px;border:1px solid #e1e9e6;border-radius:12px;background:white;padding:0 12px}.tx-search>.ic{color:#596765;width:17px}.tx-search .input{border:0;padding:13px 0;min-height:47px;font-size:12px;width:100%}.tx-search .header-button{width:20px}.tx-search .header-button .ic{width:15px;height:15px}.transaction-filter-pills{display:flex;gap:8px;flex:1;min-width:0}.transaction-filter-pills label{border:1px solid #e1e9e6;background:white;border-radius:999px;padding:10px 12px;display:flex;align-items:center;gap:5px;font-size:11px;min-width:0;flex:1;white-space:nowrap}.transaction-filter-pills select{border:0;background:none;min-width:0;max-width:100%;font-size:11px;color:#005454;font-weight:600}.tx-filter-menu>summary{font-size:0;width:30px;padding:4px;border:0;background:none}.tx-filter-menu>summary .ic{width:16px;height:16px}.tx-filter-menu .menu-pop{right:0;left:auto;min-width:300px}.transaction-day{margin-bottom:10px}.transaction-day h6{font-size:12px;color:#253b37;font-weight:500;margin:0}.transaction-day>span{font-family:var(--font-money);font-size:11px}.period-end{font-size:11px;color:#7a8c86;text-align:center;padding:20px 0;margin:0}.menu-pop{z-index:30}.menu-pop a{text-decoration:none;font-size:12px}.menu-pop button{font-size:12px}.empty{font-size:12px}.offline-alert{background:#fff5cf;color:#865100;padding:10px;font-size:12px;text-align:center}
@keyframes sheet-in{from{transform:translateY(30px);opacity:.7}to{transform:translateY(0);opacity:1}}
@media(max-width:379px){.main{padding-inline:12px}.stitch-header{margin-inline:-12px;padding-inline:12px}.card{padding:15px}.balance-hero{padding:20px}.balance-hero .big-figure{font-size:27px}.category-tiles .tag{font-size:9px}.row-amount{max-width:40%}.row-amount strong{font-size:12px}.recorder-options label{min-width:115px}.information-row{gap:8px}.detail-head .big-figure{font-size:32px}.debt-net strong{font-size:16px}.subscription-head .row-main strong{font-size:15px}}
@media(min-width:640px) and (max-width:1023px){.main{max-width:760px;padding-inline:32px}.stitch-header{margin-inline:-32px;padding-inline:32px}.stitch-dashboard{display:grid;grid-template-columns:1.1fr 1fr;align-items:start}.stitch-dashboard>.greet,.stitch-dashboard>.balance-hero,.stitch-dashboard>.quick{grid-column:1/-1}.subscription-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sticky-actions{width:min(100%,760px);padding-inline:32px}.tabbar{max-width:760px}.shell{display:block}.sidebar{display:none}.tabbar{display:flex}.ledger-form{max-width:580px;margin-inline:auto}.stitch-detail{max-width:580px;margin-inline:auto}}
@media(min-width:1024px){.shell{display:flex;gap:0;max-width:1440px;margin:auto;align-items:flex-start}.sidebar{display:flex;position:sticky;top:0;width:220px;height:100dvh;flex-shrink:0;padding:28px 20px}.main{max-width:1200px;width:calc(100% - 220px);padding:0 32px 120px;margin:0}.stitch-header{margin-inline:-32px;padding:16px 32px;height:80px;margin-bottom:28px}.tabbar{display:none}.stitch-dashboard{display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:start}.stitch-dashboard>.greet{grid-column:1/-1}.stitch-dashboard>.balance-hero{grid-column:1}.stitch-dashboard>.quick{grid-column:2;align-self:center}.quick a{flex-direction:column;padding:16px 8px}.balance-hero .big-figure{font-size:34px}.wallet-grid,.subscription-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.budget-page>section.stack-sm{display:grid;grid-template-columns:1fr 1fr;align-items:start}.budget-page>section.stack-sm>.sec-head{grid-column:1/-1}.positions-list{display:grid;grid-template-columns:1fr 1fr;align-items:start}.ledger-form,.stitch-detail,.stitch-settings,.stitch-report{max-width:650px;margin-inline:auto}.has-back .main{max-width:1200px}.sticky-actions{left:calc(50% + 110px);max-width:700px;width:calc(100% - 284px);border-radius:18px 18px 0 0}.bottom-sheet{margin:auto;border-radius:24px;width:480px}.bottom-sheet iframe{height:75dvh}.in-sheet .main{width:100%;padding:0 16px 120px}.in-sheet .sticky-actions{left:50%;width:100%;max-width:430px}.in-sheet .seg{margin-top:0}.in-sheet .ledger-form{max-width:100%}}
@media(prefers-reduced-motion:reduce){.bottom-sheet[open]{animation:none}}
:root[data-theme="klasik"] .balance-hero{background:linear-gradient(120deg,#435955,#253b37)}
:root[data-theme="klasik"] .catat-icon,:root[data-theme="klasik"] .recorder-options label:has(input:checked){background:#435955}
:root[data-theme="klasik"] .t-in,:root[data-theme="klasik"] .tag-accent-2,:root[data-theme="klasik"] .avatar{background:#e7ede8}
:root[data-theme="klasik"] .q-ic.t-out,:root[data-theme="klasik"] .q-ic.t-neutral{background:#eef1ef;color:#435955}
/* Reset structural rules retained by auxiliary forms. */
.ic{display:inline-block}
.wallet-picker{flex-direction:row}
.expense-form>.field,.transfer-form>.field{padding:0;border:0;background:none;border-radius:0;box-shadow:none}
.expense-form .field textarea,.transfer-form .field textarea{background:white;min-height:54px}
.preferences-card>.sec-head>div,.system-settings>.sec-head>div{flex:1}
.stitch-dashboard>*{min-width:0}
.wallet-strip{max-width:calc(100% + 16px)}
.collaboration-note .avatar-group{flex-shrink:0}
.hero-label>span:first-child>.ic{display:inline-block}
.hero-label>span:first-child{display:inline-flex;align-items:center;gap:6px}
.report-net .hero-label>span:first-child{display:block}
@media(max-width:379px){.filter-pills,.wallet-strip{margin-right:-12px;padding-right:12px}.wallet-strip{max-width:calc(100% + 12px)}}
.update-banner{position:fixed;z-index:50;top:12px;left:50%;transform:translateX(-50%);width:min(calc(100% - 32px),400px);border:1px solid #9ac9b6;border-radius:14px;padding:10px 12px;background:#e8f5f1;box-shadow:var(--shadow-md);font-size:11px;display:flex;align-items:center;gap:8px}.update-banner .btn{margin-left:auto;min-height:32px;font-size:11px;padding:5px 10px}

.transaction-entry .stitch-header{border-bottom:0;margin-bottom:8px}.transaction-entry .header-titles{text-align:center}.transaction-entry .header-titles strong{font-size:18px}.transaction-entry .header-titles>span{display:none}.transaction-entry .stitch-header>.header-button{background:#eef0ed;color:#263b37;width:38px;min-height:38px}.entry-connection{width:38px;text-align:right}

.credit-bill-paid{background:#edf9f2;border-color:#bce3cb;color:var(--money-in)}.credit-bill-paid .tag{background:var(--money-in);color:#fff}

/* Menus opened from a right-edge icon expand toward the content. */
.menu>.header-button~.menu-pop{left:auto;right:0}

/* Anchor the date panel to its card rather than the shifting period label. */
.transaction-period{position:relative}.transaction-period .menu{position:static}.transaction-period .tx-date-picker{left:0;right:auto;width:min(760px,100%)}
/* Updated Stitch wallet composition. */
.page-dompet:not(.has-back) .header-titles{flex-direction:column-reverse;gap:2px}
.page-dompet:not(.has-back) .header-titles>span{text-transform:uppercase;letter-spacing:.04em;color:#6e7979;font-size:10px}
.page-dompet:not(.has-back) .header-titles strong{font-size:18px}
.stitch-wallets{gap:20px}
.stitch-wallets .wallet-total{padding:20px;border-radius:24px;gap:0;background:linear-gradient(135deg,#0d6e6e,#0a5a5a 55%,#073c3c);box-shadow:0 8px 24px -4px rgb(13 110 110 / 28%)}
.wallet-hero-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.wallet-hero-top>div{min-width:0;flex:1}.wallet-hero-top .hero-label{color:#9dedec;font-size:13px;gap:6px}.wallet-hero-top .hero-label .ic{width:16px;height:16px}.wallet-hero-top .big-figure{display:block;font-size:28px;line-height:1.3;margin-top:4px}
.wallet-total .wallet-add{background:rgb(255 255 255 / 10%);color:white;border:1px solid rgb(255 255 255 / 10%);border-radius:999px;padding:6px 10px;min-height:34px;font-size:12px;gap:4px;flex-shrink:0}.wallet-add .ic{width:16px;height:16px;color:#6ffbbe}
.wallet-ownership{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid rgb(255 255 255 / 10%);margin-top:16px;padding-top:14px;font-size:11px;color:#9dedec}.wallet-ownership>span:first-child{flex:1;min-width:0}.wallet-ownership strong{color:white;font-weight:600}.wallet-ownership .status-dot{background:#6ffbbe;width:9px;height:9px;margin-right:4px}.wallet-sync{display:inline-flex;align-items:center;gap:5px;background:rgb(0 0 0 / 20%);padding:6px 10px;border-radius:999px;font-size:10px}.wallet-sync .ic{width:14px;height:14px;color:#6ffbbe}
.wallet-section-heading h5{font-size:18px;font-weight:700;display:flex;align-items:center;gap:8px;line-height:1.35}.wallet-section-heading h5:before{content:'';height:16px;width:6px;background:#005454;border-radius:999px;flex-shrink:0}.wallet-section-heading>span{font-size:11px;flex-shrink:0}.credit-section-heading h5:before{background:#931a24}.credit-section-heading>.tag{max-width:145px;white-space:normal;font-size:10px;line-height:1.3}
.stitch-wallets .account-wallet{border-radius:16px;padding:16px;gap:14px;border-color:rgb(13 110 110 / 8%)}.stitch-wallets .wallet-top{gap:12px}.stitch-wallets .wallet-top .row-ic{width:48px;height:48px;border-radius:16px}.stitch-wallets .wallet-top .row-ic .ic{width:26px;height:26px}.stitch-wallets .wallet-icon-bank{background:#e8f1ff;color:#1e40af;border-color:#bfdbfe}.stitch-wallets .wallet-icon-cash{background:#fef3c7;color:#b45309;border-color:#fde68a}.stitch-wallets .wallet-icon-ewallet{background:#e6f7f0;color:#047857;border-color:#a7f3d0}.stitch-wallets .wallet-icon-broker{background:#f3e8ff;color:#7e22ce;border-color:#e9d5ff}.stitch-wallets .title-with-badge strong{font-size:15px;line-height:1.4}.stitch-wallets .wallet-top .small{font-size:11px}.stitch-wallets .wallet-top .header-button{width:16px;min-height:32px}.stitch-wallets .wallet-top>.menu{flex-shrink:0}
.wallet-compact-balance{display:flex;flex-direction:column;text-align:right;gap:2px;flex:0 1 42%;min-width:0}.wallet-compact-balance strong{font:700 15px/1.4 var(--font-money);overflow-wrap:anywhere}.wallet-compact-balance small{font-size:10px}.compact-wallet .wallet-top{gap:8px}.compact-wallet .wallet-top>.row-main{flex:1 1 35%}.compact-wallet .wallet-top>.row-ic{width:44px;height:44px}.compact-wallet .title-with-badge strong{font-size:14px}
.stitch-wallets .primary-wallet .wallet-balance-line{padding-top:12px;display:grid;grid-template-columns:minmax(0,1fr) 120px;align-items:end;gap:8px}.stitch-wallets .primary-wallet .wallet-balance-line strong{font-size:28px;line-height:1.3;overflow-wrap:anywhere}.stitch-wallets .wallet-balance-line .btn{width:120px;font-size:11px;padding:8px 10px;min-height:40px;border-radius:12px;gap:5px;background:#eeeeeb;color:#1a1c1b}.wallet-balance-line .btn .ic{width:16px;height:16px;flex-shrink:0}.wallet-rate-note{border-top:1px solid #e8e8e5;padding-top:10px;color:#6e7979;font-size:11px;display:flex;align-items:center;gap:6px}.wallet-rate-note .ic{width:14px;height:14px;color:#005454}
.wallet-add-new{display:flex;align-items:center;justify-content:center;gap:8px;padding:13px 16px;border:1px dashed rgb(0 84 84 / 30%);border-radius:16px;background:rgb(0 84 84 / 8%);color:#005454;text-decoration:none;font-size:14px;font-weight:600}.wallet-add-new .ic{width:18px;height:18px}
.stitch-wallets .credit-account{padding:20px;gap:16px;border-radius:24px;border-color:rgb(190 201 200 / 30%);box-shadow:0 8px 28px -6px rgb(147 26 36 / 12%)}.stitch-wallets .physical-card{background:linear-gradient(45deg,#1e293b,#0f172a 55%,#334155);padding:16px;gap:10px}.physical-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.physical-card-top>div{display:flex;flex-direction:column;gap:4px}.physical-card-top .card-kicker{color:#94a3b8;font-size:9px;letter-spacing:.08em}.physical-card-top strong{font-size:18px;letter-spacing:.025em}.card-contactless{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:rgb(255 255 255 / 10%);flex-shrink:0}.card-contactless .ic{width:20px;height:20px}.stitch-wallets .physical-card .card-number{color:#cbd5e1;font-size:13px;margin:2px 0}.stitch-wallets .physical-card .budget-pair small{font-size:9px}.stitch-wallets .physical-card .budget-pair b{font-size:11px}
.stitch-wallets .credit-bill{padding:14px;align-items:flex-start;background:rgb(255 218 214 / 30%);border-color:#ffdad6;font-size:11px;color:#931a24;gap:8px}.stitch-wallets .credit-bill>span:first-child{flex:1;min-width:0}.stitch-wallets .credit-bill strong{font-size:28px;line-height:1.35;overflow-wrap:anywhere}.stitch-wallets .credit-bill>.right{flex:0 1 43%;min-width:0}.stitch-wallets .credit-bill .tag{max-width:none;width:100%;font-size:10px;background:#931a24}.stitch-wallets .credit-bill small{font-size:10px}.stitch-wallets .credit-bill-paid{background:#edf9f2;border-color:#bce3cb;color:var(--money-in)}.stitch-wallets .credit-bill-paid .tag{background:var(--money-in)}
.credit-utilization{display:flex;flex-direction:column;gap:8px}.credit-utilization .small{font-size:11px;align-items:flex-start;gap:8px}.credit-utilization .budget-pair>span:last-child{text-align:right}.credit-utilization .budget-pair>strong{flex:1}.credit-utilization .budget-pair strong{font-weight:600;color:#1a1c1b}.credit-utilization .budget-pair .limit-status{color:#005454;font-size:11px}.credit-utilization progress{height:12px;border:2px solid #eeeeeb;background:#eeeeeb;border-radius:999px}.credit-utilization progress::-webkit-progress-value{background:linear-gradient(90deg,#005454,#006c49)}.credit-utilization progress::-moz-progress-bar{background:linear-gradient(90deg,#005454,#006c49)}.credit-utilization .limit-warning::-webkit-progress-value{background:#d47a00}.credit-utilization .limit-warning::-moz-progress-bar{background:#d47a00}.credit-utilization .limit-high::-webkit-progress-value{background:#931a24}.credit-utilization .limit-high::-moz-progress-bar{background:#931a24}
.wallet-unbilled{display:flex;align-items:center;gap:10px;padding:12px;background:#f4f4f1;border:1px solid rgb(190 201 200 / 20%);border-radius:12px;font-size:12px}.wallet-unbilled>.ic{color:#6e7979;width:20px;height:20px}.wallet-unbilled .row-main{gap:5px}.wallet-unbilled .row-main>strong{font-size:11px}.wallet-unbilled small{font-size:10px;line-height:1.6}.unbilled-amount{font:700 12px var(--font-money);flex-shrink:0}.stitch-wallets .credit-account .btn-primary{font-size:17px;min-height:52px;border-radius:16px}.credit-account .tiny .ic{width:13px;height:13px;color:#006c49}
.stitch-wallets .wallet-transparency{background:#f2f8f6;border-color:rgb(0 108 73 / 20%);padding:16px;gap:12px;border-radius:16px;font-size:12px;line-height:1.6}.wallet-note-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgb(108 248 187 / 40%);color:#006c49;flex-shrink:0}.wallet-note-icon .ic{width:20px;height:20px}
@media(max-width:379px){.wallet-hero-top .big-figure{font-size:25px}.stitch-wallets .account-wallet{padding:14px}.stitch-wallets .credit-account{padding:16px}.stitch-wallets .primary-wallet .wallet-balance-line strong{font-size:24px}.stitch-wallets .title-with-badge strong{font-size:13px}.wallet-compact-balance strong{font-size:13px}.wallet-section-heading h5{font-size:16px}}
:root[data-theme="klasik"] .stitch-wallets .wallet-total{background:linear-gradient(135deg,#435955,#253b37)}

.stitch-wallets .credit-bill-paid .tag{width:auto;align-self:flex-end}
@media(min-width:1024px){.stitch-wallets{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:24px}.stitch-wallets>*{min-width:0}.stitch-wallets>.wallet-total,.stitch-wallets>.filter-pills,.stitch-wallets>.wallet-transparency,.stitch-wallets>.note{grid-column:1/-1}}
/* Custom financial cycle and calendar sheet from the latest Stitch screens. */
.cycle-summary{gap:14px}.cycle-summary-top{display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid #eeeeeb;padding-bottom:12px}.cycle-tag{display:inline-flex;align-items:center;gap:5px;padding:6px 10px;border-radius:999px;background:rgb(13 110 110 / 10%);color:#005454;font-size:11px;font-weight:600}.cycle-tag .ic{width:15px;height:15px}.cycle-change{border:0;background:none;display:flex;align-items:center;gap:5px;color:#005454;font:500 12px var(--font-body);cursor:pointer;padding:5px}.cycle-change .ic{width:18px;height:18px}.cycle-navigation{display:flex;align-items:center;justify-content:space-between;gap:8px}.cycle-navigation>div{flex:1;min-width:0;text-align:center}.cycle-arrow{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;background:#f4f4f1;color:#3e4948;border-radius:50%;text-decoration:none;font-size:24px;flex-shrink:0}.cycle-range{font:700 20px/1.4 var(--font-body);letter-spacing:-.02em;color:#1a1c1b;padding:0;border:0;background:none;cursor:pointer}.cycle-range .ic{width:14px;height:14px;color:#6e7979}.cycle-navigation .small{font-size:11px;line-height:1.5;margin:2px 0 0}.cycle-separator{color:#adb5b2;margin:0 3px}.cycle-summary .transaction-metrics{border-top:1px solid #eeeeeb;padding-top:12px;gap:8px}.cycle-summary .transaction-metrics>div{padding:8px;border-radius:8px;gap:3px}.cycle-summary .transaction-metrics strong{font:700 13px var(--font-money)}.cycle-summary .transaction-metrics .ic{width:15px;height:15px}.cycle-pace{display:flex;flex-direction:column;gap:6px;font-size:10px}.cycle-pace>div{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.cycle-pace>div>strong{flex-shrink:0;color:#005454}.cycle-pace .ic{width:14px;height:14px;color:#006c49}.cycle-pace progress{height:6px}.cycle-pace progress::-webkit-progress-value{background:#0d6e6e}.cycle-pace progress::-moz-progress-bar{background:#0d6e6e}
.transaction-filters{width:100%;min-width:0;display:flex;align-items:center;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px 0 4px}.transaction-filters::-webkit-scrollbar{display:none}.transaction-filters .transaction-filter-pills{display:contents}.transaction-filters label,.category-filter-trigger{display:inline-flex;align-items:center;gap:5px;flex:0 0 auto;border:1px solid #bec9c899;border-radius:999px;background:white;font:500 13px var(--font-body);color:#3e4948;padding:9px 13px;min-height:36px;white-space:nowrap}.transaction-filters label select{font:inherit;color:inherit;padding:0;max-width:160px;min-width:0;border:0;background:none}.transaction-filters .type-filter{background:rgb(13 110 110 / 10%);border-color:#005454;color:#005454;font-weight:600;order:1}.transaction-filters label:nth-of-type(2){order:2}.category-filter-trigger{order:3;cursor:pointer}.category-filter-trigger .ic{width:16px;height:16px}.transaction-filters .member-filter{order:4}.transaction-filter-dialog .field{padding:0;background:none;border:0;box-shadow:none}.transaction-filter-dialog form{margin-top:16px}.tx-toolbar{gap:16px}.transaction-day h6{color:#1a1c1b;font-size:13px;font-weight:600}.transaction-day>span{font-size:12px;color:#6e7979}/* The same compact row is used for calendar months and custom payday cycles. */
.cycle-transaction-cards{display:flex;flex-direction:column;gap:8px}.cycle-tx-row{display:flex;flex-direction:row;align-items:center;gap:12px;text-decoration:none;color:inherit;padding:10px 12px;border-radius:12px;box-shadow:0 1px 3px rgb(13 110 110 / 3%)}.cycle-tx-row .row-ic{width:36px;height:36px;border-radius:50%;flex-shrink:0}.cycle-tx-row .row-ic .ic{width:18px;height:18px}.cycle-tx-content{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.cycle-tx-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px;min-width:0}.cycle-tx-heading .row-title{font-size:14px;font-weight:600;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.cycle-tx-heading .row-amt{font:700 14px/1.4 var(--font-money);flex-shrink:0;max-width:55%;overflow-wrap:anywhere;text-align:right}.cycle-tx-details{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;font-size:11px;color:#6e7979}.cycle-tx-metadata{display:flex;align-items:center;gap:4px 6px;flex-wrap:wrap;min-width:0}.cycle-tx-wallet{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:11px}.cycle-tx-time{font-size:11px;white-space:nowrap;flex-shrink:0}.cycle-tx-row .recorded-by{display:inline-flex;align-items:center;font-size:10.5px;padding:0 6px;line-height:1.6;background:#c9f8e4;color:#00714d;gap:3px}.cycle-tx-row .status-dot{width:4px;height:4px}.cycle-tx-row:has(.t-in) .recorded-by{background:#dcebed;color:#005454}.cycle-installment{font-size:10.5px;line-height:1.6;color:#3e4948;border-radius:4px;background:#eeeeeb;padding:0 4px}
.period-end{font-size:12px;line-height:1.6;padding:18px 0}
.period-picker{padding:0;border-radius:32px 32px 0 0;max-height:92dvh;overflow:hidden}.period-picker>.sheet-handle{margin:12px auto 10px;height:5px;width:48px;background:#e2e3e0}.period-picker-header{display:flex;align-items:center;gap:12px;border-bottom:1px solid #bec9c826;padding:0 16px 12px}.period-picker-header>div{flex:1;min-width:0}.period-picker-header h4{font-size:20px;line-height:1.4;letter-spacing:-.02em}.period-picker-header p{font-size:12px;margin:3px 0 0;line-height:1.5}.period-picker-header>.header-button{width:36px;height:36px;min-height:36px;background:#f4f4f1;color:#3e4948}.period-picker>form{display:flex;flex-direction:column;max-height:calc(92dvh - 108px);min-height:0;margin-top:0}.period-picker-scroll{overflow-y:auto;min-height:0;padding:12px 16px 16px;display:flex;flex-direction:column;gap:16px}.period-presets{display:flex;align-items:center;gap:8px;overflow-x:auto;scrollbar-width:none;flex-shrink:0;padding:2px 0 4px}.period-presets::-webkit-scrollbar{display:none}.period-presets button,.period-presets a{font:500 11px var(--font-body);padding:8px 13px;border:1px solid #bec9c84d;border-radius:999px;background:#fff;color:#3e4948;white-space:nowrap;display:inline-flex;align-items:center;gap:5px;cursor:pointer;text-decoration:none}.period-presets button.active{background:#005454;border-color:#005454;color:white;font-weight:700}.period-presets .ic{width:15px;height:15px}.period-range-preview{padding:14px;background:#f4f4f1b3;border:1px solid #bec9c840;border-radius:16px;flex-shrink:0}.period-date-pair{display:flex;align-items:center;gap:8px}.period-date-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;flex:1;min-width:0;background:white;padding:10px;border-radius:12px;border:1px solid #bec9c833;cursor:pointer}.period-date-card>span:first-child{text-transform:uppercase;color:#6e7979;font-size:11px;font-weight:600;letter-spacing:.03em}.period-date-card .status-dot{background:#0d6e6e}.period-date-card>strong{font-size:18px;font-weight:700;line-height:1.3}.period-date-card input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;min-width:0}.period-date-card:focus-within{outline:2px solid #0d6e6e;outline-offset:2px}.period-date-badge{padding:3px 6px;border-radius:6px;background:#c5fae4;color:#00714d;font-size:10px;font-weight:600}.period-day-count{display:flex;align-items:center;flex-direction:column;gap:2px;padding:0 1px}.period-day-count strong{background:rgb(0 84 84 / 10%);border-radius:999px;padding:4px 7px;font-size:11px;color:#005454;white-space:nowrap}.period-day-count>span{font-size:24px;color:#bec9c8;line-height:1}.period-range-note{border-top:1px solid #bec9c833;margin-top:12px;padding-top:10px;display:flex;align-items:center;gap:5px;font-size:10px;color:#3e4948;flex-wrap:wrap}.period-range-note>.ic{width:16px;height:16px;color:#006c49}.period-range-note>span{flex:1}.period-range-note>strong{color:#006c49;font-weight:600}
.period-calendar{padding:14px;border:1px solid #bec9c833;border-radius:16px;flex-shrink:0}.period-calendar-heading{display:flex;align-items:center;gap:6px;padding-bottom:12px;border-bottom:1px solid #eeeeeb;margin-bottom:8px}.period-calendar-heading h5{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:700;flex:1;min-width:0}.period-calendar-heading h5 .ic{color:#005454;width:22px;height:22px}.period-calendar-heading .header-button{width:28px;min-height:32px;color:#3e4948}.period-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));row-gap:8px}.period-weekday{font-size:11px;font-weight:600;color:#6e7979;text-align:center;padding:5px 0 8px}.period-weekday.sunday{color:#b4545d}.period-calendar-day{background:none;border:0;padding:0;aspect-ratio:1;min-width:0;font:400 16px var(--font-money);color:#1a1c1b;cursor:pointer}.period-calendar-day.sunday{color:#931a24}.period-calendar-day.outside{color:#d5d8d5}.period-calendar-day.in-range{background:#e0f9fa;color:#005454;font-weight:600}.period-calendar-day.selected{background:#0d6e6e;color:#fff;border-radius:50%;box-shadow:inset 0 0 0 2px #005454;font-weight:700}.period-calendar-day:focus-visible{outline:2px solid #005454;outline-offset:2px}.period-calendar>p{font-size:10px;margin:10px 0 0}.period-continuation{display:flex;align-items:center;gap:8px;background:#eefbfd;border-radius:12px;padding:10px;font-size:11px;color:#005454;margin-top:8px}.period-continuation>span{flex:1;min-width:0}.period-continuation strong{font-weight:700}.period-continuation button{border:0;background:#fff;border-radius:9px;color:#005454;flex:0 1 48%;font:600 11px/1.4 var(--font-body);cursor:pointer;padding:8px}.period-continuation .ic{width:14px;height:14px}.period-picker-footer{display:flex;align-items:center;gap:12px;padding:16px 16px max(16px,env(safe-area-inset-bottom));border-top:1px solid #bec9c833;background:white;flex-shrink:0}.period-picker-footer .btn{border-radius:16px;min-height:52px;gap:8px}.period-picker-footer .btn-secondary{font-size:14px;padding:12px;flex-shrink:0;background:#f4f4f1}.period-picker-footer .btn-primary{font-size:18px;font-weight:700;line-height:1.4;flex:1;padding:12px}.period-picker-footer small{font:400 11px/1.4 var(--font-body)}
@media(max-width:379px){.cycle-range{font-size:17px}.cycle-tx-row{padding:10px;gap:8px}.cycle-tx-heading .row-amt{font-size:13px}.cycle-tx-heading .row-title{font-size:13px}.period-picker-header h4{font-size:18px}.period-picker-header p{font-size:11px}.period-date-card>strong{font-size:17px}.period-range-note{font-size:9px}.period-picker-footer{gap:8px}.period-picker-footer .btn-primary{font-size:16px}}
@media(min-width:1024px){.period-picker{border-radius:24px;max-width:480px}.period-picker>form{max-height:calc(92dvh - 108px)}}

.page-transaksi:not(.has-back) .header-titles strong{font-size:18px}

.debt-hide{border:1px solid #bec9c866;background:#f4f4f1;color:#3e4948;border-radius:999px;padding:5px 9px;font:500 11px var(--font-body);cursor:pointer}.debt-hide:hover{background:#eeeeeb}.debt-contact-footer form{margin:0;flex-shrink:0}.debt-history .sec-head{padding-top:8px;border-top:1px solid #eeeeeb}.debt-history .btn{font-size:11px;min-height:32px;padding:5px 10px}
/* Compact expense entry from the updated Stitch form. */
.expense-form{gap:12px}.expense-form .amount-entry{padding:16px;gap:8px;border-radius:16px}.amount-entry-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.amount-entry-head>label{margin:0}.amount-entry .installment-pill{display:flex;align-items:center;gap:6px;border:1px solid #e1e9e6;border-radius:999px;padding:4px 7px;background:#f4f4f1;font-size:11px;text-transform:none;letter-spacing:0;cursor:pointer}.installment-pill>.ic{width:16px;height:16px;color:#005454}.installment-pill .switch{width:28px;height:16px}.installment-pill .switch>span:after{width:12px;height:12px}.installment-pill .switch input:checked+span:after{transform:translateX(12px)}
.expense-form .wallet-picker{min-height:56px;padding:10px 12px;gap:10px;border-radius:16px}.expense-form .wallet-picker>.ic:first-child{width:32px;height:32px;padding:7px;border-radius:8px}.expense-form .wallet-picker strong{font-size:13px}.expense-form .wallet-picker>div{gap:0}.expense-form .chips.category-tiles{gap:6px}.expense-form .category-tiles .tag{min-height:66px;padding:6px 3px;gap:2px;border-radius:12px;font-size:10.5px}.expense-form .category-icon{width:32px;height:32px}.expense-form .category-icon>.ic{width:18px;height:18px}.expense-form .category-tiles .chip:has(input:checked)>.tag{padding:5px 2px}.expense-form .category-more{min-height:66px;border-radius:12px;gap:4px}.expense-context{padding:12px 16px;gap:6px;border-radius:16px}.expense-context .date-time-card{padding:0;border:0;box-shadow:none;min-height:40px}.expense-recorder summary{display:flex;align-items:center;gap:4px;font-size:11px;color:#596765;cursor:pointer}.expense-recorder summary>strong{color:#005454}.expense-recorder summary>span{margin-left:auto;color:#005454;font-weight:600}.expense-recorder .recorder-card{margin-top:8px;padding:8px;border:0;box-shadow:none}.expense-note{position:relative}.expense-note>.input{padding-right:54px}.receipt-inline{position:absolute;right:8px;top:8px;width:32px;height:32px;padding:6px;border:1px solid #bec9c8;border-radius:8px;background:#f4f4f1}.receipt-inline .ic{width:18px;height:18px}.expense-form .save-footer .btn{min-height:56px;border-radius:16px;font-size:18px}
.amount-budget-state{color:#596765;line-height:1.5}.amount-budget-state[data-status="SAFE"]{color:#0d6e6e}.amount-budget-state[data-status="WARNING"]{color:#b45309}.amount-budget-state[data-status="OVERBUDGET"]{color:#b43438}.amount-budget-state[data-status="NO_BUDGET"]{color:#6e7979}
/* Shared expense form geometry, including the installment state. */
.expense-form{--entry-primary:#0d6e6e;--entry-border:#e1e7e4;gap:20px;padding-bottom:24px;color:#1f2937}
.transaction-entry .seg{margin-block:16px;border-radius:12px;gap:4px;background:#f4f4f1}
.transaction-entry .seg-opt{border-radius:12px;font-weight:600;min-height:44px}
.transaction-entry .seg-opt.on{background:#fff;color:#0d6e6e;box-shadow:0 1px 3px rgb(13 110 110 / 6%)}
.transaction-entry .stitch-header{margin-bottom:16px}
#catat-dialog{padding-inline:0}
#catat-dialog>header{padding-inline:16px;margin-bottom:16px}
.expense-form .card{border-color:var(--entry-border);box-shadow:none;border-radius:16px}
.expense-form .amount-entry{background:#f4f4f1;padding:20px 16px;gap:16px}
.expense-form .amount-entry-head>label,.expense-form .field>label,.expense-form .field .sec-head>label,.expense-form .installment-fields>label{font-size:13px;font-weight:600;line-height:1.5;text-transform:none;letter-spacing:0;color:#1f2937}
.expense-form .amount-entry-head>label{text-align:left}
.expense-form .field>label{margin-bottom:8px}
.expense-form .field .sec-head{margin-bottom:8px}
.expense-form .field .sec-head>a{font-size:12px;color:var(--entry-primary)}
.expense-form .amount-entry .input-affix{align-items:baseline;gap:8px;min-width:0}
.expense-form .amount-entry .affix{font:600 24px/1.25 var(--font-money);color:var(--entry-primary);align-self:baseline}
.expense-form .amount-entry .input-affix .input{font:700 36px/1.25 var(--font-money);color:var(--entry-primary);font-variant-numeric:tabular-nums;text-align:left;min-width:32px;width:1ch;max-width:calc(100% - 64px)}
.expense-form #nominal::placeholder{color:var(--entry-primary);opacity:.65}
.expense-form .installment-pill{border:0;border-radius:12px;padding:6px 8px;background:transparent;color:var(--entry-primary);min-height:40px}
.expense-form .switch input:checked+span{background:var(--entry-primary);border-color:var(--entry-primary)}
.expense-form .input{border-color:var(--entry-border);border-radius:12px}
.expense-form .input:focus-visible{outline:2px solid var(--entry-primary);outline-offset:2px}
.expense-form .amount-entry .input-affix:focus-within{outline:none;box-shadow:none}
.expense-form .amount-entry .input-affix .affix{border:0}
.expense-form .amount-entry .input-affix .input:focus-visible{outline:none;border:0;box-shadow:none}
.expense-form .amount-entry:has(#nominal:focus){border-color:rgb(13 110 110 / 35%);box-shadow:0 0 0 3px rgb(13 110 110 / 6%)}
.expense-form .wallet-picker{border-radius:12px;min-height:64px;padding:12px;border-color:var(--entry-border)}
.expense-form .wallet-picker>.ic:first-child{background:#f4f4f1;color:var(--entry-primary);border-radius:12px}
.expense-form .wallet-picker [data-wallet-balance]{color:var(--entry-primary)}
.expense-form .chips.category-tiles{gap:8px}
.expense-form .field:has(.category-tiles){container-type:inline-size}
.expense-form .category-tiles .tag{border-color:var(--entry-border);font-size:11px;min-height:72px;padding:8px 4px;gap:4px}
.expense-form .category-tiles .chip:has(input:checked)>.tag{border-color:var(--entry-primary);background:#e8f5f1;padding:7px 3px}
.expense-form .category-tiles .chip:has(input:checked) .category-icon{background:var(--entry-primary);color:#fff}
.expense-form .category-more{min-height:72px;border-color:var(--entry-border);color:var(--entry-primary)}
.expense-form .expense-context{background:#fff;padding:12px 16px;gap:8px}
.expense-form .expense-recorder summary>strong,.expense-form .expense-recorder summary>span{color:var(--entry-primary)}
.expense-form .expense-note>.input{padding-right:56px}
.expense-form .receipt-inline{right:4px;top:4px;width:40px;height:40px;padding:10px;border:0;border-radius:12px;background:transparent;color:var(--entry-primary)}
.expense-form .receipt-inline:hover{background:#f4f4f1}
.expense-form .receipt-inline .ic{width:20px;height:20px}
.expense-form .installment-card{border:0;border-top:1px solid var(--entry-border);border-radius:0;background:transparent;overflow:visible;padding:20px 0 0}
.expense-form .installment-fields{padding:0;background:transparent;gap:0;container-type:inline-size}
.expense-form .installment-fields>label{gap:8px}
.installment-select{position:relative;margin-top:8px}
.expense-form .installment-select select{appearance:none;-webkit-appearance:none;background-image:none;height:48px;width:100%;padding:12px 48px 12px 16px;font-size:14px;line-height:1.5}
.installment-select>.ic{position:absolute;right:16px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:var(--entry-primary);pointer-events:none}
.expense-form .installment-select select:focus-visible{outline:none;border-color:var(--entry-primary);box-shadow:0 0 0 2px rgb(13 110 110 / 10%)}
.installment-row{display:grid;grid-template-columns:136px minmax(0,1fr);gap:16px;margin-top:16px;align-items:start}
.installment-duration-field{display:flex;flex-direction:column;gap:8px;min-width:0}
.installment-duration-field>label,.expense-form .installment-estimate>span{font:600 13px/1.5 var(--font-body);color:#1f2937}
.expense-form .installment-duration{background:#fff;border-color:var(--entry-border);color:#6b7280;padding:8px 10px;height:48px;min-height:48px;gap:8px}
.expense-form .installment-duration>.ic{width:16px;height:16px;flex-shrink:0}
.expense-form .installment-duration input{width:32px;min-width:0;min-height:28px;padding:0;border:0;border-radius:4px;font:600 14px var(--font-money);color:#1f2937;appearance:textfield;-moz-appearance:textfield}
.expense-form .installment-duration input::-webkit-inner-spin-button,.expense-form .installment-duration input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.expense-form .installment-duration>span{font-size:12px}
.installment-estimate{display:flex;flex-direction:column;gap:8px}
.installment-estimate>span{font-size:12px;color:#6b7280}
.installment-estimate>div{display:flex;align-items:baseline;align-content:center;gap:2px 6px;flex-wrap:wrap;min-height:48px}
.installment-estimate strong{font:700 22px/1.4 var(--font-money);font-variant-numeric:tabular-nums;color:var(--entry-primary);overflow-wrap:anywhere;min-width:0;max-width:100%}
.installment-unit{font-size:12px;color:#6b7280}
.expense-form .installment-fields .soft-note{border:0;border-radius:0;background:transparent;padding:0;margin:16px 0 0;color:#6b7280;font-size:12px;line-height:1.6;align-items:flex-start;gap:8px}
.expense-form .installment-fields .soft-note>.ic{color:#6b7280;flex-shrink:0;width:16px;height:16px;margin-top:2px}
@container(max-width:300px){.installment-row{grid-template-columns:minmax(0,1fr)}.installment-duration-field{max-width:136px}.expense-form .chips.category-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
.expense-form .save-footer{border-top-color:var(--entry-border);padding:16px 16px max(16px,env(safe-area-inset-bottom));box-shadow:none}
.expense-form .footer-summary{font-size:12px;margin-bottom:12px;flex-wrap:wrap;row-gap:4px}
.expense-form .footer-summary strong{font-family:var(--font-money);font-variant-numeric:tabular-nums;color:var(--entry-primary)}
.expense-form .footer-summary>.m-in{color:var(--entry-primary);font-size:11px}
.expense-form .save-footer .btn{background:var(--entry-primary);border-color:var(--entry-primary);border-radius:12px;min-height:52px;font-size:15px}
.transaction-entry .main{padding-bottom:calc(156px + env(safe-area-inset-bottom))}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}