/* Cash Flow River: the whole life calculator. Builds on site.css and planner.css. */
.life-hero h1 em{font-style:italic;color:var(--river-deep)}
@media (prefers-color-scheme:dark){.life-hero h1 em{color:var(--river-light)}}
.chart .ln{fill:none;stroke-width:3;stroke-linejoin:round}
.chart .ln.paid{stroke:var(--ink-2);stroke-dasharray:6 5;stroke-width:2}
.chart .ln.guar{stroke:var(--river);stroke-width:2;opacity:.7}
.chart .ln.cv{stroke:var(--river-deep)}
.chart .ln.side{stroke:var(--canoe)}
.legend .sw{display:inline-block;width:18px;height:0;border-top:3px solid;margin-right:6px;vertical-align:middle;border-radius:0}
.legend .sw.paid{border-top:2px dashed var(--ink-2)}
.legend .sw.guar{border-color:var(--river);opacity:.7}
.legend .sw.cv{border-color:var(--river-deep)}
.legend .sw.side{border-color:var(--canoe)}
@media (prefers-color-scheme:dark){.chart .ln.cv{stroke:var(--river-light)}.legend .sw.cv{border-color:var(--river-light)}}
.explain{padding:40px 20px;max-width:1120px;margin:0 auto}
.explain-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.explain-grid>div{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px}
.explain-grid h3{margin:0 0 6px}
.explain-grid p{margin:0;color:var(--ink-2);font-size:16px}
#lifeTable td,#lifeTable th{font-size:13px}