.kbas{position:relative;width:100%;max-width:var(--kbas-max,100%);margin:0 auto var(--kbas-mb,0);box-sizing:border-box}.kbas *,.kbas *::before,.kbas *::after{box-sizing:border-box}.kbas__frame{position:relative;width:100%;overflow:hidden;line-height:0;border-radius:var(--kbas-radius,0);border:var(--kbas-border-w,0) solid var(--kbas-border-c,transparent);background:#f3f4f6;cursor:ew-resize;touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:#fff0;isolation:isolate}.kbas--vertical .kbas__frame{cursor:ns-resize;touch-action:pan-x}.kbas[data-drag="0"] .kbas__frame{cursor:default}.kbas--shadow-soft .kbas__frame{box-shadow:0 8px 24px rgb(15 23 42 / .08)}.kbas--shadow-medium .kbas__frame{box-shadow:0 18px 45px rgb(15 23 42 / .16)}.kbas--shadow-strong .kbas__frame{box-shadow:0 30px 70px rgb(15 23 42 / .28)}.kbas__img{display:block;width:100%;height:auto;max-width:none;margin:0;padding:0;border:0;border-radius:0;box-shadow:none}.kbas__after{position:relative;z-index:1}.kbas__before{position:absolute;inset:0;z-index:2;overflow:hidden;clip-path:inset(0 calc(100% - var(--kbas-pos, 50%)) 0 0);will-change:clip-path}.kbas--vertical .kbas__before{clip-path:inset(0 0 calc(100% - var(--kbas-pos, 50%)) 0)}.kbas__before .kbas__img{position:absolute;top:0;left:0;width:100%!important;height:100%!important;max-width:none!important;object-fit:var(--kbas-fit,cover);object-position:center}.kbas--ratio .kbas__frame{aspect-ratio:var(--kbas-ratio,3 / 2)}.kbas--fixed .kbas__frame{height:var(--kbas-h,480px)}.kbas--ratio .kbas__after,.kbas--fixed .kbas__after{position:absolute;inset:0}.kbas--ratio .kbas__after .kbas__img,.kbas--fixed .kbas__after .kbas__img{position:absolute;top:0;left:0;width:100%!important;height:100%!important;max-width:none!important;object-fit:var(--kbas-fit,cover);object-position:center}.kbas__divider{position:absolute;inset:0;z-index:4;pointer-events:none;transform:translateX(var(--kbas-pos,50%));will-change:transform}.kbas--vertical .kbas__divider{transform:translateY(var(--kbas-pos,50%))}.kbas__line{position:absolute;top:0;bottom:0;left:0;width:var(--kbas-line-w,2px);margin-left:calc(var(--kbas-line-w, 2px) / -2);background:var(--kbas-line-c,#ffffff);pointer-events:none}.kbas--vertical .kbas__line{top:0;bottom:auto;left:0;right:0;width:auto;height:var(--kbas-line-w,2px);margin-left:0;margin-top:calc(var(--kbas-line-w, 2px) / -2)}.kbas--line-shadow .kbas__line{box-shadow:0 0 14px rgb(0 0 0 / .35)}.kbas__handle{position:absolute;top:50%;left:0;transform:translate(-50%,-50%);pointer-events:auto;display:flex;align-items:center;justify-content:center;width:var(--kbas-handle-size,56px);height:var(--kbas-handle-size,56px);min-width:0;min-height:0;padding:0;margin:0;font-size:0;line-height:0;text-transform:none;letter-spacing:normal;background:var(--kbas-handle-bg,#ffffff);background-image:none;color:var(--kbas-handle-icon,#111827);border:var(--kbas-handle-border-w,0) solid var(--kbas-handle-border-c,transparent);border-radius:var(--kbas-handle-radius,999px);box-shadow:none;cursor:inherit;touch-action:none;appearance:none;-webkit-appearance:none}.kbas--vertical .kbas__handle{top:0;left:50%}.kbas--handle-shadow .kbas__handle{box-shadow:0 6px 22px rgb(15 23 42 / .3)}.kbas__handle:hover,.kbas__handle:focus,.kbas__handle:active{background:var(--kbas-handle-bg,#ffffff);color:var(--kbas-handle-icon,#111827)}.kbas__handle:focus{outline:none}.kbas__handle:focus-visible{outline:2px solid var(--kbas-handle-icon,#111827);outline-offset:3px}.kbas.is-dragging .kbas__handle,.kbas.is-dragging .kbas__handle:focus-visible{outline:none}.kbas__icon{display:block;width:var(--kbas-handle-icon-size,22px);height:var(--kbas-handle-icon-size,22px);pointer-events:none}.kbas--vertical .kbas__icon{transform:rotate(90deg)}.kbas__label{position:absolute;z-index:3;display:inline-block;max-width:calc(50% - var(--kbas-label-offset, 20px));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;color:var(--kbas-label-color,#ffffff);font-family:var(--kbas-label-font,inherit);font-size:var(--kbas-label-fs,14px);font-weight:var(--kbas-label-weight,700);letter-spacing:var(--kbas-label-ls,1px);text-transform:var(--kbas-label-transform,uppercase);line-height:1.25;padding:var(--kbas-label-py,9px) var(--kbas-label-px,18px);border-radius:var(--kbas-label-radius,999px);transition:opacity 0.25s ease}.kbas--label-blur .kbas__label{-webkit-backdrop-filter:blur(var(--kbas-label-blur,0));backdrop-filter:blur(var(--kbas-label-blur,0))}.kbas__label--before{left:var(--kbas-label-offset,20px);background:var(--kbas-label-bg-before,#1f2937)}.kbas__label--after{right:var(--kbas-label-offset,20px);background:var(--kbas-label-bg-after,#16a34a)}.kbas__label--top{top:var(--kbas-label-offset,20px)}.kbas__label--bottom{bottom:var(--kbas-label-offset,20px)}.kbas__label--center{top:50%;transform:translateY(-50%)}.kbas--vertical .kbas__label{left:50%;right:auto;transform:translateX(-50%)}.kbas--vertical .kbas__label--before{top:var(--kbas-label-offset,20px);bottom:auto}.kbas--vertical .kbas__label--after{bottom:var(--kbas-label-offset,20px);top:auto}.kbas--label-fade.is-dragging .kbas__label{opacity:0}.kbas.is-dragging .kbas__frame{cursor:grabbing}.kbas-notice{padding:12px 16px;border:1px dashed #cbd5e1;border-radius:8px;color:#64748b;font-size:14px}@media (max-width:1024px){.kbas--fixed .kbas__frame{height:var(--kbas-h-t,var(--kbas-h,420px))}.kbas__label{font-size:var(--kbas-label-fs-t,13px)}}@media (max-width:767px){.kbas--fixed .kbas__frame{height:var(--kbas-h-m,var(--kbas-h,320px))}.kbas__label{font-size:var(--kbas-label-fs-m,11px)}.kbas__handle{width:var(--kbas-handle-size-m,44px);height:var(--kbas-handle-size-m,44px)}.kbas--label-hide-mobile .kbas__label{display:none}}@media (prefers-reduced-motion:reduce){.kbas__divider{will-change:auto}}