.mortgage-lab { --mortgage-french-exact: #0d7479; --mortgage-french: #2964bb; --mortgage-italian: #ad512d; --mortgage-bullet: #704ab2; }
.mortgage-panel { padding: clamp(1rem, 3vw, 2rem); background: #fffaf0; border: 1px solid #dacfbf; border-radius: 1.25rem; }
.mortgage-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.mortgage-fields label { font-weight: 700; }
.mortgage-fields :is(input, select) { margin-top: .4rem; }
.mortgage-status { margin: 1.25rem 0; font-weight: 600; }
.mortgage-status.is-error { color: #aa2424; }
.mortgage-comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.mortgage-card { border: 2px solid #ddd3c5; border-radius: 1rem; padding: 1.25rem; background: #fff; }
.mortgage-card.is-selected { border-color: #0d7479; box-shadow: 0 0 0 2px #0d74791f; }
.mortgage-card h3 { font-size: 1.15rem; min-height: 2.7em; }
.mortgage-card dl { display: grid; grid-template-columns: 1fr auto; gap: .7rem .5rem; }
.mortgage-card dt { font-weight: 400; }
.mortgage-card dd { text-align: right; font-weight: 700; margin: 0; white-space: nowrap; font-variant-numeric: tabular-nums; }
.mortgage-conversion, .mortgage-payment-detail { padding: 1rem; background: #e9f3f1; border-left: 4px solid #0d7479; border-radius: .3rem; }
.mortgage-chart-scroll { overflow-x: auto; }
.mortgage-chart { display: block; width: 100%; min-width: 550px; height: auto; }
.mortgage-chart text { font: 13px system-ui, sans-serif; fill: #354954; }
.mortgage-chart .chart-grid { stroke: #dcd9d0; stroke-width: 1; }
.mortgage-chart .chart-line { fill: none; stroke-width: 3; stroke-linejoin: round; }
.mortgage-legend { display: flex; flex-wrap: wrap; list-style: none; gap: .8rem 1.5rem; padding: 0; }
.mortgage-legend li::before { content: ''; display: inline-block; width: 1.5rem; border-top: 4px solid; margin-right: .5rem; vertical-align: middle; }
.mortgage-french_exact::before { color: var(--mortgage-french-exact); }
.mortgage-french::before { color: var(--mortgage-french); }
.mortgage-italian::before { color: var(--mortgage-italian); border-top-style: dashed !important; }
.mortgage-bullet::before { color: var(--mortgage-bullet); border-top-style: dotted !important; }
.mortgage-table-scroll { max-height: 580px; }
.mortgage-table { min-width: 900px; font-variant-numeric: tabular-nums; }
.mortgage-table :is(th, td) { text-align: right; padding: .65rem; white-space: nowrap; }
.mortgage-table th:first-child { text-align: left; }
.mortgage-table thead th { position: sticky; top: 0; background: #f0e9dc; z-index: 1; }
.mortgage-table tfoot { font-weight: 700; border-top: 2px solid #0d7479; }
@media (max-width: 1000px) { .mortgage-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } .mortgage-comparison { grid-template-columns: 1fr; } .mortgage-card h3 { min-height: 0; } }
@media (max-width: 540px) { .mortgage-fields { grid-template-columns: 1fr; } }