/* ═══════════════════════════════════════════════════════════════
   Finanzen · Boss Cockpit Erweiterung
   Rücklagen, Steuerrechner, Wiederkehrende Leistungen.
═══════════════════════════════════════════════════════════════ */

/* ── KPI-Tile Variante ───────────────────────────────────── */
.fz-kpi-final, .fc-kpi-final {
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--inf) 8%, transparent), transparent 60%),
    var(--bg-surface);
  border: 1px solid color-mix(in srgb, var(--inf) 22%, var(--bdr-def));
  position: relative;
}
.fc-kpi-final::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--inf) 18%, transparent) inset;
}

/* ── 1) Rücklagen ────────────────────────────────────────── */
.fc-rl-donut-wrap {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 24px;
  align-items: center;
}
@media (max-width: 720px) {
  .fc-rl-donut-wrap { grid-template-columns: 1fr; }
}
.fc-rl-donut {
  width: 200px;
  height: 200px;
}
.fc-rl-arc {
  transition: opacity var(--dur-fast) var(--ease-out-quint), transform var(--dur-fast) var(--ease-out-quint);
  transform-origin: center;
  transform-box: fill-box;
}
.fc-rl-arc:hover { filter: brightness(1.08); }
.fc-rl-legend {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 6px;
}
.fc-rl-leg-row {
  display: grid;
  grid-template-columns: 14px 1fr auto auto;
  gap: 12px;
  align-items: center;
  font-size: 13px;
  padding: 6px 8px;
  border-radius: 6px;
  transition: background var(--dur-fast) var(--ease-out-quint);
}
.fc-rl-leg-row:hover { background: var(--bg-el); }
.fc-rl-leg-dot { width: 12px; height: 12px; border-radius: 3px; }
.fc-rl-leg-n   { color: var(--tx-0); }
.fc-rl-leg-v   { color: var(--tx-0); font-variant-numeric: tabular-nums; }
.fc-rl-leg-p   { font-size: 11.5px; }

.fc-rl-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}
.fc-rl-card {
  padding: 16px 18px 18px;
  border: 1px solid var(--bdr-def);
  border-radius: 10px;
  background: var(--bg-surface);
  display: flex; flex-direction: column; gap: 6px;
  cursor: pointer;
  transition: transform var(--dur-base) var(--ease-out-quint), border-color var(--dur-base) var(--ease-out-quint), box-shadow var(--dur-base) var(--ease-out-quint);
}
.fc-rl-card:hover {
  transform: translateY(-2px);
  border-color: var(--bdr-str);
  box-shadow: 0 10px 24px -18px rgba(40,35,20,0.32);
}
.fc-rl-card-h {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 4px;
}
.fc-rl-card-ico {
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--bg-el);
  border-radius: 8px;
  color: var(--tx-0);
}
.fc-rl-card-ico svg { width: 16px; height: 16px; }
.fc-rl-card-tag {
  font: 500 10px/1 var(--font-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 3px 7px;
  border-radius: 999px;
}
.fc-rl-card-tag.fix  { background: var(--bg-el); color: var(--tx-2); }
.fc-rl-card-tag.auto { background: color-mix(in srgb, var(--inf) 14%, transparent); color: var(--inf); }
.fc-rl-card-tag.live { background: color-mix(in srgb, var(--ok) 14%, transparent); color: var(--ok); }
.fc-rl-card-source { font-size: 11.5px; color: var(--tx-2); }
.fc-rl-card-source .link { color: var(--ok); }
.fc-rl-card-n {
  font: 600 13.5px/1.3 var(--font-ui);
  color: var(--tx-0);
}
.fc-rl-card-v {
  font: 700 22px/1 var(--font-ui);
  color: var(--tx-0);
  letter-spacing: -0.02em;
  margin: 4px 0 8px;
}
.fc-rl-card-d {
  font-size: 12.5px;
  color: var(--tx-1);
  line-height: 1.5;
}

/* ── 2) Steuerrechner ────────────────────────────────────── */
.fc-sr-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.fc-sr-input {
  display: flex; flex-direction: column; gap: 5px;
}
.fc-sr-input-l {
  font: 500 11px/1.2 var(--font-mono);
  color: var(--tx-2);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  display: flex; align-items: flex-start; flex-wrap: wrap; gap: 2px;
  /* Reserviere mindestens 2 Zeilen, damit alle Eingabefelder in der
     Reihe auf gleicher Y-Höhe stehen — auch wenn ein Label nicht umbricht. */
  min-height: 2.4em;
}
.fc-sr-input-w {
  position: relative;
  display: flex; align-items: center;
  background: var(--bg-surface);
  border: 1px solid var(--bdr-def);
  border-radius: 6px;
  padding-left: 10px;
  transition: border-color var(--dur-fast) var(--ease-out-quint);
}
.fc-sr-input-w:focus-within {
  border-color: var(--tx-0);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ac-2) 12%, transparent);
}
.fc-sr-input-pre { color: var(--er); font-weight: 600; }
.fc-sr-input-i {
  flex: 1; border: 0; background: transparent;
  padding: 8px 4px;
  font-size: 14px;
  text-align: right;
}
.fc-sr-input-i:focus { outline: none; }
.fc-sr-input-eur {
  padding-right: 10px;
  color: var(--tx-2);
  font: 500 12px/1 var(--font-mono);
}
.fc-sr-input-h {
  font-size: 11.5px;
  color: var(--tx-2);
  font-family: var(--font-mono);
}

.fc-sr-row {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 8px 0;
  border-bottom: 1px solid var(--bdr-faint);
  font-size: 14px;
}
.fc-sr-row:last-of-type { border-bottom: 0; }
.fc-sr-row-l { color: var(--tx-1); }
.fc-sr-row-v { color: var(--tx-0); font-variant-numeric: tabular-nums; }
.fc-sr-row-final {
  margin-top: 6px;
  padding-top: 12px;
  border-top: 2px solid var(--bdr-str);
  font-size: 15px;
}

.fc-sr-result {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin: 18px 0 12px;
}
.fc-sr-result-c {
  padding: 14px 16px;
  border-radius: 10px;
  background: var(--bg-surface);
  border: 1px solid var(--bdr-def);
}
.fc-sr-result-c.forecast {
  border-color: color-mix(in srgb, var(--inf) 22%, var(--bdr-def));
  background: color-mix(in srgb, var(--inf) 4%, var(--bg-surface));
}
.fc-sr-result-c.forecast.neg {
  border-color: color-mix(in srgb, var(--er) 22%, var(--bdr-def));
  background: color-mix(in srgb, var(--er) 4%, var(--bg-surface));
}
.fc-sr-result-c.forecast.neg .fc-sr-result-v { color: var(--er); }
.fc-sr-result-c.forecast.pos {
  border-color: color-mix(in srgb, var(--ok) 22%, var(--bdr-def));
  background: color-mix(in srgb, var(--ok) 4%, var(--bg-surface));
}
.fc-sr-result-c.forecast.pos .fc-sr-result-v { color: var(--ok); }
.fc-sr-result-k {
  font: 500 11px/1 var(--font-mono);
  color: var(--tx-2);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.fc-sr-result-v {
  font: 700 22px/1 var(--font-ui);
  color: var(--tx-0);
  letter-spacing: -0.02em;
}
.fc-sr-result-s {
  font: 500 11.5px/1.3 var(--font-mono);
  color: var(--tx-2);
  margin-top: 4px;
}
.fc-sr-meta {
  margin-top: 12px;
  padding: 10px 14px;
  border-radius: 8px;
  background: var(--bg-el);
  font-size: 13px;
  color: var(--tx-1);
}

/* ── 3) Wiederkehrende Leistungen ──────────────────────────── */
.fc-rec-search {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--bg-surface);
  border: 1px solid var(--bdr-def);
  border-radius: 6px;
  padding: 6px 10px;
}
.fc-rec-search svg { color: var(--tx-2); }
.fc-rec-search input {
  border: 0; outline: 0; background: transparent;
  font-size: 12.5px;
  width: 180px;
  color: var(--tx-0);
}
.fc-rec-status {
  display: inline-block;
  width: 10px; height: 10px;
  border-radius: 50%;
  background: var(--tx-2);
}
.fc-rec-status.on  { background: var(--ok); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ok) 22%, transparent); }
.fc-rec-status.off { background: var(--tx-2); }

/* ── Steuerrechner · Source-Hints ──────────────────────── */
.fc-sr-input-src-static {
  display: inline-flex; align-items: center; gap: 5px;
  font: 500 11px/1.3 var(--font-mono);
  color: var(--tx-2);
  margin-top: 2px;
}
.fc-sr-input-src-static svg { flex-shrink: 0; }
.fc-sr-input-src {
  appearance: none; border: 0; background: transparent;
  display: inline-flex; align-items: center; gap: 5px;
  font: 500 11px/1.3 var(--font-mono);
  color: var(--inf);
  text-align: left;
  cursor: pointer;
  padding: 0;
  margin-top: 2px;
}
.fc-sr-input-src:hover { color: var(--tx-0); text-decoration: underline; }
.fc-sr-input-link .fc-sr-input-l { margin-bottom: 5px; }
.fc-sr-drill {
  margin: 14px 0 16px;
  padding: 14px 16px;
  background: var(--bg-el);
  border-left: 3px solid var(--inf);
  border-radius: 8px;
  animation: fzPopFromCheck 0.18s var(--ease-out-quint);
}
.fc-sr-drill-h {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 8px;
  font-size: 12.5px;
  color: var(--tx-0);
}
.fc-sr-drill-tbl { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.fc-sr-drill-tbl td { padding: 4px 0; color: var(--tx-1); border-bottom: 1px solid var(--bdr-faint); }
.fc-sr-drill-tbl td.num { text-align: right; color: var(--tx-0); }
.fc-sr-drill-sum td { border-bottom: 0; padding-top: 8px; font-size: 13px; color: var(--tx-0); }
.fc-sr-drill-note {
  font-size: 12px; color: var(--tx-1);
  margin-top: 10px; padding-top: 8px;
  border-top: 1px dashed var(--bdr-def);
  line-height: 1.5;
}

/* ── Gewinnfreibetrag ───────────────────────────────────── */
.fc-gfb-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.fc-gfb-c {
  padding: 14px 16px;
  border: 1px solid var(--bdr-def);
  border-radius: 10px;
  background: var(--bg-surface);
}
.fc-gfb-c-auto   { border-color: color-mix(in srgb, var(--ok) 22%, var(--bdr-def)); background: color-mix(in srgb, var(--ok) 4%, var(--bg-surface)); }
.fc-gfb-c-invest { border-color: color-mix(in srgb, var(--inf) 22%, var(--bdr-def)); background: color-mix(in srgb, var(--inf) 4%, var(--bg-surface)); }
.fc-gfb-c-used.ok   { border-color: color-mix(in srgb, var(--ok) 22%, var(--bdr-def)); }
.fc-gfb-c-used.warn { border-color: color-mix(in srgb, var(--wa) 26%, var(--bdr-def)); background: color-mix(in srgb, var(--wa) 4%, var(--bg-surface)); }
.fc-gfb-c-used.full { border-color: color-mix(in srgb, var(--ok) 30%, var(--bdr-def)); background: color-mix(in srgb, var(--ok) 6%, var(--bg-surface)); }
.fc-gfb-k {
  font: 500 11px/1 var(--font-mono);
  color: var(--tx-2);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.fc-gfb-v {
  font: 700 22px/1 var(--font-ui);
  color: var(--tx-0);
  letter-spacing: -0.02em;
}
.fc-gfb-c-auto   .fc-gfb-v { color: var(--ok); }
.fc-gfb-c-invest .fc-gfb-v { color: var(--inf); }
.fc-gfb-c-used.full .fc-gfb-v { color: var(--ok); }
.fc-gfb-s {
  font: 500 11.5px/1.3 var(--font-mono);
  color: var(--tx-2);
  margin-top: 4px;
}

.fc-gfb-bar { margin-bottom: 16px; }
.fc-gfb-bar-track {
  position: relative;
  height: 18px;
  background: var(--bg-el);
  border-radius: 999px;
  overflow: hidden;
}
.fc-gfb-bar-grund {
  position: absolute; left: 0; top: 0; height: 100%;
  background: var(--ok);
  animation: pcBarGrow 0.7s var(--ease-out-quint);
  transform-origin: left;
}
.fc-gfb-bar-invest {
  position: absolute; top: 0; height: 100%;
  background: var(--inf);
  animation: pcBarGrow 0.9s var(--ease-out-quint) 0.1s both;
  transform-origin: left;
}
.fc-gfb-bar-rest {
  position: absolute; top: 0; height: 100%;
  background: color-mix(in srgb, var(--wa) 60%, transparent);
  animation: pcBarGrow 1.0s var(--ease-out-quint) 0.2s both;
  transform-origin: left;
}
.fc-gfb-bar-legend {
  display: flex; gap: 16px; margin-top: 8px;
  font-size: 11.5px;
  color: var(--tx-1);
}
.fc-gfb-bar-legend .dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 6px; vertical-align: middle; }

.fc-gfb-stufen {
  margin-top: 14px;
  padding: 12px 14px;
  background: var(--bg-el);
  border-radius: 8px;
  font-size: 12px;
}
.fc-gfb-stufen strong { display: block; margin-bottom: 6px; color: var(--tx-0); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; font-family: var(--font-mono); }
.fc-gfb-stufen table { width: 100%; border-collapse: collapse; }
.fc-gfb-stufen td { padding: 3px 8px 3px 0; color: var(--tx-1); }
.fc-gfb-stufen td:first-child { color: var(--tx-0); }

/* ── MOCO Import Banner ────────────────────────────────── */
.fc-moco-banner {
  display: flex; justify-content: space-between; align-items: center; gap: 18px;
  padding: 14px 18px;
  margin: 0 0 16px;
  border: 1px solid var(--bdr-def);
  border-left: 3px solid var(--inf);
  border-radius: 10px;
  background: color-mix(in srgb, var(--inf) 3%, var(--bg-surface));
  transition: border-color var(--dur-base) var(--ease-out-quint), background var(--dur-base) var(--ease-out-quint);
}
.fc-moco-banner.is-success {
  border-left-color: var(--ok);
  background: color-mix(in srgb, var(--ok) 4%, var(--bg-surface));
}
.fc-moco-banner-l {
  display: flex; gap: 14px; align-items: center;
  flex: 1; min-width: 0;
}
.fc-moco-logo {
  width: 36px; height: 36px; border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--bg-surface);
  color: var(--inf);
  flex-shrink: 0;
}
.fc-moco-banner.is-success .fc-moco-logo { color: var(--ok); }
.fc-moco-h { font: 600 13.5px/1.2 var(--font-ui); color: var(--tx-0); }
.fc-moco-s { font-size: 12.5px; color: var(--tx-1); margin-top: 2px; line-height: 1.4; }
.fc-moco-btn { white-space: nowrap; }
.fc-spin {
  width: 12px; height: 12px;
  border: 2px solid rgba(255,255,255,0.3);
  border-top-color: #fff;
  border-radius: 50%;
  animation: fcSpin 0.8s linear infinite;
}
@keyframes fcSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

/* ── 3-Stadien-Breakdown (Offene Aufträge) ───────────────── */
.fz-stage-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}
.fz-stage-card {
  padding: 16px 18px;
  border: 1px solid var(--bdr-def);
  border-radius: 10px;
  background: var(--bg-surface);
  transition: transform var(--dur-base) var(--ease-out-quint), border-color var(--dur-base) var(--ease-out-quint);
}
.fz-stage-card:hover { transform: translateY(-2px); border-color: var(--bdr-str); }
.fz-stage-card-ac  { border-left: 3px solid var(--ac-1); }
.fz-stage-card-wa  { border-left: 3px solid var(--wa); background: color-mix(in srgb, var(--wa) 3%, var(--bg-surface)); }
.fz-stage-card-inf { border-left: 3px solid var(--inf); background: color-mix(in srgb, var(--inf) 3%, var(--bg-surface)); }
.fz-stage-card-h {
  display: flex; align-items: center; gap: 8px;
  font: 500 12px/1 var(--font-mono);
  color: var(--tx-2);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.fz-stage-card-v {
  font: 700 22px/1 var(--font-ui);
  color: var(--tx-0);
  letter-spacing: -0.02em;
}
.fz-stage-card-wa  .fz-stage-card-v { color: var(--wa); }
.fz-stage-card-inf .fz-stage-card-v { color: var(--inf); }
.fz-stage-card-s {
  font-size: 12.5px;
  color: var(--tx-1);
  margin-top: 4px;
  line-height: 1.4;
}

/* ── Steuerrechner · Umsatzprognose-Block ────────────────── */
.fc-sr-umsatz {
  margin: 14px 0 14px;
  padding: 14px 16px;
  background: var(--bg-el);
  border-left: 3px solid var(--ok);
  border-radius: 8px;
}
.fc-sr-umsatz-h {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 10px;
  font-size: 13px;
  color: var(--tx-0);
}
.fc-sr-umsatz-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}
.fc-sr-umsatz-c {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 12px;
  background: var(--bg-surface);
  border-radius: 6px;
  font-size: 12.5px;
}
.fc-sr-umsatz-c.fc-sr-umsatz-total {
  background: color-mix(in srgb, var(--ok) 6%, var(--bg-surface));
  border: 1px solid color-mix(in srgb, var(--ok) 22%, var(--bdr-def));
}
.fc-sr-umsatz-k { flex: 1; color: var(--tx-1); }
.fc-sr-umsatz-v { color: var(--tx-0); }
.fc-sr-umsatz-note {
  font-size: 11.5px;
  color: var(--tx-2);
  margin-top: 8px;
  font-family: var(--font-mono);
}

/* Detail-Aufschlüsselung · klappbar · zeigt alle Einzelposten pro Stadium */
.fc-sr-umsatz-details {
  margin: 14px 0 18px;
  border: 1px solid var(--bdr-def);
  border-radius: 8px;
  background: var(--bg-base);
  overflow: hidden;
}
.fc-sr-umsatz-details summary {
  cursor: pointer;
  list-style: none;
  padding: 11px 16px;
  background: var(--bg-el);
  display: flex; justify-content: space-between; align-items: center;
  font-size: 12.5px; color: var(--tx-0);
  user-select: none;
  font-weight: 500;
}
.fc-sr-umsatz-details summary::-webkit-details-marker { display: none; }
.fc-sr-umsatz-details summary:hover { background: var(--bg-surface); }
.fc-sr-umsatz-details-tog {
  font-size: 14px; color: var(--tx-2);
  transition: transform var(--dur-fast);
}
.fc-sr-umsatz-details[open] .fc-sr-umsatz-details-tog { transform: rotate(180deg); }
.fc-sr-umsatz-stage {
  padding: 12px 16px;
  border-top: 1px solid var(--bdr-faint);
}
.fc-sr-umsatz-stage-h {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 8px;
  font-size: 12.5px; color: var(--tx-0);
}
.fc-sr-umsatz-stage-h strong { color: var(--tx-0); font-weight: 600; }
.fc-sr-umsatz-stage-h .tx2 { font-size: 11px; color: var(--tx-2); }
.fc-sr-umsatz-stage-sum {
  margin-left: auto;
  font: 600 12.5px var(--font-mono);
  color: var(--tx-0);
  font-variant-numeric: tabular-nums;
}
.fc-sr-umsatz-tbl {
  width: 100%;
  font-size: 12px;
  border-collapse: collapse;
}
.fc-sr-umsatz-tbl td {
  padding: 5px 8px;
  border-bottom: 1px solid var(--bdr-faint);
  vertical-align: top;
}
.fc-sr-umsatz-tbl td:first-child {
  padding-left: 22px;
  color: var(--tx-0);
  width: 28%;
}
.fc-sr-umsatz-tbl td:nth-child(2) {
  color: var(--tx-1);
  font-size: 11.5px;
}
.fc-sr-umsatz-tbl td.num {
  white-space: nowrap;
  text-align: right;
  width: 110px;
  font-variant-numeric: tabular-nums;
}
.fc-sr-umsatz-tbl tr:last-child td { border-bottom: 0; }

/* ── Steuerrechner · Was-wäre-wenn-Szenario ────────────── */
.fc-wi-pill {
  display: inline-flex; align-items: center;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid var(--bdr-def);
  background: var(--bg-el);
  font: 500 10.5px/1 var(--font-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--tx-2);
}
.fc-wi-pill-on {
  border-color: color-mix(in srgb, var(--inf) 30%, var(--bdr-def));
  background: color-mix(in srgb, var(--inf) 10%, var(--bg-surface));
  color: var(--inf);
}
.fc-wi-presets {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin-bottom: 16px;
}
.fc-wi-chip {
  appearance: none;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid var(--bdr-def);
  background: var(--bg-surface);
  color: var(--tx-1);
  font: 500 12px/1.1 var(--font-ui);
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-out-quint), border-color var(--dur-fast) var(--ease-out-quint), color var(--dur-fast) var(--ease-out-quint);
}
.fc-wi-chip:hover {
  background: var(--bg-el);
  color: var(--tx-0);
}
.fc-wi-chip-on {
  background: color-mix(in srgb, var(--inf) 10%, var(--bg-surface));
  border-color: color-mix(in srgb, var(--inf) 32%, var(--bdr-def));
  color: var(--inf);
}
.fc-wi-sliders {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 18px 32px;
  margin-bottom: 18px;
  padding: 14px 16px;
  background: var(--bg-el);
  border-radius: 8px;
  border: 1px solid var(--bdr-faint);
}
.fc-wi-sl-h {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 6px;
}
.fc-wi-sl-l {
  font: 500 11px/1.2 var(--font-mono);
  color: var(--tx-2);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.fc-wi-sl-v { font-size: 13px; font-variant-numeric: tabular-nums; }
.fc-wi-sl-v.pos { color: var(--ok); }
.fc-wi-sl-v.neg { color: var(--er); }
.fc-wi-sl-v.tx2 { color: var(--tx-2); }
.fc-wi-range {
  width: 100%;
  appearance: none;
  height: 4px;
  background: linear-gradient(to right,
    color-mix(in srgb, var(--er) 35%, transparent) 0%,
    color-mix(in srgb, var(--bdr-def) 80%, transparent) 50%,
    color-mix(in srgb, var(--ok) 35%, transparent) 100%);
  border-radius: 2px;
  outline: none;
  cursor: pointer;
}
.fc-wi-range::-webkit-slider-thumb {
  appearance: none;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--bg-surface);
  border: 2px solid var(--tx-0);
  cursor: grab;
  transition: transform var(--dur-fast) var(--ease-out-quint);
}
.fc-wi-range::-webkit-slider-thumb:active { cursor: grabbing; transform: scale(1.1); }
.fc-wi-range::-moz-range-thumb {
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--bg-surface);
  border: 2px solid var(--tx-0);
  cursor: grab;
}
.fc-wi-sl-scale {
  display: flex; justify-content: space-between;
  margin-top: 4px;
  font: 500 10.5px/1 var(--font-mono);
  color: var(--tx-2);
}
.fc-wi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}
.fc-wi-c {
  padding: 14px 16px;
  background: var(--bg-surface);
  border: 1px solid var(--bdr-def);
  border-radius: 10px;
}
.fc-wi-c-k {
  font: 500 11px/1 var(--font-mono);
  color: var(--tx-2);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 10px;
}
.fc-wi-c-row {
  display: flex; align-items: baseline; gap: 8px;
  font-size: 14px;
  margin-bottom: 4px;
}
.fc-wi-c-base { color: var(--tx-2); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.fc-wi-c-arrow { color: var(--tx-2); font-size: 12px; }
.fc-wi-c-sz { color: var(--tx-0); font-size: 16px; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.fc-wi-c-d {
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  padding-top: 2px;
}
.fc-wi-c-d.pos { color: var(--ok); }
.fc-wi-c-d.neg { color: var(--er); }
.fc-wi-c-d.tx2 { color: var(--tx-2); }
.fc-wi-c-final {
  background: color-mix(in srgb, var(--bg-el) 60%, var(--bg-surface));
}
.fc-wi-c-final.neg {
  border-color: color-mix(in srgb, var(--er) 22%, var(--bdr-def));
  background: color-mix(in srgb, var(--er) 5%, var(--bg-surface));
}
.fc-wi-c-final.pos {
  border-color: color-mix(in srgb, var(--ok) 22%, var(--bdr-def));
  background: color-mix(in srgb, var(--ok) 5%, var(--bg-surface));
}
.fc-wi-explain {
  display: flex; align-items: center; gap: 12px;
  padding-top: 4px;
}
.fc-wi-explain-hint {
  font: 500 11.5px/1.4 var(--font-mono);
  color: var(--tx-2);
}
.fc-wi-ans {
  margin-top: 12px;
  padding: 14px 16px;
  background: color-mix(in srgb, var(--inf) 5%, var(--bg-surface));
  border: 1px solid color-mix(in srgb, var(--inf) 22%, var(--bdr-def));
  border-radius: 8px;
  animation: fzPopFromCheck 0.2s var(--ease-out-quint);
}
.fc-wi-ans-h {
  display: flex; align-items: center; gap: 7px;
  margin-bottom: 8px;
  font: 500 11px/1 var(--font-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--inf);
}
.fc-wi-ans-body {
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--tx-0);
}
.fc-wi-ans-body em { color: var(--tx-2); font-style: italic; }


/* ── Steuerrechner · Smart-Defaults + Plausi-Checks ──────── */
.fc-sr-plausi {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin-top: 4px;
  font: 500 11px/1 var(--font-mono);
  letter-spacing: 0.03em;
}
.fc-sr-plausi-smart {
  appearance: none;
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 8px;
  background: color-mix(in srgb, var(--inf) 8%, var(--bg-surface));
  border: 1px solid color-mix(in srgb, var(--inf) 26%, var(--bdr-def));
  border-radius: 999px;
  color: var(--inf);
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-out-quint);
}
.fc-sr-plausi-smart:hover {
  background: color-mix(in srgb, var(--inf) 14%, var(--bg-surface));
}
.fc-sr-plausi-smart strong { font-variant-numeric: tabular-nums; }
.fc-sr-plausi-smart svg { flex-shrink: 0; }

/* Formel-Erklärung unter dem Smart-Default-Button */
.fc-sr-plausi-formel {
  flex-basis: 100%;
  font: 400 11px/1.5 var(--font-mono);
  color: var(--tx-2);
  letter-spacing: 0;
  margin-top: 1px;
}

.fc-sr-plausi-dev {
  display: inline-flex; align-items: center;
  padding: 4px 8px;
  border-radius: 999px;
  cursor: help;
  font-variant-numeric: tabular-nums;
}
.fc-sr-plausi-dev.tone-wa {
  background: color-mix(in srgb, var(--wa) 10%, var(--bg-surface));
  border: 1px solid color-mix(in srgb, var(--wa) 26%, var(--bdr-def));
  color: var(--wa);
}
.fc-sr-plausi-dev.tone-er {
  background: color-mix(in srgb, var(--er) 10%, var(--bg-surface));
  border: 1px solid color-mix(in srgb, var(--er) 26%, var(--bdr-def));
  color: var(--er);
}

/* ── KPI-Kachel „Geplante Zuflüsse Steuersparbuch" ─────────── */
/* Grün eingefärbt, weil's um Zuflüsse geht. Edit-Symbol sitzt unten. */
.fc-kpi-plan {
  background: color-mix(in srgb, var(--ok) 5%, var(--bg-surface));
  border-color: color-mix(in srgb, var(--ok) 22%, var(--bdr-def));
}
.fc-kpi-plan .fz-kpi-v { color: var(--ok); }
.fc-kpi-plan-foot {
  margin-top: 8px;
  display: flex; justify-content: flex-end;
  border-top: 1px solid color-mix(in srgb, var(--ok) 14%, var(--bdr-faint));
  padding-top: 8px;
}
.fc-kpi-edit-btn {
  display: inline-flex; align-items: center; gap: 5px;
  color: var(--ok);
  border-color: color-mix(in srgb, var(--ok) 26%, var(--bdr-def));
}
.fc-kpi-edit-btn:hover {
  background: color-mix(in srgb, var(--ok) 12%, var(--bg-surface));
  border-color: color-mix(in srgb, var(--ok) 40%, var(--bdr-def));
}
.fc-kpi-edit-btn svg { flex-shrink: 0; }

/* Inline-Editor für den Plan (klappt unter dem Footer auf) */
.fc-kpi-plan-edit {
  margin-top: 10px;
  padding: 12px;
  background: var(--bg-surface);
  border: 1px solid color-mix(in srgb, var(--ok) 22%, var(--bdr-def));
  border-radius: 8px;
  display: flex; flex-direction: column; gap: 10px;
}
.fc-kpi-plan-edit-h {
  display: flex; flex-direction: column; gap: 2px;
}
.fc-kpi-plan-edit-h strong {
  font: 600 12.5px/1.2 var(--font-ui);
  color: var(--tx-0);
}
.fc-kpi-plan-edit-h .tx2 {
  font-size: 11px;
}
.fc-kpi-plan-edit-grid {
  display: flex; flex-direction: column; gap: 8px;
}
.fc-kpi-plan-edit-fld {
  display: flex; flex-direction: column; gap: 4px;
}
.fc-kpi-plan-edit-fld > span {
  font: 500 10.5px/1 var(--font-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--tx-2);
}
.fc-kpi-plan-edit-fld input { width: 100%; }
.fc-kpi-plan-edit-f {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  margin-top: 2px;
  padding-top: 8px;
  border-top: 1px solid var(--bdr-faint);
}
.fc-kpi-plan-edit-formel {
  font-size: 11.5px;
  color: var(--tx-1);
}
.fc-kpi-plan-edit-formel strong { color: var(--ok); }
