.cntnr__kostenrechner-mrfx {
    background: var(--main-light);
    border-radius: var(--radius-medium);
    border: 1px solid var(--main-dark-subtile);
    padding: var(--grid__small) var(--grid__medium);
    width: 100%;
    max-width: 1240px;
    box-shadow: 0 4px 24px rgba(0,0,0,0.08);
  }
  
  .cntnr__kostenrechner-mrfx > * {
    width: 100% !important;
  }
  
  /* ── Header ─────────────────────────────────────────── */
  .cntnr__kostenrechner-mrfx .header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--grid__small);
  }
  
  .cntnr__kostenrechner-mrfx .year-display {
    display: flex;
    align-items: center;
    gap: var(--grid__x-small);
  }
  
  .cntnr__kostenrechner-mrfx .year-label {
    font-size: var(--font-size__medium);
    font-weight: var(--font-weight__bold);
    color: var(--main-dark);
    letter-spacing: -0.3px;
  }
  
  .play-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--brand-color-main);
    font-size: 0;
    padding: 4px;
    display: flex;
    align-items: center;
    transition: opacity 0.2s;
  }
  .play-btn:hover { opacity: 0.7; }
  .play-btn svg { width: 22px; height: 22px; fill: currentColor; }
  
  .cntnr__kostenrechner-mrfx .toggle {
    position: relative;
    display: flex;
    background: var(--main-lightest);
    border-radius: var(--radius-small);
    padding: 4px;
    gap: 4px;
    border: 1px solid #43434343;
  }
  
  .cntnr__kostenrechner-mrfx .toggle-slider {
    position: absolute;
    top: 4px;
    left: 4px;
    height: calc(100% - 8px);
    background: var(--brand-color-main);
    border-radius: var(--radius-small);
    transition: left 0.22s cubic-bezier(.4,0,.2,1), width 0.22s cubic-bezier(.4,0,.2,1);
    pointer-events: none;
    z-index: 0;
  }
  
  .cntnr__kostenrechner-mrfx .toggle-btn {
    position: relative;
    z-index: 1;
    padding: 9px 22px;
    border: none;
    border-radius: var(--radius-small);
    cursor: pointer;
    font-size: var(--font-size__small-reg);
    font-weight: var(--font-weight__bold);
    background: transparent;
    color: var(--main-dark);
    transition: color 0.22s;
    white-space: nowrap;
  }
  
  .cntnr__kostenrechner-mrfx .toggle-btn.active {
    color: #fff;
  }
  
  .cntnr__kostenrechner-mrfx .chart-wrap {
    position: relative;
    width: 100%;
    height: clamp(320px, 45vw, 540px);
  }
  
  .slider-section {
    margin-top: 6px;
  }
  
  .slider-track-wrap {
    position: relative;
  }

  .slider-labels {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
    color: var(--main-dark);
    font-size: var(--font-size__small);
    font-weight: var(--font-weight__regular);
  }

  .cntnr__kostenrechner-mrfx input[type=range] {
    background-color: var(--brand-color-main) !important;
}

.cntnr__kostenrechner-mrfx input[type="range"]::-webkit-slider-runnable-track {
    background-color: var(--brand-color-main) !important;
    background: var(--brand-color-main) !important;
    border: 1px solid var(--brand-color-main) !important;
}

.cntnr__kostenrechner-mrfx input[type="range"]::-moz-range-track {
    background-color: var(--brand-color-main) !important;
    background: var(--brand-color-main) !important;
}

.cntnr__kostenrechner-mrfx input[type="range"]::-ms-track {
    background-color: var(--brand-color-main) !important;
    background: var(--brand-color-main) !important;
}

.cntnr__kostenrechner-mrfx input[type="range"]::-webkit-slider-thumb {
    border: 1px solid var(--brand-color-main) !important;
    background: var(--main-light) !important;
}

  /* ── Wall-Area Switcher ───────────────────────────────── */
  .wall-area-row {
    display: flex;
    align-items: center;
    gap: var(--grid__x-small);
  }
  
  .wall-area-label {
    font-size: var(--font-size__small-reg);
    color: var(--main-dark);
    white-space: nowrap;
  }