.repayment-form .form-fields { gap:16px; }
.repayment-loan { display:flex; align-items:center; gap:12px; min-width:0; padding:14px; border-radius:14px; background:var(--debt-soft); }
.repayment-symbol { display:grid; place-items:center; width:38px; height:38px; flex:none; border-radius:12px; color:var(--debt); background:var(--surface); }
.repayment-symbol .icon { width:var(--icon-nav); height:var(--icon-nav); }
.repayment-loan b,.repayment-loan small { display:block; overflow-wrap:anywhere; }
.repayment-loan b { font-size:var(--type-label); }
.repayment-loan small { margin-top:2px; color:var(--muted); font-size:var(--type-caption); }
.repayment-form .repayment-date { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0; }
.repayment-form .repayment-date input { margin:0; min-width:0; width:auto; max-width:70%; }
.repayment-before,.repayment-projection>div { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:4px 12px; font-size:var(--type-note); }
.repayment-before { color:var(--muted); }
.repayment-before strong,.repayment-projection b,.repayment-projection strong { margin-inline-start:auto; text-align:end; color:var(--ink); font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.repayment-money { min-width:0; }
.repayment-money-label,.repayment-money-line { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.repayment-form .repayment-money-label label { margin:0; font-size:var(--type-note); font-weight:var(--weight-semibold); }
.repayment-money-label small,.repayment-memo small { color:var(--muted); font-size:var(--type-caption); font-weight:var(--weight-medium); }
.repayment-money-label button { min-height:44px; padding:0 6px; color:var(--debt); font-weight:var(--weight-semibold); font-size:var(--type-caption); }
.repayment-money-line { --amount-focus:var(--debt); align-items:baseline; gap:6px; }
.repayment-form .repayment-money-line input { min-width:0; width:100%; margin:0; min-height:48px; padding:4px 0; border:0; border-radius:0; background:transparent; box-shadow:none; font-size:var(--type-entry-amount); font-weight:var(--weight-bold); line-height:1.25; letter-spacing:-.025em; font-variant-numeric:tabular-nums; }
.repayment-form .repayment-money-line input.long-amount { font-size:var(--type-entry-amount-compact); }
.repayment-money-line input::placeholder { color:var(--text-sub); opacity:1; }
.repayment-money-line span { color:var(--text-sub); font-size:var(--type-money-unit); font-weight:var(--weight-semibold); }
.repayment-form .repayment-note,.repayment-feedback { margin:0; font-size:var(--type-caption); color:var(--muted); line-height:1.55; overflow-wrap:anywhere; }
.repayment-money+.repayment-note { margin-top:-10px; }
.repayment-source { display:grid; gap:5px; }
.repayment-source label { margin:0; }
.repayment-projection { display:grid; min-width:0; gap:6px; padding:13px 14px; border-radius:12px; background:var(--neutral-soft); }
.repayment-projection>div:first-child { border-bottom:1px solid var(--line); padding-bottom:8px; margin-bottom:2px; }
.repayment-projection>div:first-child strong { color:var(--debt); font-size:var(--type-section); }
.repayment-final-balance { display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin-bottom:7px; color:var(--muted); font-size:var(--type-caption); }
.repayment-final-balance b { text-align:end; color:var(--text); font-size:var(--type-label); font-weight:var(--weight-bold); font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.repayment-projection:not(:has([data-repay-source-row]:not([hidden])))>div:first-child { border:0; padding:0; margin:0; }
.repayment-form [hidden] { display:none; }
.repayment-feedback { color:var(--danger); }
.repayment-memo { border-top:1px solid var(--line); }
.repayment-memo summary { display:flex; min-height:44px; align-items:center; justify-content:space-between; cursor:pointer; font-size:var(--type-note); font-weight:var(--weight-semibold); }
.repayment-history h3 { display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin:0 0 4px; font-size:var(--type-label); }
.repayment-history h3 small,.repayment-history li small { color:var(--muted); font-size:var(--type-caption); font-weight:var(--weight-medium); }
.repayment-history ul { margin:0; padding:0; list-style:none; }
.repayment-history li button { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,auto) 13px; align-items:center; gap:8px; width:100%; min-height:54px; padding:9px 0; text-align:start; border-bottom:1px solid var(--line); }
.repayment-history-date,.repayment-history-total { display:grid; min-width:0; gap:3px; font-size:var(--type-note); }
.repayment-history-date small { overflow-wrap:anywhere; }
.repayment-history-total { text-align:end; font-variant-numeric:tabular-nums; }
.repayment-history li .icon { color:var(--muted); width:var(--icon-small); height:var(--icon-small); }
.repayment-history summary { min-height:44px; padding:10px 0; color:var(--muted); font-size:var(--type-note); cursor:pointer; }
@media(max-width:340px) { .repayment-history li button { gap:5px; } .repayment-history-total { max-width:7.6em; } }