/* One elastic thumb follows a horizontal axis and compresses against a fixed stop. */
#appearance-controls,#appearance-controls *{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none;-webkit-tap-highlight-color:transparent}
#appearance-controls::before{box-sizing:border-box;background:var(--surface);border-color:var(--rule)}
html:has(#appearance-controls.appearance-grabbing),html:has(#appearance-controls.appearance-grabbing) *{user-select:none!important;-webkit-user-select:none!important;-webkit-touch-callout:none}
@media(prefers-reduced-motion:no-preference){
 /* Enlarge the hit target without changing the rail or overlapping labels. */
 #appearance-controls button::after{content:"";position:absolute;inset:-14px 0;touch-action:none}
 #appearance-controls #appearance-day::after{left:-12px}
 #appearance-controls #appearance-night::after{right:-12px}
 #appearance-controls.appearance-gesture-ready{touch-action:none}
 #appearance-controls.appearance-gesture-ready button{position:relative;z-index:2;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
 #appearance-controls.appearance-gesture-ready button[aria-pressed=true]{cursor:ew-resize;touch-action:none;-webkit-touch-callout:none}
 #appearance-controls.appearance-dragging{z-index:5;user-select:none;-webkit-user-select:none}
 #appearance-controls button.appearance-pulling{z-index:3;transform:translateX(var(--appearance-pull-x)) scale(var(--appearance-pull-scale-x),var(--appearance-pull-scale-y));transition:none!important;cursor:grabbing;outline:0}
 #appearance-controls:is(.appearance-loading,.appearance-flight,.appearance-returning)::before{z-index:1;background:var(--surface);border-color:var(--rule);box-shadow:0 2px 7px rgb(0 0 0 / .12),inset 0 1px 0 var(--glass-highlight);transition:none!important;will-change:transform;pointer-events:none}
 #appearance-controls.appearance-loading::before{transform:translateX(var(--sling-x)) scale(var(--sling-scale-x),var(--sling-scale-y));transform-origin:50% 50%}
 #appearance-controls.appearance-flight::before{animation:appearance-sling-travel var(--sling-flight-ms) cubic-bezier(.5,0,.85,.4) forwards,appearance-sling-impact var(--sling-impact-ms) linear var(--sling-flight-ms) forwards}
 #appearance-controls.appearance-returning::before{animation:appearance-sling-return 200ms cubic-bezier(.2,.8,.3,1) forwards}
 #appearance-controls button.appearance-releasing{animation:appearance-recoil 200ms cubic-bezier(.2,.8,.3,1) both}
}
@keyframes appearance-sling-travel{
 from{transform:translateX(var(--sling-from-x)) scale(var(--sling-scale-x),var(--sling-scale-y));transform-origin:50% 50%}
 to{transform:translateX(var(--sling-to-x)) scale(1,1);transform-origin:50% 50%}
}
@keyframes appearance-sling-impact{
 0%{transform:translateX(var(--sling-to-x)) scale(1,1);transform-origin:var(--sling-origin)}
 12%{transform:translateX(var(--sling-to-x)) scale(var(--sling-impact-x),var(--sling-impact-y));transform-origin:var(--sling-origin)}
 32%{transform:translateX(var(--sling-bounce-x)) scale(calc(1 + var(--sling-impact-energy) * .12),calc(1 - var(--sling-impact-energy) * .09));transform-origin:var(--sling-origin)}
 58%{transform:translateX(var(--sling-to-x)) scale(calc(1 - var(--sling-impact-energy) * .07),calc(1 + var(--sling-impact-energy) * .06));transform-origin:var(--sling-origin)}
 80%{transform:translateX(var(--sling-to-x)) scale(calc(1 + var(--sling-impact-energy) * .025),calc(1 - var(--sling-impact-energy) * .02));transform-origin:var(--sling-origin)}
 100%{transform:translateX(var(--sling-to-x)) scale(1,1);transform-origin:var(--sling-origin)}
}
@keyframes appearance-sling-return{
 from{transform:translateX(var(--sling-from-x)) scale(var(--sling-scale-x),var(--sling-scale-y))}
 to{transform:translateX(var(--sling-to-x)) scale(1,1)}
}
@keyframes appearance-recoil{
 from{transform:translateX(var(--appearance-pull-x)) scale(var(--appearance-pull-scale-x),var(--appearance-pull-scale-y))}
 to{transform:translateX(0) scale(1,1)}
}
@media(prefers-reduced-motion:reduce){
 #appearance-controls::before,#appearance-controls button.appearance-pulling,#appearance-controls button.appearance-releasing{animation:none!important}
}

