@property --comparison-split{syntax:'<percentage>';inherits:true;initial-value:40%}
.comparison-kitchen{--comparison-split:40%}
.comparison-kitchen .comparison-before{clip-path:inset(0 calc(100% - var(--comparison-split)) 0 0)}
.comparison-kitchen::before{left:var(--comparison-split)}
.comparison-kitchen .comparison-handle{left:var(--comparison-split)!important}
.comparison-guiding{animation:comparison-split-sine 3.8s linear(0,.006 5%,.024 10%,.054 15%,.095 20%,.146 25%,.206 30%,.273 35%,.345 40%,.422 45%,.5 50%,.578 55%,.655 60%,.727 65%,.794 70%,.854 75%,.905 80%,.946 85%,.976 90%,.994 95%,1) infinite alternate;animation-delay:var(--comparison-delay,0s)}
@keyframes comparison-split-sine{from{--comparison-split:40%}to{--comparison-split:60%}}
@media(max-width:600px){.comparison-kitchen .comparison-handle{font-size:20px;padding-bottom:7px}}
@media(prefers-reduced-motion:reduce){.comparison-guiding{animation:none}}