Help resizing/combining these two cards SOLVED

I’ve got 3 cards combined using the Custom Stack In along with Horizontal Stack. All I want to do is resize/compress it so it’s not so vertically long. I’ve tried various methods and resizing but it seems to just clip the information of either card instead of “dynamically resizing”
I want to go from this:
Screenshot 2024-09-28 114305
To This:
combined
Here is my code:

type: custom:stack-in-card
mode: vertical
cards:
  - type: custom:mushroom-fan-card
    entity: fan.living_room_air_purifier
    icon_animation: true
    show_oscillate_control: false
    show_percentage_control: true
    collapsible_controls: false
    tap_action:
      action: more-info
    card_mod:
      style: |
        ha-card { 
          background-color: rgba(0,0,0,0);
          box-shadow: none;
          border-style: hidden;
        }
  - type: custom:mini-graph-card
    hours_to_show: 48
    graph: line
    entities:
      - sensor.living_room_air_purifier_pm2_5
    line_width: 3
    show:
      state: false
      name: false
      icon: false
    color_thresholds:
      - value: 0
        color: '#3399ff'
      - value: 35
        color: '#00e6ac'
      - value: 75
        color: '#ffcc00'
      - value: 115
        color: '#ff4d4d'
    points_per_hour: 1
    card_mod:
      style: |
        ha-card { 
          background-color: rgba(0,0,0,0);
          box-shadow: none;
          border-style: hidden;

Thank you for any help or suggestions you may have.

Instead of resizing, using a negative margin accomplished what I needed.

card_mod:
      style: |
        ha-card { 
          background-color: rgba(0,0,0,0);
          box-shadow: none;
          border-style: hidden;
          position: absolute;
          left: 0px;
          top: -40px;
          width: 100%;
          height: 20%;
          }
card_mod:
  style: |
    ha-card { 
    height: 133px;
    }