:root{
  --ic-accent: #334199;
  --ic-muted:#8CB9FF;
}
.ic-mortgage{border:1px solid #e5e7eb;border-radius:12px;padding:16px;margin:12px 0;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.ic-mortgage__header h3{margin:.2rem 0 0;font-size:1.15rem}
.ic-mortgage__header p{margin:.2rem 0 1rem;color:#555}
.ic-mortgage__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.ic-input{display:flex;gap:6px;align-items:center;border:1px solid #e5e7eb;border-radius:8px;padding:6px}
.ic-input input{border:0;width:100%;outline:none;font:inherit}
.ic-mortgage__results{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:12px}
.ic-card{border:1px solid #e5e7eb;border-radius:12px;padding:12px}
.ic-kpi__label{color:#666;font-size:.9rem}
.ic-kpi__value{font-size:1.4rem;display:flex;gap:6px;align-items:flex-end}
.ic-kpi__value strong{font-size:1.8rem}
.ic-kpi__sub{color:#666;margin-top:2px}
.ic-donut{display:flex;gap:12px;align-items:center;margin-top:8px}
.ic-donut__svg{width:110px;height:110px}
.ic-donut__bg{fill:none;stroke:#eef2ff;stroke-width:6;}
.ic-donut__slice{fill:none;stroke-width:6;transform: rotate(-90deg); transform-origin: 50% 50%;}
.ic-donut__pni{stroke: var(--ic-accent);}
.ic-donut__tax{stroke: var(--ic-muted);}
.ic-donut__ins{stroke: #334455;}
.ic-donut__hoa{stroke: #ffb56b;}
.ic-donut__center{font-size:8px;fill:#333}
.ic-legend{display:flex;flex-direction:column;gap:4px}
.ic-legend .dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px}
.dot--pni{background: var(--ic-accent);}
.dot--tax{background: var(--ic-muted);}
.dot--ins{background:#334455}
.dot--hoa{background:#ffb56b}
.ic-breakdown{display:grid;gap:6px}
.ic-breakdown div{display:flex;justify-content:space-between}
.ic-breakdown small{color:#666}