kanda-comparison{display:block;min-width:0;width:100%}.kanda-comparison__images{position:relative;display:grid;gap:var(--kanda-gallery-gap, 1rem);overflow:hidden;border-radius:var(--kanda-gallery-radius, 0)}.kanda-comparison__side{position:relative;min-width:0}.kanda-comparison__side img{display:block;width:100%;height:auto;aspect-ratio:var(--comparison-ratio);object-fit:var(--comparison-fit, cover)}.kanda-comparison__label{display:block;padding:.5rem .75rem;color:var(--kanda-text);background:var(--kanda-bg);font-size:.875rem}kanda-comparison[data-ready] .kanda-comparison__images{aspect-ratio:var(--comparison-ratio);display:block}kanda-comparison[data-ready] .kanda-comparison__side{position:absolute;top:0;right:0;bottom:0;left:0}kanda-comparison[data-ready] .kanda-comparison__side img{width:100%;height:100%;max-height:none;object-fit:var(--comparison-fit, cover)}kanda-comparison[data-ready] .kanda-comparison__before{z-index:1;clip-path:inset(0 calc(100% - var(--comparison-position)) 0 0)}kanda-comparison[data-ready][data-orientation=vertical] .kanda-comparison__before{clip-path:inset(0 0 calc(100% - var(--comparison-position)) 0)}kanda-comparison[data-ready] .kanda-comparison__label{position:absolute;bottom:.75rem;left:.75rem;border-radius:.25rem}kanda-comparison[data-ready] .kanda-comparison__after .kanda-comparison__label{left:auto;right:.75rem}kanda-comparison[data-orientation=vertical][data-ready] .kanda-comparison__before .kanda-comparison__label{top:.75rem;bottom:auto}.kanda-comparison__control{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3}.kanda-comparison__control input{appearance:none;-webkit-appearance:none;position:absolute;top:0;right:0;bottom:0;left:0;margin:0;padding:0;width:100%;height:100%;background:transparent;border:0;border-radius:0;box-shadow:none;cursor:ew-resize;direction:ltr;touch-action:pan-y}.kanda-comparison__control input{left:-22px;width:calc(100% + 44px)}.kanda-comparison__control:has(input:focus-visible){outline:3px solid var(--kanda-accent);outline-offset:-3px}.kanda-comparison__control input:focus-visible{outline:none}.kanda-comparison__control input::-webkit-slider-runnable-track{height:44px;background:transparent;border:0}.kanda-comparison__control input::-moz-range-track{height:44px;background:transparent;border:0}.kanda-comparison__control input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;height:44px;width:44px;border:0;background:transparent}.kanda-comparison__control input::-moz-range-thumb{height:44px;width:44px;border:0;background:transparent}.kanda-comparison__divider{position:absolute;top:0;bottom:0;left:var(--comparison-position);border-left:var(--comparison-divider) var(--comparison-divider-style) var(--kanda-bg);filter:drop-shadow(1px 0 1px #000);z-index:2;pointer-events:none}.kanda-comparison__divider:after{content:"\2194";position:absolute;left:0;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;box-sizing:border-box;width:44px;height:44px;border:2px solid var(--kanda-text);border-radius:50%;background:var(--kanda-bg);color:var(--kanda-text);font:20px/1 sans-serif}[data-handle=square] .kanda-comparison__divider:after{border-radius:.25rem}[data-handle=pill] .kanda-comparison__divider:after{width:28px;border-radius:14px}[data-handle=line] .kanda-comparison__divider:after{content:"";width:12px;border-radius:3px}[data-orientation=vertical] .kanda-comparison__control input{left:0;top:-22px;width:100%;height:calc(100% + 44px);writing-mode:vertical-lr;cursor:ns-resize;touch-action:pan-x}[data-orientation=vertical] .kanda-comparison__control input::-webkit-slider-runnable-track{width:44px;height:100%}[data-orientation=vertical] .kanda-comparison__control input::-moz-range-track{width:44px;height:100%}[data-orientation=vertical] .kanda-comparison__divider{left:0;right:0;top:var(--comparison-position);bottom:auto;border-left:0;border-top:var(--comparison-divider) var(--comparison-divider-style) var(--kanda-bg)}[data-orientation=vertical] .kanda-comparison__divider:after{content:"\2195";left:50%;top:0}[data-orientation=vertical][data-handle=line] .kanda-comparison__divider:after{content:"";width:44px;height:12px}@supports (mask-image: linear-gradient(to right,#000,transparent)){kanda-comparison[data-ready][data-edge=soft] .kanda-comparison__before{clip-path:none;-webkit-mask-image:linear-gradient(to right,#000 max(0%,calc(var(--comparison-position) - 2%)),transparent min(100%,calc(var(--comparison-position) + 2%)));mask-image:linear-gradient(to right,#000 max(0%,calc(var(--comparison-position) - 2%)),transparent min(100%,calc(var(--comparison-position) + 2%)))}kanda-comparison[data-ready][data-edge=soft][data-orientation=vertical] .kanda-comparison__before{-webkit-mask-image:linear-gradient(to bottom,#000 max(0%,calc(var(--comparison-position) - 2%)),transparent min(100%,calc(var(--comparison-position) + 2%)));mask-image:linear-gradient(to bottom,#000 max(0%,calc(var(--comparison-position) - 2%)),transparent min(100%,calc(var(--comparison-position) + 2%)))}}.kanda-comparison__open{margin-block:.5rem;padding:.5rem .75rem;border:1px solid var(--kanda-text);color:var(--kanda-text);background:var(--kanda-bg);cursor:pointer;font:inherit}kanda-comparison[data-ready][data-limit=start] .kanda-comparison__before{clip-path:inset(0 100% 0 0);-webkit-mask-image:none;mask-image:none}kanda-comparison[data-ready][data-limit=end] .kanda-comparison__before{clip-path:inset(0);-webkit-mask-image:none;mask-image:none}.kanda-comparison__warning{padding:.5rem;color:var(--kanda-text);background:var(--kanda-bg)}.kanda-gallery-dialog__stage kanda-comparison{width:min(100%,1100px);margin-inline:auto}.kanda-gallery-dialog__stage kanda-comparison .kanda-comparison__images{max-height:70vh}@media(forced-colors:active){.kanda-comparison__divider{border-color:CanvasText;filter:none}}@media print{kanda-comparison[data-ready] .kanda-comparison__images{display:grid;aspect-ratio:auto}kanda-comparison[data-ready] .kanda-comparison__side{position:relative;clip-path:none;-webkit-mask-image:none;mask-image:none}.kanda-comparison__control,.kanda-comparison__divider,.kanda-comparison__open{display:none}}
/*# sourceMappingURL=/cdn/shop/t/4/assets/kanda-comparison.css.map */