.icon-button{display:grid;width:44px;height:44px;place-items:center;border:0;border-radius:var(--radius-full);background:#40302a0d;color:var(--knj-brown);cursor:pointer;font-size:28px;line-height:1}.app-shell{min-height:100vh;background:transparent}.app-screen{width:min(100%,430px);min-height:100vh;margin:0 auto;padding:20px var(--space-4) 100px}.bottom-nav{position:fixed;right:max(14px,calc((100vw - 430px)/2 + 14px));bottom:10px;left:max(14px,calc((100vw - 430px)/2 + 14px));z-index:20;display:grid;grid-template-columns:repeat(5,1fr);align-items:stretch;max-width:402px;margin:0 auto;border:var(--border-soft);border-radius:24px;background:var(--surface-card-solid);box-shadow:var(--shadow-card);padding:8px 8px 7px;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.bottom-nav-item{display:grid;align-content:end;justify-items:center;gap:3px;min-width:0;border:0;background:transparent;color:var(--text-muted);cursor:pointer;font-size:var(--text-micro);font-weight:600;line-height:1.25;text-decoration:none}.bottom-nav-item.active{color:var(--knj-mint-dark);font-weight:600}.bottom-nav-item.primary{transform:none}.bottom-nav-item.primary .bottom-nav-icon{width:48px;height:48px;border-radius:999px;background:var(--knj-mint-dark);color:#fff;box-shadow:0 7px 16px #48aa9047}.bottom-nav-icon{display:grid;width:28px;height:28px;place-items:center}.bottom-nav-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.9}.create-menu-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;display:flex;align-items:flex-end;justify-content:center;background:#5b4b462e;padding:18px 14px 98px}.create-menu{position:relative;width:min(100%,402px);border:1px solid rgba(91,75,70,.08);border-radius:var(--radius-lg);background:var(--surface-card-solid);box-shadow:var(--shadow-raised);padding:18px 16px 16px}.create-menu-close{position:absolute;top:12px;right:14px;display:grid;width:44px;height:44px;place-items:center;border:0;border-radius:999px;background:transparent;color:var(--knj-brown);cursor:pointer;font-size:28px;line-height:1}.create-menu-heading{display:grid;justify-items:center;gap:4px;margin-bottom:16px;padding:0 34px;text-align:center}.create-menu-heading h2{margin:0;font-size:var(--text-h2);line-height:var(--line-heading)}.create-menu-heading p{margin:0;color:var(--text-muted);font-size:var(--text-caption)}.create-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.create-choice{position:relative;display:grid;min-height:150px;align-content:start;justify-items:start;gap:8px;border:var(--border-soft);border-radius:var(--radius-lg);color:var(--knj-brown);cursor:pointer;padding:12px;text-align:left}.create-choice.mint{background:var(--surface-protected)}.create-choice.peach{background:#ffa28c1f}.create-choice-mascot{width:78px;height:64px}.create-choice strong,.create-choice small{display:block}.create-choice strong{font-size:var(--text-body);font-weight:600;line-height:var(--line-heading)}.create-choice small{margin-top:3px;color:var(--text-muted);font-size:var(--text-micro);line-height:var(--line-compact)}.create-choice-arrow{position:absolute;right:12px;bottom:12px;display:grid;width:28px;height:28px;place-items:center;border-radius:999px;background:#ffffffc2;color:var(--knj-mint-dark);font-size:24px;line-height:1}.page-header,.screen-hero{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);min-height:104px;margin-bottom:var(--space-3)}.page-header-copy,.screen-hero>div{min-width:0}.page-header h1,.screen-hero h1{margin:0 0 var(--space-1);font-size:var(--text-h1);line-height:var(--line-display);letter-spacing:-.01em}.page-header p,.screen-hero p{margin:0;color:var(--text-muted);font-size:var(--text-caption);line-height:var(--line-heading)}.page-header-mascot,.screen-mascot{flex:0 0 108px;width:108px;height:88px;filter:drop-shadow(0 8px 16px rgba(64,48,42,.07))}.detail-header{display:grid;gap:var(--space-3);margin-bottom:var(--space-4);padding-top:var(--space-1)}.detail-header-topline{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:var(--space-2);min-height:44px}.detail-header-topline>p{overflow:hidden;margin:0;color:var(--text-muted);font-size:var(--text-micro);line-height:var(--line-compact);text-align:center;text-overflow:ellipsis;white-space:nowrap}.detail-header-badge{display:flex;min-width:44px;justify-content:flex-end}.detail-header-copy{display:grid;gap:var(--space-1);padding:0 var(--space-1)}.detail-header-copy h1,.detail-header-copy p{margin:0}.detail-header-copy h1{font-size:var(--text-h1);font-weight:700;line-height:var(--line-display);letter-spacing:-.01em}.detail-header-copy p{max-width:380px;color:var(--text-muted);font-size:var(--text-caption);line-height:var(--line-body)}.compact-progress{display:grid;gap:var(--space-2);margin-bottom:var(--space-4);border:var(--border-soft);border-radius:var(--radius-md);background:var(--surface-card-solid);box-shadow:var(--shadow-card);padding:var(--space-3)}.compact-progress-copy{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3)}.compact-progress-copy strong,.compact-progress-copy span{font-size:var(--text-micro);line-height:var(--line-compact)}.compact-progress-copy strong{color:var(--knj-mint-dark);font-weight:600}.compact-progress-copy span{overflow:hidden;color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap}.compact-progress-segments{display:grid;grid-auto-columns:1fr;grid-auto-flow:column;gap:var(--space-1)}.compact-progress-segments>span{height:6px;border-radius:var(--radius-full);background:#40302a17}.compact-progress-segments>span.complete{background:var(--knj-mint-dark)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;margin:-1px;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap}.ui-card,.soft-card{border:var(--border-soft);border-radius:var(--radius-lg);background:var(--surface-card-solid);box-shadow:var(--shadow-card)}.filter-tabs,.tabs{display:flex;gap:var(--space-1);overflow-x:auto;margin:0 -2px var(--space-4);padding:2px 2px var(--space-1);scrollbar-width:none}.filter-tabs::-webkit-scrollbar,.tabs::-webkit-scrollbar{display:none}.filter-tabs button,.tabs button{display:inline-flex;flex:0 0 auto;align-items:center;gap:6px;min-height:44px;border:1px solid transparent;border-radius:var(--radius-full);background:transparent;color:#5b4b46b8;cursor:pointer;padding:0 11px;font-size:var(--text-caption);white-space:nowrap}.filter-tabs button small{display:grid;min-width:18px;height:18px;place-items:center;border-radius:var(--radius-full);background:#40302a0f;color:inherit;font-size:var(--text-micro);font-weight:600;padding:0 5px}.filter-tabs button.active,.tabs button.active{border-color:#48aa901a;background:#9bd9c847;color:var(--knj-mint-dark);font-weight:600}.filter-tabs button.active small{background:#ffffffad}.empty-state{display:grid;min-height:320px;align-content:center;justify-items:center;gap:var(--space-4);border:var(--border-soft);border-radius:var(--radius-lg);background:var(--surface-card-solid);box-shadow:var(--shadow-card);padding:var(--space-6) var(--space-5);text-align:center}.empty-state-illustration{display:grid;width:148px;height:120px;place-items:center;border-radius:44% 56% 52% 48%;background:#9bd9c814}.empty-state-illustration svg{width:132px;height:106px}.empty-state-copy{display:grid;max-width:300px;gap:var(--space-2)}.empty-state-copy h2,.empty-state-copy p{margin:0}.empty-state-copy h2{font-size:var(--text-h2);line-height:var(--line-heading)}.empty-state-copy p{color:var(--text-muted);font-size:var(--text-caption);line-height:var(--line-body)}.empty-state-action{width:min(100%,260px)}.empty-state-action .primary-button{display:grid;place-items:center}.list-summary{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-bottom:10px;padding:0 2px;color:var(--text-muted);font-size:var(--text-caption)}.list-summary strong{color:var(--knj-brown)}.demo-controls{margin-bottom:12px;border:1px solid rgba(91,75,70,.08);border-radius:18px;background:#ffffffc2;box-shadow:0 6px 18px #5b4b460f}.demo-controls summary{cursor:pointer;list-style:none;padding:10px 14px;color:#5b4b46bd;font-size:13px;font-weight:700}.demo-controls summary::-webkit-details-marker{display:none}.demo-controls summary:after{content:"+";float:right;color:var(--knj-mint-dark);font-size:18px;line-height:1}.demo-controls[open] summary:after{content:"-"}.demo-control-row,.demo-control-grid{display:grid;gap:10px}.demo-control-row{grid-template-columns:86px 1fr;align-items:center;padding:0 14px 14px}.demo-control-row>span,.demo-select span{color:#5b4b46ad;font-size:13px}.demo-control-grid{padding-bottom:14px}.demo-select{display:grid;grid-template-columns:86px 1fr;align-items:center;gap:10px;padding:0 14px}.demo-select select{min-height:36px;border:1px solid rgba(91,75,70,.12);border-radius:999px;background:var(--knj-cream);color:var(--knj-brown);padding:0 12px}.status-pill{flex:0 0 auto;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:600}.status-pill.borrower{background:var(--tint-protected);color:var(--knj-mint-dark)}.status-pill.lender{background:#ffa28c42;color:#c56750}.eyebrow,.caption,.progress-label{margin:0;color:var(--text-muted);font-size:var(--text-caption);line-height:1.4}.segmented{display:inline-flex;overflow:hidden;border-radius:999px;background:#5b4b4612;padding:3px}.segmented button,.stage-chips button,.secondary-button{border:0;color:var(--knj-brown);background:transparent;cursor:pointer}.range-labels{display:flex;justify-content:space-between;margin-top:-8px;color:#5b4b4694;font-size:var(--text-micro)}.segmented button{min-height:34px;padding:0 12px;border-radius:999px;font-size:13px}.segmented button.active{background:var(--knj-mint);font-weight:700}.segmented button.active.peach{background:var(--knj-peach)}.role-pill,.widget-title-chip{flex:0 0 auto;border-radius:999px;padding:7px 11px;font-size:13px;font-weight:600}.role-pill.borrower,.widget-title-chip.borrower,.widget-title-chip.mint{background:var(--tint-protected);color:var(--knj-mint-dark)}.role-pill.lender,.widget-title-chip.lender,.widget-title-chip.peach{background:#ffa28c42;color:#c56750}.progress-label{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:16px;font-weight:600}.progress-track{overflow:hidden;height:9px;margin-top:7px;border-radius:999px;background:var(--tint-protected)}.progress-track span{display:block;height:100%;border-radius:inherit;background:var(--knj-mint-dark)}.feedback{margin-top:12px;border-radius:16px;padding:12px 14px;font-size:15px;line-height:1.5}.feedback.success{background:var(--tint-protected);color:var(--knj-mint-dark)}.feedback.error{background:var(--tint-overdue);color:var(--tone-overdue)}.feedback.info{background:var(--tint-closed);color:var(--tone-closed)}.widget-title-chip{display:inline-flex;margin-bottom:14px}form,.button-stack{display:grid;gap:14px}.field,.file-field{display:grid;gap:7px}.field span,.file-field span{color:var(--text-muted);font-size:var(--text-caption);font-weight:600}.field input,.field textarea{box-sizing:border-box;width:100%;border:var(--border-control);border-radius:var(--radius-md);background:var(--surface-app);color:var(--knj-brown);padding:12px 13px;outline-color:var(--knj-mint-dark)}.field textarea{resize:vertical}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.file-field{border:1px dashed rgba(91,75,70,.24);border-radius:16px;background:#fffdf9c7;padding:14px}.file-field input{width:100%}.file-field strong{color:var(--knj-mint-dark);font-size:13px}.primary-button,.secondary-button,.soft-button,.destructive-button,.text-button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;border-radius:var(--radius-full);padding:0 18px;font-size:var(--text-body);font-weight:600;transition:background-color .15s ease-out,box-shadow .15s ease-out,filter .15s ease-out}.primary-button{width:100%;border:0;background:var(--knj-mint-dark);box-shadow:0 5px 12px #48aa902e;color:#fff;cursor:pointer}.primary-button:hover{filter:brightness(.96)}.primary-button:disabled{cursor:not-allowed;opacity:.46}.secondary-button:disabled,.soft-button:disabled,.destructive-button:disabled,.text-button:disabled{cursor:not-allowed;opacity:.46}.primary-button.inline{width:auto}.secondary-button{cursor:pointer;border:var(--border-soft);background:var(--surface-card-solid);color:var(--knj-brown)}.secondary-button:hover{background:#40302a0a}.secondary-button.full{width:100%}.soft-button{border:1px solid rgba(72,170,144,.24);background:var(--tint-protected);color:var(--knj-mint-dark);cursor:pointer}.soft-button:hover{background:#9bd9c857}.soft-button.danger{border-color:#d7535338;background:var(--tint-overdue);color:var(--tone-overdue)}.destructive-button{border:0;background:var(--tone-overdue);box-shadow:0 5px 12px #d753532e;color:#fff;cursor:pointer}.destructive-button:hover{filter:brightness(.96)}.text-button{border:0;background:transparent;color:var(--knj-mint-dark);cursor:pointer}.text-button:hover{background:var(--tint-protected)}.text-button.danger{color:var(--tone-overdue)}.text-button.danger:hover{background:var(--tint-overdue)}.button-compact{min-height:44px;border-radius:var(--radius-md);padding:0 14px;font-size:var(--text-caption)}.button-row{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:14px}.signature-box{overflow:hidden;border:1px solid rgba(91,75,70,.14);border-radius:16px;background:var(--knj-cream)}.signature-pad{position:relative;min-height:190px}.signature-pad canvas{display:block;width:100%;height:190px;touch-action:none}.signature-pad span{pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:#5b4b466b;font-size:15px}.action-intro,.breakdown{margin-bottom:14px}.action-intro p,.waiting-card p{margin:0;color:#5b4b46b8;font-size:15px;line-height:1.5}.waiting-card h2,.action-intro h3{margin:4px 0 6px;font-size:17px;line-height:1.4}.amount-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid rgba(91,75,70,.09);font-size:15px}.amount-row strong{font-weight:700}.amount-row.strong{border-bottom:0;font-size:17px}.waiting-card{display:grid;justify-items:center;border:var(--border-soft);border-radius:var(--radius-lg);background:var(--surface-card-solid);box-shadow:var(--shadow-card);text-align:center;padding:28px 18px}.waiting-card>span{display:grid;width:54px;height:54px;place-items:center;border-radius:20px;background:#ffc8573d;color:var(--knj-brown);font-weight:700}@media(max-width:390px){.field-grid{grid-template-columns:1fr}.button-row{align-items:stretch;flex-direction:column}.primary-button.inline{width:100%}}