Bubble Card with minigraph

type: vertical-stack
        cards:
          - type: custom:bubble-card
            card_type: pop-up
            name: Sensor
            icon: mdi:motion-sensor
            state: null
            hash: "#motions"
            is_sidebar_hidden: true
            styles: >-
              .bubble-pop-up {
                background: transparent);
                }
              .close-pop-up {
                background-color: transparent;
              }
              .bubble-button-card-container {
                background: transparent !important;
              }
              .icon-container {background-color:var(--red)!important;}
              .icon-container > ha-icon
              {color:var(--black)!important;opacity:1!important;}
              .bubble-icon {
                --mdc-icon-size: 22px !important;
              }
            bg_blur: "20"
            shadow_opacity: "20"
            bg_opacity: "88"
            margin_top_mobile: 10px
            margin_top_desktop: 10px
            card_layout: large
          - type: custom:stack-in-card
            cards:
              - type: custom:button-card
                entity: sensor.10063d1e68bfa731_distance
                icon: mdi:jellyfish
                show_entity_picture: true
                name: Jellyfin
                styles:
                  card:
                    - border-style: none
                    - box-shadow: 0px 0px 10px -9px black
                  custom_fields:
                    temp:
                      - filter: opacity(100%)
                      - justify-self: start
                      - margin-left: 10px
                      - margin-top: 20px
                      - padding-bottom: 10%
                      - font-size: 65%
                    graph:
                      - padding-top: 0%
                      - width: 100%
                      - height: 100%
                      - margin-bottom: "-3%"
                  icon:
                    - width: 25px
                    - color: auto
                    - margin-right: 10px
                    - margin-top: 5px
                  name:
                    - font-size: 90%
                    - font-weight: var(--mcg-title-font-weight, 500)
                    - justify-self: start
                    - margin-top: 20px
                    - margin-left: 10px
                    - margin-bottom: 10px
                    - opacity: 0.65
                    - text-align: center
                  grid:
                    - grid-template-areas: "\"n i\" \"temp temp\" \"graph graph\""
                    - grid-template-columns: 1fr min-content
                    - grid-template-rows: 1fr min-content min-content min-content
                custom_fields:
                  temp: |
                    [[[
                      return `<ha-icon
                        icon="mdi:cpu-64-bit"
                        style="width:18px; height: 18px; color:#ff8c00;">
                        </ha-icon><span style="font-size:120%; font-weight: 300;">
                        ${states['sensor.10063d1e68bfa731_distance'].state}%</span>
                        <ha-icon
                        icon="mdi:memory"
                        style="width: 18px; height: 18px; color: #3399ff;">
                        </ha-icon><span style="font-size:120%; font-weight: 300; text-align: center;">
                        ${states['sensor.10063d1e68bfa731_distance'].state}MiB</span>`
                    ]]]
                card_mod:
                  style: |
                    ha-card {
                      z-index: 1;
                      height: 100px !important;
                    }
              - type: custom:mini-graph-card
                entities:
                  - entity: sensor.10063d1e68bfa731_distance
                    name: CPU
                    color: "#ff8c00"
                  - entity: sensor.10063d1e68bfa731_distance
                    name: Memory
                    color: "#3399ff"
                    y_axis: secondary
                height: 50
                hours_to_show: 24
                line_width: 3
                font_size: 50
                animate: true
                show:
                  name: false
                  icon: false
                  state: false
                  legend: false
                  fill: fade
                card_mod:
                  style: |
                    ha-card {
                      position: absolute !important;
                      height: 100%;
                      width: 100%;
                      top: 0px;
                      --ha-card-border-width: 0;
                    }
                    ha-card:after {
                      content: "";
                      position: absolute;
                      width: 100%;
                      height: 100%;
                      background: linear-gradient(to right, var(--card-background-color) 20%, transparent);
                    }