@scope([data-example]){[data-slot=slider]{gap:var(--space-2);flex-direction:column;width:20rem;max-width:100%;display:flex}[data-slot=slider][data-orientation=vertical]{width:auto;height:10rem}[data-slot=slider]>[data-slot=row]>[data-slot=label]{font-weight:400}:is([data-slot=slider],[data-slot=field]:has(>[data-slot=slider]))>[data-slot=row]{justify-content:space-between;gap:var(--space-4)}[data-slot=stack]:has(>[data-slot=slider]){align-items:stretch;width:20rem;max-width:100%}[data-slot=row]:has(>[data-slot=slider][data-orientation=vertical],>[data-slot=field]>[data-slot=slider][data-orientation=vertical]){gap:var(--space-8)}[data-slot=field]:has(>[data-slot=slider][data-orientation=vertical]){align-items:center;width:auto}[data-slot=stack]>form+[data-slot=field]:has([data-slot=slider]){padding-top:var(--space-4);border-top:1px solid var(--line-faint)}[data-slot=slider-value]{color:var(--muted);font-size:var(--text-sm);font-variant-numeric:tabular-nums}[data-slot=output]>[data-slot=slider-value]{display:inline}[data-slot=slider-control]{-webkit-user-select:none;user-select:none;align-items:center;width:100%;height:20px;display:flex}[data-slot=slider-control][data-orientation=vertical]{justify-content:center;width:20px;height:100%}[data-slot=slider-track]{box-sizing:border-box;background:linear-gradient(var(--line), var(--line)) center / 100% 1px no-repeat;border-radius:999px;width:100%;height:2px}[data-slot=slider-track][data-orientation=vertical]{background-size:1px 100%;width:2px;height:100%}[data-slot=slider-track][data-disabled]{background-image:linear-gradient(var(--line-faint), var(--line-faint))}[data-slot=ticks]{justify-content:space-between;height:5px;margin-top:-4px;display:flex}[data-slot=ticks]>span{background:var(--line);width:1px}[data-slot=slider-indicator]{background:var(--ink);border-radius:999px}[data-slot=slider-indicator][data-disabled]{background:var(--line-disabled)}[data-slot=slider-thumb]{box-sizing:border-box;width:var(--size-icon);height:var(--size-icon);background:var(--surface-1);box-shadow:inset 0 0 0 1.5px var(--ink), var(--shadow-drop);cursor:default;border-radius:50%;transition:box-shadow .1s ease-out}[data-slot=slider-thumb]:hover:not([data-disabled]){background:var(--tint)}[data-slot=slider-thumb][data-dragging]{background:var(--tint);box-shadow:inset 0 0 0 1.5px var(--ink), var(--shadow-drop-pressed)}[data-slot=slider-thumb]:has(:focus-visible){outline:3px solid var(--halo);outline-offset:2px}[data-slot=slider-thumb][data-disabled]{box-shadow:inset 0 0 0 1.5px var(--line-disabled)}[data-slot=slider]:has([data-slot=slider-thumb]>[data-slot=output])>[data-slot=slider-control]{margin-top:var(--space-6)}[data-slot=slider-thumb]>:is([data-slot=output],[data-slot=slider-value]){bottom:calc(100% + var(--space-2));background:var(--surface-2);min-height:0;box-shadow:var(--shadow-2);color:var(--ink);font-size:var(--text-xs);font-variant-numeric:tabular-nums;white-space:nowrap;pointer-events:none;opacity:0;translate:calc(var(--slider-thumb-position) * -1) 0;border-radius:6px;padding:2px 6px;line-height:16px;position:absolute;inset-inline-start:50%}[data-slot=slider-thumb]>:is([data-slot=output],[data-slot=slider-value]):is([dir=rtl],[dir=rtl] *){translate:var(--slider-thumb-position) 0}[data-slot=slider-thumb]:is([data-dragging],:has(:focus-visible))>:is([data-slot=slider-thumb]>:is([data-slot=output],[data-slot=slider-value])){opacity:1}}
