.sd-ba{--ring:#fff;aspect-ratio:4/3;touch-action:pan-y;-webkit-user-select:none;user-select:none;cursor:ew-resize;border-radius:22px;width:min(100%,320px);position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff1a}.sd-ba[data-fill=light]{--ring:#111;box-shadow:0 10px 30px -14px #0006}.sd-ba__layer{position:absolute;inset:0}.sd-ba__layer>*,.sd-ba__layer img,.sd-ba__layer svg{object-fit:cover;width:100%;height:100%;display:block}.sd-ba__before{clip-path:inset(0 calc(100% - var(--ba)) 0 0)}.sd-ba__desat{filter:grayscale(.85)contrast(.8)brightness(.9)}.sd-ba__tag{color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#00000080;border-radius:999px;align-items:center;height:24px;padding:0 9px;font-size:12px;font-weight:500;display:inline-flex;position:absolute;top:10px}.sd-ba__tag[data-side=l]{left:10px}.sd-ba__tag[data-side=r]{right:10px}.sd-ba__handle{top:0;bottom:0;left:var(--ba);background:var(--ring);outline:none;width:2px;margin-left:-1px;position:absolute}.sd-ba__handle>span{background:var(--ring);width:40px;height:40px;color:color-mix(in srgb, var(--ring) 10%, #777);border-radius:99px;place-items:center;transition:scale .25s cubic-bezier(.3,1.6,.4,1);display:grid;position:absolute;top:50%;left:50%;translate:-50% -50%;box-shadow:0 6px 18px #00000059}.sd-ba[data-fill=light] .sd-ba__handle>span{color:#fff}.sd-ba:active .sd-ba__handle>span{scale:.9}.sd-ba__handle:focus-visible>span{box-shadow:0 0 0 3px #0009, 0 0 0 5px var(--ring)}.sd-ba__handle svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:20px}@media (prefers-reduced-motion:reduce){.sd-ba *{transition:none!important}}