.meter{ display:flex; align-items:center; gap:.6em; }
.meter-label{ font-size:var(--fs-xs); color:var(--txt-3); font-weight:600; min-width:3.7em; }
.meter-track{
  flex:1; height:7px; border-radius:999px; background:rgba(255,255,255,.08); overflow:hidden;
}
.meter-fill{
  height:100%; border-radius:999px; background:var(--m-color,var(--violet));
  transition:width .5s var(--ease), background .3s var(--ease);
}
.meter--nrj .meter-fill{ --m-color:linear-gradient(90deg,#35D8A0,#8BE8C4); }
.meter--mor .meter-fill{ --m-color:linear-gradient(90deg,#3ED3E6,#8AEBF5); }
.meter--low  .meter-fill{ --m-color:linear-gradient(90deg,#FF6183,#FF9AAF); }

/* barre de progression du palier */
.tier-bar{ height:5px; border-radius:999px; background:rgba(255,255,255,.07); overflow:hidden; }
.tier-bar span{
  display:block; height:100%; border-radius:999px;
  background:linear-gradient(90deg,var(--violet-2),var(--violet),var(--cyan));
  transition:width .6s var(--ease);
}