/* How long will my savings last? (calc/savings-last.html) */
.sl-toggle { display: flex; gap: 10px; align-items: flex-start; font-weight: 600; color: var(--ink); cursor: pointer; line-height: 1.4; }
.sl-toggle input { width: 20px; height: 20px; margin: 1px 0 0; flex: none; accent-color: var(--brand); cursor: pointer; }
.sl-badline { margin: 14px 0 0; padding: 12px 14px; border-left: 3px solid var(--gold); background: rgba(233, 185, 78, .12); border-radius: 0 10px 10px 0; color: #fff; max-width: 64ch; }
.sl-chart svg { width: 100%; display: block; overflow: visible; }
.sl-grid { stroke: rgba(11, 40, 78, .1); stroke-width: 1; }
.sl-zero { stroke: rgba(11, 40, 78, .35); stroke-width: 1; }
.sl-ax { font: 500 12px var(--sans); fill: var(--muted); }
.sl-area { fill: rgba(29, 103, 177, .14); }
.sl-line { fill: none; stroke: var(--brand); stroke-width: 2.5; stroke-linejoin: round; }
.sl-line.sl-bad { stroke: var(--gold); stroke-dasharray: 6 4; }
.sl-k-plan { background: var(--brand); }
.sl-k-bad { background: var(--gold); }
.key[hidden] { display: none; }