
/* Rechner CSS (scoped minimal) */
.table-wrap { overflow:auto; }
.value { font-size: 1.4rem; font-weight: 700; }
.muted { color: var(--muted); }
#sim-controls input[type="range"] { width: 100%; }
#simPlot { width: 100%; height: auto; display:block; background:#0e131b; border:1px solid #2a3142; border-radius: 10px; }
.legend { display:flex; gap:12px; align-items:center; margin-top:8px; }
.legend .swatch { width:14px; height:14px; border-radius:3px; display:inline-block; }
.rechner-wrapper {
  padding: 2rem 0;
}
.rechner-grid {
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: 20px;
}
.rechner-card {
  background: rgba(17,24,39,0.75);
  border: 1px solid rgba(148,163,184,0.12);
  border-radius: 16px;
  padding: 1rem;
}
.rechner-body { padding: 1rem 0; }
.rechner-control { margin-bottom: 16px; }
.rechner-control label {
  display: flex;
  justify-content: space-between;
  margin-bottom: 6px;
  font-weight: 600;
}
.rechner-row {
  display: flex;
  gap: 10px;
}
.rechner-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.kpi {
  padding: 12px;
  background: #0b1020;
  border: 1px solid rgba(148,163,184,.16);
  border-radius: 12px;
}
.kpi .lab { font-size: 12px; color: #94a3b8; }
.kpi .num { font-size: 18px; font-weight: 700; }
.primary {
  background: #60a5fa;
  color: #0b1020;
  font-weight: bold;
  padding: 10px 12px;
  border: none;
  border-radius: 12px;
}
.value {
  font-variant-numeric: tabular-nums;
  color: #60a5fa;
  background: rgba(96,165,250,.12);
  padding: 2px 8px;
  border-radius: 8px;
}
canvas {
  width: 100%;
  background: radial-gradient(1200px 600px at 20% -10%, rgba(96,165,250,.08), transparent);
  border-radius: 0 0 16px 16px;
}
