.allstar-before-after{--ba-divider-color:#ffffff;--ba-divider-width:2px;--ba-label-offset:12px;--ba-pos:50%}.allstar-ba-stage{position:relative;overflow:hidden;width:100%;aspect-ratio:16 / 9;cursor:col-resize;user-select:none;-webkit-user-select:none}.allstar-ba--vertical .allstar-ba-stage{cursor:row-resize}.allstar-ba-panel{position:absolute;inset:0}.allstar-ba-img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none;user-select:none;-webkit-user-drag:none}.allstar-ba--horizontal .allstar-ba-after{clip-path:inset(0 0 0 var(--ba-pos))}.allstar-ba--vertical .allstar-ba-after{clip-path:inset(var(--ba-pos) 0 0 0)}.allstar-ba-divider{position:absolute;z-index:2;display:flex;align-items:center;justify-content:center;pointer-events:none}.allstar-ba--horizontal .allstar-ba-divider{top:0;bottom:0;left:var(--ba-pos);transform:translateX(-50%);width:var(--ba-divider-width);background-color:var(--ba-divider-color);flex-direction:column}.allstar-ba--vertical .allstar-ba-divider{left:0;right:0;top:var(--ba-pos);transform:translateY(-50%);height:var(--ba-divider-width);background-color:var(--ba-divider-color);flex-direction:row}.allstar-ba-handle{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;gap:3px;flex-shrink:0;width:40px;height:40px;border-radius:50%;background-color:#0055a5;color:#fff;cursor:grab;box-shadow:0 2px 8px rgb(0 0 0 / .3);pointer-events:auto;touch-action:none;transition:transform 120ms ease}.allstar-ba-handle:active,.allstar-before-after.allstar-ba--dragging .allstar-ba-handle{cursor:grabbing;transform:scale(.93)}.allstar-ba-arrow{display:flex;align-items:center;justify-content:center;flex-shrink:0;line-height:1}.allstar-ba-arrow svg,.allstar-ba-arrow img{display:block;width:16px;height:16px;pointer-events:none;flex-shrink:0}.allstar-ba-label{position:absolute;z-index:4;font-size:12px;font-weight:600;line-height:1;color:#fff;background-color:rgb(0 0 0 / .45);padding:4px 8px;border-radius:4px;pointer-events:none;white-space:nowrap}.allstar-ba-before .allstar-ba-label{z-index:0}.allstar-ba-label--top-left{top:var(--ba-label-offset);left:var(--ba-label-offset)}.allstar-ba-label--top-right{top:var(--ba-label-offset);right:var(--ba-label-offset)}.allstar-ba-label--bottom-left{bottom:var(--ba-label-offset);left:var(--ba-label-offset)}.allstar-ba-label--bottom-right{bottom:var(--ba-label-offset);right:var(--ba-label-offset)}.allstar-ba-range{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.allstar-before-after:focus-within .allstar-ba-stage{outline:3px solid #0055a5;outline-offset:2px}