.hv-segments{--marge-segments:calc(var(--cran) * 1.5);grid-template-columns:repeat(var(--nombre), minmax(0, 1fr));block-size:calc(var(--spacing,.25rem) * 8.5);padding:var(--marge-segments);border-radius:var(--radius-pilule);background-color:var(--fond-doux);box-shadow:inset 0 0 0 var(--trait-fin) var(--bordure);flex-shrink:0;display:grid;position:relative}@supports (color:color-mix(in lab, red, red)){.hv-segments{box-shadow:inset 0 0 0 var(--trait-fin) color-mix(in srgb, var(--bordure) 80%, transparent)}}.hv-segments[data-taille=petit]{block-size:calc(var(--spacing,.25rem) * 8)}.hv-segments-fond{inset-block:var(--marge-segments);inline-size:calc((100% - 2 * var(--marge-segments)) / var(--nombre));border-radius:var(--radius-pilule);background-color:var(--fond-releve);box-shadow:var(--ombre-pouce), inset 0 var(--trait-fin) 0 var(--verre-reflet), inset 0 0 0 var(--trait-fin) var(--accent);position:absolute;inset-inline-start:var(--marge-segments)}@supports (color:color-mix(in lab, red, red)){.hv-segments-fond{box-shadow:var(--ombre-pouce), inset 0 var(--trait-fin) 0 var(--verre-reflet), inset 0 0 0 var(--trait-fin) color-mix(in srgb, var(--accent) 16%, transparent)}}.hv-segments-fond{transform:translateX(calc(var(--rang,0) * 100% * var(--sens)))}@media (prefers-color-scheme:dark){:root:not(.light) .hv-segments-fond{background-color:var(--fond-releve)}@supports (color:color-mix(in lab, red, red)){:root:not(.light) .hv-segments-fond{background-color:color-mix(in srgb, var(--fond-releve) 90%, var(--accent))}}:root:not(.light) .hv-segments-fond{box-shadow:inset 0 0 0 var(--trait-fin) var(--accent)}@supports (color:color-mix(in lab, red, red)){:root:not(.light) .hv-segments-fond{box-shadow:inset 0 0 0 var(--trait-fin) color-mix(in srgb, var(--accent) 40%, transparent)}}}.dark .hv-segments-fond{background-color:var(--fond-releve)}@supports (color:color-mix(in lab, red, red)){.dark .hv-segments-fond{background-color:color-mix(in srgb, var(--fond-releve) 90%, var(--accent))}}.dark .hv-segments-fond{box-shadow:inset 0 0 0 var(--trait-fin) var(--accent)}@supports (color:color-mix(in lab, red, red)){.dark .hv-segments-fond{box-shadow:inset 0 0 0 var(--trait-fin) color-mix(in srgb, var(--accent) 40%, transparent)}}.hv-segment{z-index:1;justify-content:center;align-items:center;gap:calc(var(--cran) * 3);min-inline-size:0;padding-inline:calc(var(--spacing,.25rem) * 2);border-radius:var(--radius-pilule);color:var(--texte-secondaire);white-space:nowrap;font-size:.84375rem;font-weight:600;display:flex;position:relative}.hv-segments[data-taille=petit] .hv-segment{font-size:.8125rem}.hv-segment:after{inset:calc(calc(var(--spacing,.25rem) * 1.5) * -1) calc(var(--cran) * -1);content:"";position:absolute}.hv-segment[aria-checked=true]{color:var(--texte)}.hv-segment>svg{inline-size:calc(var(--spacing,.25rem) * 3.5);block-size:calc(var(--spacing,.25rem) * 3.5);flex-shrink:0}.hv-segment[aria-checked=true]>svg{color:var(--accent)}.hv-segment:focus-visible{outline:var(--contour-havrouta) solid var(--accent);outline-offset:var(--trait-fin)}@media (hover:hover) and (pointer:fine){.hv-segment:hover{color:var(--texte)}}@media (prefers-reduced-motion:no-preference){.hv-segments-fond[data-glisse]{transition:transform var(--t-moyen) var(--ease-sortie)}.hv-segment{transition:color var(--t-court) var(--ease-doux), background-color var(--t-court) var(--ease-doux), opacity var(--t-moyen) var(--ease-doux), scale var(--t-court) var(--ease-doux)}.hv-segment:active{scale:var(--presse-texte)}}