range-bar{display:block;--alto-riel: 8px;--alto-marcador: 22px;--ancho-marcador: 4px;--color-marcador: var(--ds-tinta);--color-banda: #d8f0ed;--color-borde-banda: #a9d9d4;--color-riel: var(--ds-linea);--fondo-chip: var(--ds-vitrina);--texto-chip: var(--ds-grafito)}bar-head{display:flex;align-items:baseline;gap:var(--ds-e3);margin-bottom:var(--ds-e3)}bar-analyte{font-family:var(--ds-fuente-texto);font-size:var(--ds-cuerpo);font-weight:600;letter-spacing:-.005em;color:var(--ds-tinta);margin-right:auto}bar-readout{display:flex;align-items:baseline;gap:.35em;font-family:var(--ds-fuente-dato);font-variant-numeric:tabular-nums}bar-value{font-size:1.0625rem;font-weight:500;color:var(--color-marcador);letter-spacing:-.02em}bar-unit{font-size:var(--ds-menuda);color:var(--ds-ceniza);letter-spacing:0}bar-status{font-family:var(--ds-fuente-texto);font-size:var(--ds-menuda);font-weight:600;letter-spacing:.02em;padding:.25em .7em .3em;border-radius:var(--ds-radio-full);background:var(--fondo-chip);color:var(--texto-chip);white-space:nowrap}bar-track{position:relative;display:block;height:var(--alto-riel);border-radius:var(--ds-radio-full);background:var(--color-riel)}bar-band{position:absolute;inset:0 auto 0 0;left:var(--banda-desde);right:calc(100% - var(--banda-hasta));border-radius:var(--ds-radio-full);background:var(--color-banda);box-shadow:inset 0 0 0 1px var(--color-borde-banda);transform-origin:left center}bar-marker{position:absolute;top:50%;left:0;width:var(--ancho-marcador);height:var(--alto-marcador);margin-top:calc(var(--alto-marcador) / -2);margin-left:calc(var(--ancho-marcador) / -2);border-radius:var(--ds-radio-full);background:var(--color-marcador);box-shadow:0 0 0 3px var(--ds-papel)}range-bar[reveal=on] bar-marker{left:var(--marcador)}bar-scale{position:relative;display:flex;justify-content:space-between;margin-top:var(--ds-e2);font-family:var(--ds-fuente-dato);font-size:var(--ds-menuda);font-variant-numeric:tabular-nums;color:var(--ds-ceniza)}scale-ref{position:absolute;left:var(--centro);transform:translate(-50%);white-space:nowrap;color:var(--ds-fosforo-tinta);font-weight:500}range-bar[state=limite]{--color-marcador: var(--ds-limite-tinta);--fondo-chip: var(--ds-limite-velo);--texto-chip: var(--ds-limite-tinta)}range-bar[state=fuera]{--color-marcador: var(--ds-fuera);--ancho-marcador: 5px;--fondo-chip: var(--ds-fuera-velo);--texto-chip: var(--ds-fuera)}range-bar[state=sin-referencia]{--color-marcador: var(--ds-ceniza)}range-bar[state=sin-referencia] bar-track{background:repeating-linear-gradient(90deg,var(--ds-linea) 0 6px,transparent 6px 12px)}range-bar[state=sin-referencia] scale-ref{color:var(--ds-ceniza);font-family:var(--ds-fuente-texto);font-style:italic;font-weight:400}range-bar[size=hero]{--alto-riel: 14px;--alto-marcador: 34px;--ancho-marcador: 6px}range-bar[size=hero] bar-analyte{font-size:1.0625rem}range-bar[size=hero] bar-value{font-size:1.75rem;letter-spacing:-.055em}range-bar[size=hero] bar-unit{font-size:var(--ds-etiqueta)}range-bar[size=compact]{--alto-riel: 6px;--alto-marcador: 16px;--ancho-marcador: 3px}range-bar[size=compact] bar-head{margin-bottom:var(--ds-e2)}range-bar[size=compact] bar-status,range-bar[size=compact] bar-scale{display:none}range-bar[on=tinta]{--color-marcador: var(--ds-sobre-tinta);--color-banda: rgba(70, 233, 211, .14);--color-borde-banda: rgba(70, 233, 211, .42);--color-riel: var(--ds-linea-tinta);--fondo-chip: rgba(70, 233, 211, .14);--texto-chip: var(--ds-fosforo-vivo)}range-bar[on=tinta] bar-analyte{color:var(--ds-sobre-tinta)}range-bar[on=tinta] bar-unit,range-bar[on=tinta] bar-scale{color:var(--ds-sobre-tinta-baja)}range-bar[on=tinta] scale-ref{color:var(--ds-fosforo-vivo)}range-bar[on=tinta] bar-marker{box-shadow:0 0 0 3px var(--ds-tinta),0 0 18px #46e9d38c}range-bar[on=tinta][state=fuera]{--color-marcador: #ff8f75;--fondo-chip: rgba(255, 143, 117, .16);--texto-chip: #ff8f75}@media(prefers-reduced-motion:no-preference){bar-band{transform:scaleX(0);transition:transform var(--ds-dur-3) var(--ds-ease-estandar)}range-bar[reveal=on] bar-band{transform:scaleX(1)}bar-marker{opacity:0;transition:left var(--ds-dur-4) var(--ds-ease-resorte) var(--ds-dur-2),opacity var(--ds-dur-2) linear var(--ds-dur-2)}range-bar[reveal=on] bar-marker{opacity:1}}