/* Деньги школы и цель месяца (v3, задача 5; 26.10): ползунок, столбики и шкала цели. Цвета только токены, обе темы. */
.money-body, .goal-body { padding: var(--s4); display: grid; gap: var(--s3); }
.money-ctl { display: grid; grid-template-columns: minmax(0, auto) minmax(120px, 1fr) auto; gap: var(--s3); align-items: center; }
.money-lbl { display: flex; align-items: baseline; gap: var(--s2); font-size: var(--t-sm); color: var(--muted); white-space: nowrap; }
.money-pct { font-size: var(--t-xl); font-weight: 650; color: var(--ink); font-variant-numeric: tabular-nums; }
.money-ctl input[type="range"] { width: 100%; padding: 0; border: 0; background: transparent; accent-color: var(--accent); min-height: 28px; }
.money-note { font-size: var(--t-sm); color: var(--muted); border-left: 3px solid var(--line); padding: var(--s1) var(--s3); }
.money-note.warn { border-left-color: var(--warn); color: var(--warn); background: var(--warn-soft); border-radius: 0 var(--r-sm) var(--r-sm) 0; }
.money-chart { display: grid; justify-items: start; }
.money-svg { width: 100%; max-width: 560px; height: auto; display: block; }
/* сплошное = оплачено (клуб: продления основным цветом, новые клиентки светлее; курсы своим цветом), пунктир = прогноз клуба */
.money-svg .bar-renew { fill: var(--accent); }
.money-svg .bar-new { fill: var(--accent); opacity: .36; }
.money-svg .bar-crs { fill: var(--gold); }
.money-svg .bar-fc { fill: var(--accent-soft); stroke: var(--accent); stroke-width: 1.2; stroke-dasharray: 4 3; }
.money-svg .bar-axis { stroke: var(--line); stroke-width: 1; }
.money-svg .bar-val { fill: var(--ink); font-size: 10.5px; font-weight: 600; font-variant-numeric: tabular-nums; font-family: var(--font); }
.money-svg .bar-mon, .money-svg .bar-cap { fill: var(--muted); font-size: 10.5px; font-family: var(--font); }
.money-svg .bar-mon.now { fill: var(--ink); font-weight: 650; }
.money-legend { display: flex; flex-wrap: wrap; gap: var(--s1) var(--s4); font-size: var(--t-sm); color: var(--muted); }
.money-key { display: inline-flex; align-items: center; gap: var(--s2); }
.money-key .sw { display: inline-block; flex: none; width: 12px; height: 12px; border-radius: 3px; box-sizing: border-box; }
.money-key .sw-renew { background: var(--accent); }
.money-key .sw-new { background: var(--accent); opacity: .36; }
.money-key .sw-crs { background: var(--gold); }
.money-key .sw-fc { background: var(--accent-soft); border: 1.5px dashed var(--accent); }
.money-rows { display: grid; gap: 0; }
.money-rows li { display: grid; grid-template-columns: minmax(110px, 9.5em) minmax(0, 1fr); gap: 2px var(--s3); align-items: baseline; padding: var(--s2) 0; border-top: 1px solid var(--line-soft); }
.money-rows li:first-child { border-top: 0; }
.money-lines { display: grid; gap: 2px; font-variant-numeric: tabular-nums; }
.money-total { margin-top: 2px; }
.money-sum { font-weight: 650; font-variant-numeric: tabular-nums; }
.money-lines .pill { justify-self: start; }
.money-how p { margin: var(--s1) 0 0; }
.money-prices > summary, .money-how > summary, .goal-how > summary { cursor: pointer; color: var(--accent); font-size: var(--t-sm); padding: var(--s1) 0; }
.money-prices .form { margin-top: var(--s2); max-width: 420px; }
.money-prices input[type="number"], .goal-form input[type="number"] { width: 100%; font-variant-numeric: tabular-nums; }

.goal-nav { display: flex; align-items: center; gap: var(--s3); }
.goal-nav b { min-width: 9.5em; text-align: center; text-transform: capitalize; }
.goal-line { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--s1) var(--s3); }
.goal-big { font-size: var(--t-xl); font-weight: 650; font-variant-numeric: tabular-nums; }
.goal-svg { width: 100%; height: auto; display: block; }
.goal-svg .goal-track { fill: var(--line-soft); }
.goal-svg .goal-fill { fill: var(--accent); }
.goal-svg .goal-mark { stroke: var(--ink); stroke-width: 2; }
.goal-facts { display: grid; gap: 0; }
.goal-facts li { display: flex; justify-content: space-between; gap: var(--s3); padding: var(--s2) 0; border-top: 1px solid var(--line-soft); font-size: var(--t-md); }
.goal-facts li:first-child { border-top: 0; }
.goal-facts b { font-variant-numeric: tabular-nums; }
.goal-form { display: flex; flex-wrap: wrap; align-items: end; gap: var(--s3); }
.goal-form label { display: grid; gap: var(--s1); font-size: var(--t-sm); color: var(--muted); flex: 1 1 140px; }

@media (max-width: 760px) {
  .money-ctl { grid-template-columns: minmax(0, 1fr) auto; }
  .money-ctl input[type="range"] { grid-column: 1 / -1; grid-row: 2; }
  .money-rows li { grid-template-columns: minmax(0, 1fr); }
}