Answering your question about bar-card:
type: custom:stack-in-card
keep:
background: true
cards:
- type: entities
entities:
- entity: input_number.test_level_1
- entity: input_number.test_level_2
- entity: input_number.test_level_3
card_mod:
style: |
ha-card {background: red}
- type: custom:bar-card
severity:
- from: '0'
to: '0'
hide: true
- from: '1'
to: '40'
color: '#007A00'
- from: '41'
to: '90'
color: '#EA9000'
- from: '91'
to: '100'
color: '#C41400'
entities:
- entity: input_number.test_level_1
- entity: input_number.test_level_2
- entity: input_number.test_level_3
card_mod:
style: |
ha-card {
{% if states('input_number.test_level_1')|int == 0 and
states('input_number.test_level_2')|int == 0 and
states('input_number.test_level_3')|int == 0 %}
display: none;
{% endif %}
}
This mod hides the whole bar-card if none of bars is displayed (to avoid undesired space).