/* 대출계산기 전용 CSS (2026-10-06). 2패널 계산형 레이아웃 ln-* + 비교표·상환표. 공용 부품은 assets/v2.css */
.ln-modes{padding:14px 18px 12px;border-bottom:1px solid var(--soft)}
.ln-modes .v2-seg button{height:32px;padding:0 12px;font-family:var(--sans);font-size:12.5px;font-weight:700}
.ln-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.ln-in{padding:16px 18px 18px;min-width:0}
.ln-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 14px}
.ln-fields .full{grid-column:1 / -1}
.ln-fields .v2-f{min-width:0}
.ln-fields input[aria-invalid="true"]{color:var(--accent)}
.ln-words{display:block;min-height:16px;margin-top:4px;font-family:var(--sans);font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.ln-hint{display:block;margin-top:4px;font-family:var(--sans);font-size:11.5px;line-height:1.5;color:var(--muted)}
.ln-chips{margin-top:6px}
.ln-chips button{height:26px;padding:0 9px;font-family:var(--mono);font-size:11px;font-weight:700}
.ln-term{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.ln-term .v2-input{flex:1 1 64px;min-width:64px} /* 칸이 좁으면(1280px·긴 단위 이름) 입력칸을 짓누르지 않고 단위 버튼을 아랫줄로 */
.ln-term .v2-seg{flex:0 0 auto}
.ln-term .v2-seg button{height:var(--v2-ctl,42px)}
.ln-early-wrap{display:grid;gap:10px}
.ln-early{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 14px;padding:12px;border:1px solid var(--soft);border-radius:var(--radius);background:var(--paper)}
.ln-early .full{grid-column:1 / -1}
.ln-early[hidden],.ln-fields .v2-f[hidden],.ln-early .v2-f[hidden],.ln-early-wrap[hidden],.ln-all[hidden]{display:none}
.ln-help{margin:12px 0 0;font-family:var(--sans);font-size:12.5px;line-height:1.6;color:var(--muted)}
.ln-acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:14px}
.ln-out{padding:16px 18px 18px;min-width:0;border-left:1px solid var(--soft);display:flex;flex-direction:column}
.ln-out .v2-label{display:block;margin-bottom:6px}
.ln-out .v2-big small{margin-left:4px;font-size:14px;font-weight:600;color:var(--muted)}
.ln-bar{margin:12px 0 0}
.ln-bar i{display:block;height:6px;background:var(--soft);border-radius:3px;overflow:hidden}
.ln-bar i b{display:block;height:100%;width:0;background:var(--accent);transition:width 240ms ease}
.ln-bar span{display:block;margin-top:6px;font-family:var(--sans);font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.ln-bar span strong{color:var(--ink);font-weight:700}
.ln-rows{margin-top:14px;flex:1}
.ln-foot{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px solid var(--soft)}
.ln-foot .v2-status{margin-left:auto}
.v2-big.is-empty span{font-size:18px;font-weight:600;color:var(--muted)}
.ln-cmp,.ln-sched{padding:14px 18px 16px;border-top:1px solid var(--soft)}
.ln-cmp .v2-label,.ln-sched .v2-label{display:block;margin-bottom:8px}
.ln-cmp .tbl,.ln-sched .tbl{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.ln-cmp,.ln-sched{min-width:0}
.ln-table{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:13px}
.ln-table th{font-size:11px;font-weight:600;letter-spacing:.02em;color:var(--muted);text-align:left;padding:8px 8px 6px;border-bottom:1px solid var(--line);white-space:nowrap}
.ln-table td{padding:7px 8px;border-bottom:1px solid var(--soft);vertical-align:middle;white-space:nowrap}
.ln-table tr:last-child td{border-bottom:0}
.ln-table th.n,.ln-table td.n{text-align:right;font-variant-numeric:tabular-nums}
.ln-table td small{display:block;font-size:10.5px;color:var(--muted);white-space:normal}
.ln-table tr.is-sel td{background:var(--accent-wash);font-weight:700}
.ln-table tr.is-grace td,.ln-table tr.is-early td{background:var(--accent-wash)}
.ln-all{margin-top:10px}
.ln-all summary{cursor:pointer;list-style:none;font-family:var(--sans);font-size:12px;font-weight:600;color:var(--muted);padding:8px 0}
.ln-all summary::-webkit-details-marker{display:none}
.ln-all summary::before{content:"▸";display:inline-block;margin-right:6px;transition:transform var(--ease)}
.ln-all[open] summary::before{transform:rotate(90deg)}
.ln-all summary:hover{color:var(--ink)}
.ln-all[open] summary{color:var(--ink)}
.ln-all .tbl{max-height:420px;overflow:auto}
@media (max-width:720px){
  .ln-grid{grid-template-columns:minmax(0,1fr)}
  .ln-out{order:-1;border-left:0;border-bottom:1px solid var(--soft)}
}
@media (max-width:420px){
  .ln-modes,.ln-in,.ln-out,.ln-cmp,.ln-sched{padding-left:12px;padding-right:12px}
  .ln-fields,.ln-early{grid-template-columns:minmax(0,1fr)}
}
@container v2in (max-width:349px){ .ln-early{grid-template-columns:minmax(0,1fr)} } /* 테두리 상자 안 반쪽 칸에서 상환액 100,000,000이 잘린다(728~1300px 화면 일부) */