/* Kumpul warm illustrated design. Loaded after structural styles. */
.auth-shell { background: var(--surface); box-shadow: none; }
.auth-card { background: var(--surface); box-shadow: none; }
.auth-form input { background: var(--surface); box-shadow: none; }
body { background: var(--surface); box-shadow: none; }
::-webkit-scrollbar-track { background: var(--surface); box-shadow: none; }
.sidebar { background: var(--surface); box-shadow: none; }
.nav-item.active { background: var(--surface); box-shadow: none; }
.sidebar .nav-item:hover { background: var(--surface); box-shadow: none; }
.sidebar .nav-item.active { background: var(--surface); box-shadow: none; }
.sidebar .review-nav-item { background: var(--surface); box-shadow: none; }
.sidebar .review-nav-item:hover { background: var(--surface); box-shadow: none; }
.panel-surface { background: var(--surface); box-shadow: none; }
.avatar { background: var(--surface); box-shadow: none; }
.hero-card { background: var(--surface); box-shadow: none; }
.hero-card.is-negative { background: var(--surface); box-shadow: none; }
.stack-panel { background: var(--surface); box-shadow: none; }
.wallet-category-shelf { background: var(--surface); box-shadow: none; }
.credit-category-shelf { background: var(--surface); box-shadow: none; }
.wallet-card-credit { background: var(--surface); box-shadow: none; }
.wallet-card-back::after { background: var(--surface); box-shadow: none; }
.wallet-card-blue { background: var(--surface); box-shadow: none; }
.wallet-card-orange { background: var(--surface); box-shadow: none; }
.wallet-card-ink { background: var(--surface); box-shadow: none; }
.wallet-card-credit-back.wallet-card-blue { background: var(--surface); box-shadow: none; }
.wallet-card-credit-back.wallet-card-orange { background: var(--surface); box-shadow: none; }
.wallet-card-credit-back.wallet-card-ink { background: var(--surface); box-shadow: none; }
.wallet-card-front { background: var(--surface); box-shadow: none; }
.wallet-card-credit-front { background: var(--surface); box-shadow: none; }
.wallet-card-credit-usage-track { background: var(--surface); box-shadow: none; }
.wallet-card-credit-usage-bar { background: var(--surface); box-shadow: none; }
.transaction-icon { background: var(--surface); box-shadow: none; }
.next-up-panel { background: var(--surface); box-shadow: none; }
.plan-view-tabs { background: var(--surface); box-shadow: none; }
.plan-view-tab.active { background: var(--surface); box-shadow: none; }
.recurring-total-card { background: var(--surface); box-shadow: none; }
.recurring-next-card { background: var(--surface); box-shadow: none; }
.recurring-next-card-button:hover { background: var(--surface); box-shadow: none; }
.recurring-next-card-button:active { background: var(--surface); box-shadow: none; }
.recurring-filters { background: var(--surface); box-shadow: none; }
.recurring-detail-hero { background: var(--surface); box-shadow: none; }
.recurring-reconciliation-track > span { background: var(--surface); box-shadow: none; }
.primary-button, .secondary-button { background: var(--surface); box-shadow: none; }
.plan-hero.is-over { background: var(--surface); box-shadow: none; }
.plan-category-detail { background: var(--surface); box-shadow: none; }
.category-detail-actions { background: var(--surface); box-shadow: none; }
.segmented-control { background: var(--surface); box-shadow: none; }
.segment-count { background: var(--surface); box-shadow: none; }
.goal-card { background: var(--surface); box-shadow: none; }
.inline-money-input { background: var(--surface); box-shadow: none; }
.toggle-pills { background: var(--surface); box-shadow: none; }
.donut-chart { background: var(--surface); box-shadow: none; }
.bar-chart { background: var(--surface); box-shadow: none; }
.bars i.income { background: var(--surface); box-shadow: none; }
.bars i.expense-bar { background: var(--surface); box-shadow: none; }
.wallet-transaction-picker { background: var(--surface); box-shadow: none; }
.wallet-surface-daily { background: var(--surface); box-shadow: none; }
.wallet-surface-savings { background: var(--surface); box-shadow: none; }
.wallet-surface-cash { background: var(--surface); box-shadow: none; }
.wallet-surface-atlas { background: var(--surface); box-shadow: none; }
.credit-debt-panel { background: var(--surface); box-shadow: none; }
.credit-debt-usage-track { background: var(--surface); box-shadow: none; }
.credit-debt-usage-track span { background: var(--surface); box-shadow: none; }
.wallet-activity-scope { background: var(--surface); box-shadow: none; }
.wallet-activity-filters { background: var(--surface); box-shadow: none; }
.transaction-rail { background: var(--surface); box-shadow: none; }
.rail-spark { background: var(--surface); box-shadow: none; }
.rail-toggle-icon { background: var(--surface); box-shadow: none; }
.rail-action { background: var(--surface); box-shadow: none; }
.rail-action:hover { background: var(--surface); box-shadow: none; }
.modal-backdrop { background: var(--surface); box-shadow: none; }
.transaction-modal { background: var(--surface); box-shadow: none; }
.onboarding-backdrop { background: var(--surface); box-shadow: none; }
.onboarding-modal { background: var(--surface); box-shadow: none; }
.onboarding-modal input { background: var(--surface); box-shadow: none; }
.onboarding-money-input { background: var(--surface); box-shadow: none; }
.onboarding-plan-field input, .onboarding-plan-field select { background: var(--surface); box-shadow: none; }
.transaction-modal input, .transaction-modal select { background: var(--surface); box-shadow: none; }
.transaction-type-switcher { background: var(--surface); box-shadow: none; }
.transaction-special-types { background: var(--surface); box-shadow: none; }
.amount-field > div { background: var(--surface); box-shadow: none; }
.budget-amount-field > div { background: var(--surface); box-shadow: none; }
.budget-field input { background: var(--surface); box-shadow: none; }
.budget-color-field select { background: var(--surface); box-shadow: none; }
.toast { background: var(--surface); box-shadow: none; }
.bottom-nav { background: var(--surface); box-shadow: none; }
.bottom-nav::before { background: var(--surface); box-shadow: none; }
:root{color-scheme:light;--night:#fff2de;--night-deep:#fff2de;--surface:#fffdf9;--surface-strong:#fff;--surface-soft:#fff7e9;--surface-lift:#ffe8bf;--line:#e9dfce;--line-strong:#d5c5ac;--ink:#302c25;--ink-soft:#514939;--muted:#766c5c;--muted-dim:#807563;--mint:#925209;--mint-strong:#c47918;--mint-dark:#654a17;--gold:#9b701c;--gold-soft:#fff0c5;--lime:#677e27;--orange:#b8620d;--cyan:#287491;--lilac:#786181;--red:#b34431;--shadow:0 8px 28px #65441409;--shadow-soft:0 3px 14px #65441406;--radius-xl:23px;--radius-lg:18px;--radius-md:12px;--focus-ring:0 0 0 4px #e69c3825;--font-ui:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--font-display:var(--font-ui);--text-body:.95rem;--text-body-compact:.875rem}
html,body{background:#fff2de;color:var(--ink)}body{font-size:16px}body::before,body::after{display:none}::selection{color:#39290e;background:#ffd67a}input,textarea{caret-color:#a65a0a}::-webkit-scrollbar-track{background:#fff2de}::-webkit-scrollbar-thumb{background:#d9cbb3}h1,h2,h3{letter-spacing:-.025em}strong,b{font-variant-numeric:tabular-nums}.section-kicker,.eyebrow,.stat-label{letter-spacing:0;text-transform:none}.section-kicker{font-size:.8rem}.stat-label{font-size:.8rem}.sidebar{background:#fff9ef;border-color:var(--line);box-shadow:none}.sidebar .nav-item,.sidebar .nav-icon-frame{background:transparent;border-color:transparent;box-shadow:none;border-radius:11px}.sidebar .nav-item.active,.sidebar .nav-item:hover{background:#ffe5b5;box-shadow:none;border-color:transparent;transform:none}.sidebar .nav-item::after{display:none}.sidebar .nav-item .nav-icon-frame,.sidebar .side-nav .nav-item.active .nav-icon-frame{color:#915210;background:transparent;box-shadow:none;border:0;transform:none}.nav-item-copy{font-size:.9rem}.brand-wordmark,.auth-brand strong{color:var(--ink)}.brand-wordmark-dot{color:#be741a}.avatar{background:#ffdf91;color:#63451b;box-shadow:none;border-color:#efcc82}.topbar{border-color:var(--line)}.topbar h1{font-size:clamp(1.6rem,3vw,2.2rem);letter-spacing:-.035em}.topbar-kicker{font-size:.8rem;color:var(--muted);text-transform:none;letter-spacing:0}.panel-surface{background:var(--surface);border:1px solid #eee3d1;box-shadow:none}.view-intro h2{font-size:clamp(1.5rem,2.8vw,2rem);letter-spacing:-.03em}.view-intro .section-kicker{display:none}.primary-button{background:#ffa51f;color:#422a09;border:1px solid #ed981c;box-shadow:none;border-radius:12px;font-size:.9rem;min-height:46px}.primary-button:hover{background:#ffbb46;color:#422a09;box-shadow:none}.secondary-button{background:#fff8e9;color:#805015;border-color:#e8d6b5;box-shadow:none;font-size:.85rem;min-height:44px}.secondary-button:hover{background:#ffedc9}.text-button{color:#925209;font-size:.82rem;min-height:36px}.icon-button,.round-action,.icon-button.subtle{background:#fffaf0;color:#726044;border-color:#e9ddc6;box-shadow:none}.month-control,.month-arrows{background:#fffdf8;border:1px solid #ecdfc8;color:#635239}.month-control-label{font-size:.85rem}.month-reset{background:#ffe9bd;color:#835419}.feature-icon,.icon-badge,.transaction-icon{background:#fff0cb;color:#8d651f;border-color:#edddb8;box-shadow:none}.budget-status,.trend-pill.positive,.hero-status{background:#edf2d8;color:#587121}.trend-pill.neutral{background:#f0e9dc;color:#726348}.negative,.form-error{color:#aa392e}.positive{color:#557421}.muted-copy{color:var(--muted);font-size:.85rem}
/* The hero illustration is decorative; data remains live. */
.hero-card.panel-surface{background:#ffd13f url('assets/kumpul-landscape.png') 80% center / cover no-repeat;border:0;min-height:450px;padding:28px;box-shadow:none;border-radius:26px}.hero-card::before,.hero-card::after{display:none}.hero-card .eyebrow{font-size:1rem;color:#4d390d}.hero-amount{color:#302407;font-size:clamp(2.6rem,4vw,3.7rem);letter-spacing:-.035em;font-weight:700}.hero-helper{color:#58451a;font-size:.875rem;max-width:30ch}.hero-rule,.hero-footer{display:none}.hero-breakdown{background:#fffaf0f5;color:#493d28;border-color:#e6d3a8;border-radius:13px}.hero-breakdown *{color:inherit}.overview-commitment-strip{margin-top:105px;background:#fffbefee;border:0;border-radius:13px 13px 0 0;color:#584823;padding:13px}.overview-commitment-copy strong{font-size:.82rem;color:#554422}.overview-commitment-copy .stat-label,.overview-commitment-copy small{color:#746342}.overview-commitment-mark{background:transparent;color:#846019;border:0}.overview-commitment-link{color:#8e5815}.landscape-actions{display:flex;justify-content:space-around;padding:10px 8px 17px;background:#fffbefee;border-radius:0 0 13px 13px}.landscape-actions button{display:grid;justify-items:center;gap:8px;border:0;background:none;color:#59421c;font-size:.8rem;min-width:65px}.landscape-actions .icon{display:grid;place-items:center;width:42px;height:42px;background:#ffcf61;border-radius:50%;padding:11px}.landscape-actions button:hover .icon{background:#ffba32}
/* Account rows replace overlapping decks. */
.stack-panel{padding:0 0 0 12px}.wallet-deck-toggle-button{display:none!important}.cash-category-shelf,.credit-category-shelf{display:block!important;grid-template-rows:none!important;min-height:0!important;height:auto!important}.wallet-stack,.credit-card-shelf,.wallet-stack.is-expanded,.credit-card-shelf.is-expanded{display:grid!important;gap:10px!important;height:auto!important;min-height:0!important;padding:0!important;overflow:visible!important}.wallet-stack .wallet-card,.credit-card-shelf .wallet-card{position:relative!important;inset:auto!important;transform:none!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;width:100%!important;height:auto!important;min-height:100px!important;margin:0!important;z-index:auto!important;border:1px solid #e9ddc5!important;border-radius:15px!important;padding:17px 20px!important;background:#fffdf8!important;box-shadow:none!important;color:#41382a!important;clip-path:none!important}.wallet-card::before,.wallet-card::after{display:none!important}.wallet-card strong{font-size:1.4rem!important;color:#41382a!important}.wallet-card small,.wallet-card-bottom,.wallet-card-type,.wallet-card-credit-usage-heading{color:#77684f!important;font-size:.78rem!important}.wallet-card-type{background:#f8edda;border:0}.wallet-card-credit-name{color:#514328}.wallet-card:hover{border-color:#d69a3e!important;background:#fff9ed!important}.wallet-card-credit-usage{margin:12px 0}.wallet-card-credit-usage-track{background:#eee6d5}.wallet-card-credit-usage-bar{background:#a4b943}.wallet-card-credit-status.positive{background:#edf1d5;color:#607a24}.wallet-group-label-row{margin-bottom:12px}.credit-category-shelf{padding-top:18px!important}
/* Shared planning, ledger and reporting surfaces. */
.plan-hero{background:#fff5dc;border-color:#eedcb7}.gauge-track{stroke:#eee2c8}.gauge-progress{stroke:#eba12c}.gauge-endpoint{fill:#cf8b1e}.gauge-endpoint-halo{fill:#e6b65333}.gauge-copy strong,.arc-chart-inner strong{color:#604718}.progress-track,.category-track,.bar-track{background:#f0e7d6}.plan-view-tab,.filter-chip,.toggle-pills button,.transaction-type-tab{background:#fffbf2;color:#76684f;border-color:#e8ddc8;box-shadow:none}.plan-view-tab.active,.filter-chip.active,.toggle-pills button.active,.transaction-type-tab.active{background:#ffe0a0;color:#714507;border-color:#edc47b;box-shadow:none}.plan-view-tab-icon{background:#fff3d6;color:#99661b;border:0}.plan-tab-copy strong{color:var(--ink)}.plan-tab-copy small{color:var(--muted)}.plan-tab-count{background:#f6d28a;color:#714b11}.plan-commitment-summary{background:#fff6e5;border-color:#e8d8ba;color:#6a552d}.category-bar-button.is-selected{background:#fff0cb;border-color:#e7cc91;box-shadow:none}.category-bar-button:hover,.transaction-row:hover{background:#fff6e5}.transaction-row{border-color:#eee4d3}.transaction-name,.transaction-amount{color:var(--ink)}.transaction-meta{color:var(--muted);font-size:.8rem}.search-field,.activity-search{background:#fff;border-color:var(--line)}.goal-card{background:#fffdf8}.goal-card::before,.goal-card::after{display:none}.goals-summary{background:#f5f3df}.goal-card .progress-track{height:8px}.net-worth-card{background:#fff1cf}.distribution-card,.flow-card{background:#fffdf8}.chart-legend,.legend-list{color:var(--muted)}.recurring-total-card{background:#fff0ce}.recurring-next-card{background:#f3f4df}.recurring-row,.recurring-item{border-color:#e8dfcc;background:#fffdf8}.state-callout{background:#fff1d0;border-color:#e9ca89;color:#76551c}.state-callout strong{color:#684710}.empty-state{background:#fff9ed;border-color:#e9dcc5;color:#75644a}.empty-state strong{color:#51402a}.wallet-portfolio-hero{background:#fff1d1;color:var(--ink)}
/* Focused forms and sheets use the same light material. */
.modal-backdrop{background:#30271e66;backdrop-filter:blur(5px)}.transaction-modal,.onboarding-modal,.wallet-transaction-picker{background:#fffbf3;border:1px solid #e6d8c0;box-shadow:0 25px 80px #42321e30;color:var(--ink)}.transaction-modal input,.transaction-modal select,.transaction-modal textarea,.auth-form input,.onboarding-modal input,.onboarding-modal select,.budget-color-field select{background:#fff;color:#3b3328;border-color:#dfd2bb;box-shadow:none;font-size:16px;min-height:46px}.transaction-modal input::placeholder,.auth-form input::placeholder{color:#847764}.modal-header h2{font-size:1.4rem}.modal-header .section-kicker{display:none}.transaction-modal label,.onboarding-modal label{font-size:.85rem;color:#61513a}.transaction-preview,.transaction-context,.wallet-transaction-context,.budget-field,.budget-editor-summary,.recurring-editor-preview{background:#fff4df;border-color:#ead9b9;color:var(--ink-soft)}.transaction-type-switch{background:#efe6d6}.transaction-type-switch button.active{background:#ffdf9c;color:#71480f}.auth-shell{background:#fff2de url('assets/kumpul-landscape.png') center / cover fixed no-repeat}.auth-atmosphere{display:none}.auth-card{background:#fffdf5f5;border-color:#f0e1c5;box-shadow:0 20px 70px #5b451827}.auth-heading h1{color:#3a3021;font-size:2.5rem;letter-spacing:-.035em}.auth-brand small,.auth-heading p{color:#75674e}.onboarding-brand strong{color:#42351e}.onboarding-trust{color:#75684f}.bottom-nav{background:#fffaf2f5;border-color:#e8d9bb;box-shadow:0 -3px 18px #704a0b06}.bottom-nav .nav-item{color:#7d6a4d}.bottom-nav .nav-item.active{background:#ffdf96;color:#75490c;box-shadow:none}.bottom-nav .nav-item::before,.bottom-nav .nav-item::after{display:none}.quick-log-button{background:#ffa51f;color:#422a09;box-shadow:0 4px 16px #83500d16;border-radius:25px}.persistence-status.is-warning{background:#fff0d4;color:#85531c;border-color:#deb572}
@media(max-width:820px){.hero-card.panel-surface{min-height:450px;padding:23px;background-position:82% center}.hero-amount{font-size:clamp(2.4rem,9vw,3.3rem)}.overview-commitment-strip{margin-top:115px}.stack-panel{padding-left:0}.content-wrap{padding-left:20px;padding-right:20px}.topbar{padding-left:20px;padding-right:20px}.plan-figures strong{font-size:1.25rem}.transaction-modal,.onboarding-modal{border-radius:22px}.bottom-nav .nav-item{font-size:.65rem}.wallet-card strong{font-size:1.25rem!important}.view-intro h2{font-size:1.5rem}.hero-helper{font-size:.8rem}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Replace legacy pale-on-dark text. */
.hero-amount { color: var(--ink-soft); }
.hero-helper { color: var(--ink-soft); }
.hero-breakdown-heading { color: var(--ink-soft); }
.hero-breakdown-row { color: var(--ink-soft); }
.hero-breakdown-row strong { color: var(--ink-soft); }
.hero-breakdown-note { color: var(--ink-soft); }
.hero-footer strong { color: var(--ink-soft); }
.wallet-card-credit-balance strong { color: var(--ink-soft); }
.wallet-card-credit-balance > span { color: var(--ink-soft); }
.wallet-card-credit-status { color: var(--ink-soft); }
.wallet-card-back small { color: var(--ink-soft); }
.wallet-card-orange { color: var(--ink-soft); }
.wallet-card-front { color: var(--ink-soft); }
.wallet-card-credit-front .wallet-card-credit-balance strong { color: var(--ink-soft); }
.wallet-card-credit-front .wallet-card-bottom > span:first-child { color: var(--ink-soft); }
.wallet-card-type { color: var(--ink-soft); }
.wallet-card-bottom { color: var(--ink-soft); }
.wallet-add { color: var(--ink-soft); }
.state-callout > .text-button:hover { color: var(--ink-soft); }
.recurring-balance-alert > .text-button:hover, .wallet-detail-alert > .text-button:hover { color: var(--ink-soft); }
.recurring-total { color: var(--ink-soft); }
.net-worth-value { color: var(--ink-soft); }
.wallet-surface-savings { color: var(--ink-soft); }
.wallet-surface-cash { color: var(--ink-soft); }
.wallet-detail-type { color: var(--ink-soft); }
.wallet-detail-hero-copy .eyebrow { color: var(--ink-soft); }
.wallet-detail-hero-copy > p:last-child { color: var(--ink-soft); }
.wallet-detail-hero-side span { color: var(--ink-soft); }
.wallet-detail-hero-side strong { color: var(--ink-soft); }
.danger-button:hover { color: var(--ink-soft); }
.view.active{animation:none;opacity:1;transform:none}.sidebar .nav-item:not(.active){background:transparent}.sidebar .nav-item:not(.active):hover{background:#fff0d1}.segmented-control button.active,.toggle-pills button.active{background:#ffe1a1;color:#72490e}.net-worth-value{color:#47371e;letter-spacing:-.035em}.donut-chart>div{background:#fffdf8;color:#493b25}.donut-chart span{font-size:.75rem}.wallet-detail-hero{background:#fff0ca!important;color:#45361d;box-shadow:none;border-color:#ead5a9}.wallet-detail-hero::after{display:none}.wallet-detail-hero-copy .eyebrow,.wallet-detail-hero-copy>p:last-child,.wallet-detail-hero-side span{color:#786340}.wallet-detail-hero-side strong{color:#47371e}.wallet-detail-hero-copy>strong{letter-spacing:-.035em}.wallet-card-credit-balance>span,.wallet-card-credit-usage-heading,.wallet-card-credit-mark{color:#776140!important}.wallet-card-credit-mark{background:#fff0c8;border-color:#eddfc5}.stack-panel{background:transparent!important}.wallet-stack .wallet-card{display:grid!important;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;gap:8px 16px;align-items:center;min-height:91px!important;text-align:left}.wallet-stack .wallet-card>span:first-child{grid-column:1;grid-row:1;padding:0;align-self:center;font-size:.9rem;font-weight:600}.wallet-stack .wallet-card>strong{grid-column:2;grid-row:1;margin:0;text-align:right;font-size:1.15rem!important}.wallet-stack .wallet-card>small,.wallet-stack .wallet-card>.wallet-card-bottom{grid-column:1/-1;grid-row:2;text-align:left;margin:0;justify-content:space-between;font-size:.78rem!important}.wallet-card-heading .wallet-card-type{display:none}.wallet-card-bottom .wallet-open{height:20px;width:20px}.wallet-stack .wallet-card-back>small{color:#76674e!important}.field-helper,.auth-field-helper,.transaction-type-hint,.transaction-modal label>span{font-size:.8rem;line-height:1.5}.goal-card-footer span,.goal-card-progress-label p,.goal-card-progress-label>span{font-size:.8rem}.goal-card-status{color:#725a2e}.transaction-type-choice{box-shadow:none}.transaction-type-choice .feature-icon{box-shadow:none}.transaction-type-choice.active{background:#ffe6b4;border-color:#dbb36a}.transaction-context,.transaction-balance-preview{background:#fff0d5}.hero-card .hero-helper{color:#58451a}.hero-card .eyebrow{color:#4d390d}.hero-amount{color:#302407}.view:not([data-view="overview"])>.view-intro h2{display:none}.view:not([data-view="overview"])>.view-intro{margin-top:8px;margin-bottom:22px}.goal-card h3{font-size:1.1rem}.goal-card-action{min-height:44px;color:#775016}.transaction-row{min-height:68px}.transaction-row strong{font-size:.95rem}.category-label strong{font-size:.95rem}.category-label span,.category-percent{font-size:.8rem}.hero-card-top .round-action{background:#fff8dfb8;border:0}.credit-card-shelf .wallet-card-credit{min-height:165px!important}
@media(max-width:820px){.wallet-stack .wallet-card{padding:16px!important;gap:9px}.wallet-stack .wallet-card>strong{font-size:1rem!important}.wallet-stack .wallet-card>span:first-child{font-size:.85rem}.modal-backdrop{padding:12px}.transaction-modal{max-height:calc(100dvh - 24px);padding:22px}.overview-commitment-link{align-self:center}.overview-commitment-strip{grid-template-columns:28px minmax(0,1fr) auto;gap:8px}.landscape-actions{padding-top:14px}.bottom-nav{border-radius:20px 20px 0 0;bottom:0;width:100%;padding-bottom:max(12px,env(safe-area-inset-bottom))}.transaction-rail{bottom:92px}.category-label{gap:8px}.goal-grid{gap:16px}}
.wallet-card-credit-usage-heading>span{color:#776140!important;font-size:.75rem!important;letter-spacing:0}.wallet-category-shelf{background:transparent!important}.wallet-card-credit-usage-heading>strong{font-size:.85rem!important}.transaction-amount.positive{color:#557421}.wallet-detail-metrics strong,.kpi-row strong{font-variant-numeric:tabular-nums;white-space:nowrap}.wallet-detail-metrics small{font-size:.75rem;line-height:1.5}.view-intro{padding-top:0}.overview-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
@media(max-width:820px){.overview-grid{grid-template-columns:minmax(0,1fr)}.wallet-detail-metrics,.kpi-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px}.kpi-row>div:last-child{grid-column:1/-1}.wallet-detail-metrics strong{font-size:1rem}.wallet-detail-hero-copy>strong{font-size:clamp(2rem,9vw,3rem)}.net-worth-value{font-size:clamp(1.8rem,8vw,2.6rem)}.transaction-rail{bottom:88px}.quick-log-button{min-height:44px;font-size:.85rem}.view-intro.month-aware-intro{gap:12px}}

/* Fast tactile feedback; one bounded transition for each user action. */
@media(prefers-reduced-motion:no-preference){
  .primary-button,.secondary-button,.icon-button,.text-button,.landscape-actions button,.nav-item,.filter-chip,.transaction-row,.goal-card-action{transition:background-color 150ms ease,color 150ms ease,border-color 150ms ease,transform 140ms cubic-bezier(.16,1,.3,1),box-shadow 150ms ease}
  .primary-button:active,.secondary-button:active,.landscape-actions button:active{transform:scale(.96)}
  .icon-button:active,.nav-item:active,.filter-chip:active{transform:scale(.94)}
  .landscape-actions .icon{transition:transform 180ms cubic-bezier(.16,1,.3,1),background-color 150ms ease}
  .landscape-actions button:hover .icon{transform:translateY(-3px)}
  .landscape-actions button:active .icon{transform:translateY(0) scale(.94)}
  .transaction-row:active{transform:scale(.985)}
  .wallet-stack .wallet-card:hover,.credit-card-shelf .wallet-card:hover{box-shadow:0 5px 16px #82581c12!important}
  .wallet-stack .wallet-card:active,.credit-card-shelf .wallet-card:active{background:#ffedc8!important}
  .modal-backdrop .transaction-modal,.modal-backdrop .onboarding-modal{animation:none}
  .bottom-nav .nav-item.active{transition:background-color 180ms ease,color 180ms ease}
}
@media(prefers-reduced-motion:reduce){
  .landscape-actions button:hover .icon,.landscape-actions button:active,.primary-button:active,.secondary-button:active,.nav-item:active{transform:none!important}
}

/* Friendly geometric display, quiet humanist reading face. */
:root{--font-ui:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--font-display:'Outfit','DM Sans',sans-serif}
body,input,select,textarea,button{font-family:var(--font-ui)}
h1,h2,h3,.topbar h1,.view-intro h2,.panel-heading h3,.modal-header h2,.auth-heading h1{font-family:var(--font-display);font-weight:600;letter-spacing:-.025em;line-height:1.15}
.hero-amount,.net-worth-value,.wallet-detail-hero-copy>strong,.recurring-total,.goal-summary-stats strong,.gauge-copy strong,.arc-chart-inner strong{font-family:var(--font-display);font-weight:600;letter-spacing:-.025em;font-variant-numeric:tabular-nums;line-height:1.12}
.hero-amount{font-size:clamp(2.65rem,4vw,3.8rem);font-weight:600}
.topbar h1{font-size:clamp(1.75rem,3vw,2.4rem)}
.panel-heading h3{font-size:1.15rem}.modal-header h2{font-size:1.55rem}
.transaction-row strong,.wallet-stack .wallet-card>strong,.plan-figures strong{font-family:var(--font-ui);font-variant-numeric:tabular-nums}
.brand-wordmark,.auth-brand strong{font-family:'DM Sans',sans-serif;font-weight:700}
.hero-helper,.muted-copy,.field-helper{line-height:1.5;letter-spacing:0}
@media(max-width:820px){.hero-amount{font-size:clamp(2.35rem,9vw,3.3rem)}.topbar h1{font-size:1.75rem}.wallet-detail-hero-copy>strong{font-size:clamp(2rem,9vw,3rem)}}

/* Quieter dashboard copy; sunny, tactile account tiles. */
#available-helper{display:none}.hero-card .overview-commitment-strip{margin-top:132px}
.wallet-stack{gap:14px!important}.wallet-stack .wallet-card.account-tile{display:flex!important;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:0;min-height:156px!important;padding:22px!important;border:1px solid #efc365!important;background:#ffe19a!important;border-radius:21px!important;isolation:isolate;text-align:left}
.wallet-stack .account-tile[data-account-surface="savings"]{background:#dfe9b8!important;border-color:#c9d59f!important}
.wallet-stack .account-tile[data-account-surface="cash"]{background:#fbd4a4!important;border-color:#edbb83!important}
.wallet-stack .account-tile::after{display:block!important;content:"";position:absolute!important;inset:auto -18px -36px auto!important;width:165px!important;height:140px!important;background:url('assets/kumpul-landscape.png') 90% 95% / 370px auto!important;border-radius:80px 0 0 0!important;border:0!important;opacity:.21;z-index:-1;pointer-events:none}
.wallet-stack .account-tile>.account-tile-heading{display:flex;align-items:center;gap:10px;font-size:.95rem!important;white-space:normal!important;max-width:calc(100% - 22px);color:#534023}
.account-tile-symbol{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#fff9e67d;color:#80621e;flex:none}.account-tile-symbol svg{width:20px;height:20px}
.wallet-stack .account-tile>strong{font-family:var(--font-display);font-size:1.8rem!important;margin-top:17px!important;letter-spacing:-.025em;text-align:left!important;z-index:1}
.wallet-stack .account-tile>small{font-size:.78rem!important;margin-top:5px!important;color:#685332!important;z-index:1}
.wallet-stack .account-tile>.account-tile-arrow{position:absolute;right:19px;top:26px;color:#806730;width:18px;height:18px}.account-tile-arrow svg{width:18px;height:18px}
.credit-card-shelf .wallet-card-credit{background:#dcecf0!important;border-color:#bfd6df!important;border-radius:22px!important;padding:22px!important;min-height:206px!important}
.credit-card-shelf .wallet-card-credit::after{display:block!important;content:"";position:absolute;inset:auto -25px -60px auto;width:175px;height:175px;border:22px solid #c2dce155;border-radius:50%;background:transparent;pointer-events:none}
.credit-card-shelf .wallet-card-credit strong{color:#304d57!important}.credit-card-shelf .wallet-card-credit .wallet-card-credit-balance strong{font-family:var(--font-display);font-size:1.9rem!important;letter-spacing:-.025em}.wallet-card-credit-name{font-size:.95rem}.wallet-card-credit-mark{background:#ffffff8a;color:#486a77!important;border:0}.wallet-card-credit-usage-track{height:5px;background:#bad5dd}.wallet-card-credit-usage-bar{background:#6d939b}.wallet-card-credit-status.positive{background:#f5faed;color:#537031}.credit-card-shelf .wallet-card-credit .wallet-card-bottom{position:relative;z-index:1}.wallet-card-credit-usage-heading>span{color:#53707a!important}.wallet-stack .account-tile:hover{filter:brightness(1.025)}
@media(max-width:820px){.hero-card .overview-commitment-strip{margin-top:132px}.wallet-stack .wallet-card.account-tile{min-height:150px!important;padding:20px!important}.wallet-stack .account-tile>strong{font-size:1.7rem!important}.wallet-stack .account-tile>.account-tile-heading{font-size:.9rem!important}.credit-card-shelf .wallet-card-credit{padding:20px!important}}
.wallet-stack .account-tile>.account-tile-heading{align-self:flex-start!important;justify-content:flex-start!important;margin:0!important;text-align:left!important;font-size:.95rem!important}.account-tile-heading>span:last-child{font-size:inherit;line-height:1.35}

/* Small landscape emblems, matched to each account's purpose. */
.account-tile-symbol{width:48px;height:48px;border-radius:12px;background:transparent;overflow:hidden;flex:0 0 48px;box-shadow:0 3px 8px #5c53200b}
.account-tile-symbol img{display:block;width:48px;height:48px;object-fit:contain}
.wallet-stack .account-tile>.account-tile-heading{gap:12px;max-width:calc(100% - 16px)}
.wallet-stack .account-tile>.account-tile-arrow{top:36px}
.wallet-stack .account-tile>strong{margin-top:15px!important}

/* Original illustrated navigation, aligned with account emblems. */
.side-nav [data-route="overview"] .icon,.bottom-nav [data-route="overview"] .icon{background:url("assets/nav-home.svg") center / contain no-repeat}
.side-nav [data-route="plan"] .icon,.bottom-nav [data-route="plan"] .icon{background:url("assets/nav-plan.svg") center / contain no-repeat}
.side-nav [data-route="activity"] .icon,.bottom-nav [data-route="activity"] .icon{background:url("assets/nav-activity.svg") center / contain no-repeat}
.side-nav [data-route="goals"] .icon,.bottom-nav [data-route="goals"] .icon{background:url("assets/nav-goal.svg") center / contain no-repeat}
.side-nav [data-route="insights"] .icon,.bottom-nav [data-route="insights"] .icon{background:url("assets/nav-insights.svg") center / contain no-repeat}
.side-nav .nav-item .icon>svg,.bottom-nav .nav-item .icon>svg{visibility:hidden}
.sidebar .side-nav .nav-icon-frame{width:42px;height:42px;padding:0;background:transparent!important;border:0;border-radius:12px}
.sidebar .side-nav .nav-icon-frame>.icon{width:42px;height:42px}
.sidebar .side-nav .nav-item{min-height:62px;gap:13px}
.bottom-nav .nav-item>.icon{width:30px;height:30px}
.bottom-nav .nav-item{gap:5px}

/* Compact accounts: colour and meaningful icons, without scenic decoration. */
.wallet-stack .wallet-card.account-tile{display:grid!important;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;align-items:center;column-gap:12px;row-gap:3px;min-height:88px!important;padding:16px!important;border-radius:16px!important}
.wallet-stack .account-tile::after,.credit-card-shelf .wallet-card-credit::after{display:none!important}
.wallet-stack .account-tile>.account-tile-heading{grid-column:1;grid-row:1/3;align-self:center!important;gap:10px;max-width:100%;font-size:.88rem!important}
.account-tile-symbol,.account-tile-symbol img{width:38px;height:38px}.account-tile-symbol{flex-basis:38px;border-radius:10px}
.wallet-stack .account-tile>strong{grid-column:2;grid-row:1;align-self:end;margin:0!important;font-family:var(--font-ui);font-size:1.05rem!important;text-align:right!important;white-space:nowrap}
.wallet-stack .account-tile>small{grid-column:2!important;grid-row:2!important;align-self:start;margin:0!important;text-align:right!important;font-size:.72rem!important}
.wallet-stack .account-tile>.account-tile-arrow{display:none}
.wallet-stack{gap:10px!important}.credit-card-shelf .wallet-card-credit{min-height:138px!important;padding:16px 18px!important;border-radius:16px!important;gap:7px}
.credit-card-shelf .wallet-card-credit .wallet-card-credit-balance strong{font-size:1.45rem!important;margin-top:0}.wallet-card-credit-usage{margin:2px 0 4px}.wallet-card-credit-usage-heading{display:none}.wallet-card-credit-mark{width:27px;height:27px}.wallet-card-credit-name{font-size:.88rem}.credit-card-shelf .wallet-card-credit .wallet-card-bottom{font-size:.72rem!important}.wallet-card-credit-usage-track{height:4px}
@media(max-width:820px){.wallet-stack .wallet-card.account-tile{min-height:84px!important;padding:14px!important;column-gap:9px}.wallet-stack .account-tile>.account-tile-heading{font-size:.82rem!important;gap:9px}.wallet-stack .account-tile>strong{font-size:.95rem!important}.credit-card-shelf .wallet-card-credit{min-height:134px!important;padding:16px!important}}
@media(max-width:370px){.account-tile-symbol,.account-tile-symbol img{width:32px;height:32px}.account-tile-symbol{flex-basis:32px}.wallet-stack .account-tile>.account-tile-heading{font-size:.78rem!important}.wallet-stack .account-tile>strong{font-size:.88rem!important}}

/* Keep the illustrated balance useful at a glance without making it a full-screen card. */
.hero-card.panel-surface{min-height:0;padding:22px;background-position:80% 56%}
.hero-amount{margin-top:17px;font-size:clamp(2.55rem,4vw,3.55rem)}
.hero-month-summary{position:relative;z-index:1;display:flex;gap:28px;width:max-content;max-width:100%;margin-top:17px;padding:10px 16px;border-radius:13px;background:#fff9e4dc;color:#4a3918}
.hero-month-summary>div{display:grid;gap:2px;min-width:110px}
.hero-month-summary span{font-size:.68rem;font-weight:600;color:#725d36}
.hero-month-summary strong{font-family:var(--font-display);font-size:.96rem;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.hero-card .overview-commitment-strip{margin-top:22px;padding:11px 14px 8px}
.overview-commitment-copy small{display:none}
.landscape-actions{padding:5px 8px 10px}
.landscape-actions button{gap:4px}
.landscape-actions .icon{width:35px;height:35px;padding:9px}
@media(max-width:820px){.hero-card.panel-surface{min-height:0;padding:19px;background-position:77% 55%}.hero-amount{font-size:clamp(2.3rem,8.5vw,3.1rem)}.hero-month-summary{gap:18px;margin-top:15px;padding:9px 12px}.hero-month-summary>div{min-width:95px}.hero-card .overview-commitment-strip{margin-top:20px}.landscape-actions{padding-bottom:8px}}
@media(max-width:370px){.hero-month-summary{gap:12px}.hero-month-summary>div{min-width:87px}.hero-month-summary strong{font-size:.86rem}}
.hero-amount{margin-top:12px}
.hero-month-summary{margin-top:11px;padding-top:7px;padding-bottom:7px}
.hero-card .overview-commitment-strip{margin-top:13px;padding-top:10px;padding-bottom:7px}
.hero-card .overview-commitment-copy .stat-label{display:none}
.overview-commitment-strip .overview-commitment-link{grid-column:auto;justify-self:end;margin:0}
.landscape-actions{padding-top:4px;padding-bottom:7px}
.landscape-actions .icon{width:32px;height:32px;padding:8px}
@media(max-width:820px){.hero-amount{margin-top:12px}.hero-month-summary{margin-top:11px;padding-top:7px;padding-bottom:7px}.hero-card .overview-commitment-strip{margin-top:13px}.landscape-actions{padding-top:4px;padding-bottom:7px}}

/* Small illustrated transaction emblems, with the same soft geometry as accounts. */
.transaction-icon{width:44px;height:44px;border-radius:13px;box-shadow:none}
.transaction-icon svg{width:22px;height:22px}
.transaction-icon-illustrated{overflow:hidden;padding:0;border:0;background:transparent}
.transaction-icon-illustrated img{display:block;width:100%;height:100%;object-fit:cover}

/* A quieter, tailored finish for the three everyday account rows. */
.wallet-stack .wallet-card.account-tile{min-height:96px!important;padding:17px 19px!important;border:1px solid #e9ddc5!important;border-radius:18px!important;background:linear-gradient(112deg,#fffdf7 0%,#fffaf0 68%,#f7efd9 100%)!important;box-shadow:0 5px 16px #5c44210d,inset 0 1px #ffffff!important;transition:transform .18s cubic-bezier(.16,1,.3,1),box-shadow .18s ease,border-color .18s ease}
.wallet-stack .account-tile[data-account-surface="savings"]{background:linear-gradient(112deg,#fffef8 0%,#f9faee 66%,#edf1d8 100%)!important;border-color:#d9dfc3!important}
.wallet-stack .account-tile[data-account-surface="cash"]{background:linear-gradient(112deg,#fffdf8 0%,#fff7ee 66%,#f9e8d5 100%)!important;border-color:#ead9c5!important}
.wallet-stack .account-tile:hover{filter:none;transform:translateY(-2px);box-shadow:0 10px 22px #5c442119,inset 0 1px #ffffff!important}
.wallet-stack .account-tile>.account-tile-heading{font-family:var(--font-display);font-weight:600;font-size:.95rem!important;letter-spacing:-.01em;color:#4a3b2b}
.wallet-stack .account-tile>strong{font-family:var(--font-display);font-size:1.2rem!important;font-weight:600;letter-spacing:-.025em;color:#3f3526}
.wallet-stack .account-tile>small{font-size:.7rem!important;font-weight:600;letter-spacing:.02em;color:#76684e!important}
.wallet-stack .account-tile .account-tile-symbol{width:42px;height:42px;flex-basis:42px;border-radius:11px;box-shadow:0 2px 6px #5c442113}
.wallet-stack .account-tile .account-tile-symbol img{width:42px;height:42px}
@media(max-width:820px){.wallet-stack .wallet-card.account-tile{min-height:90px!important;padding:14px 16px!important}.wallet-stack .account-tile>.account-tile-heading{font-size:.87rem!important}.wallet-stack .account-tile>strong{font-size:1.05rem!important}}
@media(max-width:370px){.wallet-stack .account-tile .account-tile-symbol,.wallet-stack .account-tile .account-tile-symbol img{width:34px;height:34px}.wallet-stack .account-tile .account-tile-symbol{flex-basis:34px}.wallet-stack .account-tile>.account-tile-heading{font-size:.8rem!important}.wallet-stack .account-tile>strong{font-size:.94rem!important}}

/* Quietly saturated account colours; no white fade. */
.wallet-stack .wallet-card.account-tile{background:#f4dfaa!important;border-color:#e7c982!important;box-shadow:0 5px 16px #72501914,inset 0 1px #fff6da!important}
.wallet-stack .account-tile[data-account-surface="savings"]{background:#dce7b9!important;border-color:#bdcf96!important;box-shadow:0 5px 16px #4e652118,inset 0 1px #f2f7db!important}
.wallet-stack .account-tile[data-account-surface="cash"]{background:#f5cda8!important;border-color:#e9b480!important;box-shadow:0 5px 16px #89582b18,inset 0 1px #ffead1!important}
.wallet-stack .account-tile:hover{box-shadow:0 10px 22px #60472025,inset 0 1px #fff8df!important}

/* The credit card belongs to the same tactile family, with a cool accent. */
.credit-card-shelf .wallet-card-credit{min-height:132px!important;padding:15px 18px!important;border:1px solid #a7c9c8!important;border-radius:18px!important;background:#cce1dd!important;box-shadow:0 5px 16px #3c697018,inset 0 1px #eef8f3!important;gap:5px}
.credit-card-shelf .wallet-card-credit:hover{background:#cce1dd!important;border-color:#7fb4b4!important;box-shadow:0 10px 22px #3c697024!important;transform:translateY(-2px)}
.credit-card-shelf .wallet-card-credit .wallet-card-credit-name{font-family:var(--font-display);font-size:.95rem;font-weight:600;color:#355358}
.credit-card-shelf .wallet-card-credit .wallet-card-credit-mark{display:grid;place-items:center;width:42px;height:42px;padding:0;overflow:hidden;border:0;border-radius:11px;background:transparent;box-shadow:0 2px 6px #3c69701b}
.wallet-card-credit-mark img{display:block;width:42px;height:42px}
.credit-card-shelf .wallet-card-credit .wallet-card-credit-balance{margin-top:3px}
.credit-card-shelf .wallet-card-credit .wallet-card-credit-balance strong{font-size:1.4rem!important;color:#294951!important}
.credit-card-shelf .wallet-card-credit .wallet-card-credit-balance>span{font-size:.68rem;font-weight:600;letter-spacing:.02em;color:#4f7070!important}
.credit-card-shelf .wallet-card-credit .wallet-card-credit-usage-track{height:4px;background:#a9c9c7}
.credit-card-shelf .wallet-card-credit .wallet-card-credit-usage-bar{background:#568b8d}
.credit-card-shelf .wallet-card-credit .wallet-card-bottom>span:first-child{font-weight:600;color:#3b5e60!important}
.credit-card-shelf .wallet-card-credit .wallet-card-credit-status.positive{background:#eaf4d7;color:#4f702c}
@media(max-width:820px){.credit-card-shelf .wallet-card-credit{min-height:128px!important;padding:14px 16px!important}}

/* Focused transaction entry: one clear amount, compact choices, calm inputs. */
.transaction-entry-modal{width:min(100%,520px);padding:26px 28px 28px;border:1px solid #e4d1ac;border-radius:24px;background:#fffaf0;box-shadow:0 30px 80px #382d1d35}
.transaction-entry-modal .modal-header{align-items:center;margin-bottom:21px}
.transaction-entry-modal .modal-header h2{margin:0;font-size:1.55rem;letter-spacing:-.025em;color:#3d3325}
.transaction-entry-modal .modal-header .icon-button{width:36px;height:36px;min-height:36px;border-radius:50%;background:#f4ead8;border:0;color:#69583d}
.transaction-entry-modal .transaction-type-switcher{gap:4px;margin:0 0 18px;padding:4px;border:1px solid #e8dac2;border-radius:13px;background:#f4ead9}
.transaction-entry-modal .transaction-type-choice{min-height:42px;justify-content:center;padding:7px 10px;border:0;border-radius:9px;text-align:center;box-shadow:none}
.transaction-entry-modal .transaction-type-choice-icon,.transaction-entry-modal .transaction-type-choice small{display:none}
.transaction-entry-modal .transaction-type-choice strong{font-size:.82rem;font-weight:700}
.transaction-entry-modal .transaction-type-choice.active{background:#fffaf0;box-shadow:0 2px 7px #7456321a}
.transaction-entry-modal .transaction-type-choice.active.expense{color:#a55317}
.transaction-entry-modal .transaction-type-choice.active.income{color:#4f783e}
.transaction-entry-modal .transaction-type-choice.active.transfer{color:#3e7887}
.transaction-entry-modal .transaction-type-choice:hover{background:#fff8eb;transform:none}
.transaction-entry-modal .transaction-flow-hint{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.transaction-entry-modal form{gap:14px}
.transaction-entry-modal label>span{margin-bottom:6px;color:#594b36;font-size:.77rem;font-weight:700;letter-spacing:0}
.transaction-entry-modal input,.transaction-entry-modal select{min-height:48px;border:1px solid #ddcfb6;border-radius:12px;background:#fffdf8;color:#3c3328}
.transaction-entry-modal input:focus-visible,.transaction-entry-modal select:focus-visible{border-color:#c8893c;outline:2px solid #f4c67c;outline-offset:1px}
.transaction-entry-modal .amount-field>div{min-height:72px;border:1px solid #e6bf70;border-radius:15px;background:#fff0c7;box-shadow:inset 0 1px #fff8e5}
.transaction-entry-modal .amount-field>div>span{padding-left:19px;color:#865315;font-size:1rem;font-weight:700}
.transaction-entry-modal .amount-field input{min-height:70px;padding-left:10px;border:0;background:transparent;font-family:var(--font-display);font-size:2rem;font-weight:600;letter-spacing:-.025em;box-shadow:none}
.transaction-entry-modal .amount-field input:focus-visible{outline:0;border:0}
.transaction-entry-modal input[type=number]{appearance:textfield;-moz-appearance:textfield}
.transaction-entry-modal input[type=number]::-webkit-inner-spin-button,.transaction-entry-modal input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.transaction-entry-modal #transaction-date+small,.transaction-entry-modal #transaction-account-helper{display:none}
.transaction-entry-modal .submit-button{min-height:50px;margin-top:7px;border-radius:12px;font-weight:700}
.transaction-entry-modal .transaction-special-types{margin:0 0 14px;background:#f8efdc;border-color:#e7d7b7}
@media(max-width:820px){.transaction-entry-modal{max-height:calc(100dvh - 24px);padding:21px 19px 24px}.transaction-entry-modal .modal-header{margin-bottom:16px}.transaction-entry-modal .modal-header h2{font-size:1.4rem}.transaction-entry-modal form{gap:12px}.transaction-entry-modal .transaction-type-switcher{margin-bottom:15px}}
