.ink-photoreal-comparison{--ink-photoreal-split:50%;aspect-ratio:8/5;background:var(--paper-2);width:100%;position:relative;overflow:hidden}.ink-photoreal-comparison img{object-fit:cover;width:100%;height:100%;display:block}.ink-photoreal-source{position:absolute;inset:0}.ink-photoreal-result{z-index:1;clip-path:inset(0 calc(100% - var(--ink-photoreal-split)) 0 0);position:absolute;inset:0;overflow:hidden}.ink-photoreal-label{z-index:3;color:var(--paper-0);font-size:13px;font-weight:var(--weight-semibold);background:#1f1d1bdb;padding:8px 11px;line-height:1.25;position:absolute;top:18px}.ink-photoreal-label--source{right:18px}.ink-photoreal-label--result{left:18px}.ink-photoreal-divider{z-index:3;top:0;bottom:0;left:clamp(22px, var(--ink-photoreal-split), calc(100% - 22px));background:var(--timber-6);pointer-events:none;width:2px;position:absolute;transform:translate(-1px)}.ink-photoreal-divider span{border:2px solid var(--timber-6);background:var(--paper-0);width:44px;height:44px;color:var(--graphite-9);font-size:19px;font-weight:var(--weight-semibold);border-radius:50%;place-items:center;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.ink-photoreal-comparison input[type=range]{z-index:4;appearance:none;cursor:ew-resize;touch-action:pan-y;background:0 0;outline:0;width:100%;height:44px;margin:0;position:absolute;top:50%;left:0;transform:translateY(-50%)}.ink-photoreal-comparison input[type=range]::-webkit-slider-runnable-track{background:0 0;height:44px}.ink-photoreal-comparison input[type=range]::-webkit-slider-thumb{appearance:none;background:0 0;border:0;width:44px;height:44px}.ink-photoreal-comparison input[type=range]::-moz-range-track{background:0 0;border:0;height:44px}.ink-photoreal-comparison input[type=range]::-moz-range-thumb{background:0 0;border:0;border-radius:0;width:44px;height:44px}.ink-photoreal-comparison:has(input[type=range]:focus-visible) .ink-photoreal-divider span{outline:3px solid var(--line-focus);outline-offset:4px}@media (max-width:600px){.ink-photoreal-comparison{aspect-ratio:8/5}.ink-photoreal-label{max-width:calc(50% - 20px);padding:7px 9px;font-size:12px;top:10px}.ink-photoreal-label--source{text-align:right;right:10px}.ink-photoreal-label--result{text-align:left;font-size:0;left:10px}.ink-photoreal-label--result:after{content:"Visualization";font-size:12px}}
