`style:` for custom CSS values wont stay active

[Phibins]

I've applied some of the custom tile styles to my tiles (e.g. --tile-border-radius: 12px;,--tile-width: 105px;,--tile-height: 81px;) they worked great at first but now will not display. They always show the default values.

For example:

Here is my current tab LOVELACE:

cards:
  - enableColumns: true
    rows:
      - columns:
          - column: 1
            entities:
              - entities:
                  - entity: light.pendants
                    icon: 'mdi:vanity-light'
                    name: Pendants
                  - entity: light.stairway
                    icon: 'mdi:ceiling-light'
                    name: Stairway
                  - entity: light.kitchen
                    icon: 'mdi:ceiling-light'
                    name: Kitchen
                  - entity: switch.kitchen_leds
                    icon: 'mdi:ceiling-light'
                    name: Counter
                  - entity: light.living_room
                    icon: 'mdi:ceiling-light'
                    name: Living Room
                  - custom: light.living_room
                    icon: 'mdi:blinds'
                    name: Living Room Blinds
                    tap_action:
                      action: call-service
                      service: cover.toggle
                      service_data:
                        entity_id: group.lr_all
            tileOnRow: 8
    settings: true
    statePositionTop: true
    style: |
      :host {
        --tile-background: rgba(255, 255, 255, 0.8);
        --tile-border-radius: 12px;
        --tile-width: 105px;
        --tile-height: 81px;
        --tile-on-background: rgba(255, 255, 255, 1);
      }
    supportedFeaturesTreshold: 0
    title: Home
    titleColor: '#FFF'
    type: 'custom:homekit-card'
    useBrightness: true
    useTemperature: true
  - cards:
      - aspect_ratio: 55%
        camera_image: camera.front_door
        camera_view: live
        entity: camera.front_door
        show_name: false
        show_state: false
        type: picture-entity
      - aspect_ratio: 55%
        camera_image: camera.allyway
        camera_view: live
        entity: camera.allyway
        show_name: false
        show_state: false
        type: picture-entity
    type: horizontal-stack
  - enableColumns: true
    rows:
      - columns:
          - column: 1
            entities:
              - entities:
                  - custom: Lights
                    icon: 'mdi:lightbulb-group'
                    name: Lights
                    tap_action:
                      action: navigate
                      navigation_path: /lovelace/lights
                  - custom: TVs
                    icon: 'mdi:television-box'
                    name: TVs
                    tap_action:
                      action: navigate
                      navigation_path: /lovelace/tvs
                  - custom: Blinds
                    icon: 'mdi:blinds'
                    name: Blinds
                    tap_action:
                      action: navigate
                      navigation_path: /lovelace/blinds
                  - custom: CCTV
                    icon: 'mdi:cctv'
                    name: CCTV
                    tap_action:
                      action: navigate
                      navigation_path: /lovelace/cctv
                  - custom: Sonos
                    icon: 'mdi:music-circle-outline'
                    name: Sonos
                    tap_action:
                      action: navigate
                      navigation_path: /lovelace/sonos
                  - custom: Alarm
                    icon: 'mdi:shield-home'
                    name: Alarm
                    tap_action:
                      action: navigate
                      navigation_path: /lovelace/locks
                  - custom: Weather
                    icon: 'mdi:weather-partly-snowy'
                    name: Weather
                    tap_action:
                      action: navigate
                      navigation_path: /lovelace/weather
            tileOnRow: 8
        row: 1
    settings: true
    statePositionTop: true
    style: |
      :host {
        --tile-background: rgba(255, 255, 222, 0.8);
        --tile-border-radius: 12px;
        --tile-width: 85px;
        --tile-height: 57px;
        --tile-on-background: #cce6ff;
        --tile-border-radius: 22px;
      }
    supportedFeaturesTreshold: 0
    title: Home
    titleColor: '#FFF'
    type: 'custom:homekit-card'
    useBrightness: true
    useTemperature: true
type: vertical-stack

But this is how it looks on the page: