/* ============================================================
   HUF — Componente: Rank (.hd-rank)
   ------------------------------------------------------------
   Ranking con barra proporcional. Gráfico SUBORDINADO (HVL §7.6):
   acompaña a una cifra ya escrita y nunca la sustituye, así que no
   lleva eje, ni leyenda, ni etiquetas propias.

   La barra usa el acento del tema, no una paleta por categoría: las
   entradas de un ranking no son categorías distintas, son la misma
   medida en distinto tamaño.
   ============================================================ */

.hd-rank {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--hd-space-3);
}

.hd-rank__head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--hd-space-3);
    margin-bottom: var(--hd-space-1);
    font-size: var(--hd-text-meta);
}

.hd-rank__label {
    display: inline-flex;
    align-items: baseline;
    gap: var(--hd-space-2);
    font-weight: 600;
    color: var(--hd-theme-text);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hd-rank__pos {
    color: var(--hd-theme-text-muted);
    font-variant-numeric: tabular-nums;
}

.hd-rank__value {
    color: var(--hd-theme-text-muted);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.hd-rank__track {
    height: 0.5rem;
    background: var(--hd-color-inset);
    border-radius: var(--hd-radius-pill);
    overflow: hidden;
}

.hd-rank__bar {
    height: 100%;
    background: var(--hd-theme-accent);
    border-radius: inherit;
}
