.project-viewer-comparison{display:block;position:relative;isolation:isolate;overflow:hidden}
.project-viewer-comparison .project-viewer__viewport{scrollbar-width:none}
.project-viewer-comparison .project-viewer__viewport::-webkit-scrollbar{display:none;width:0;height:0}
.project-viewer-comparison__canvas{display:grid;grid-template-columns:minmax(0,1fr)}
.project-viewer-comparison__layer{grid-area:1/1;min-width:0}
.project-viewer-comparison__layer--after{clip-path:inset(0 0 0 var(--comparison-position,50%))}
.project-viewer-comparison__labels{position:absolute;z-index:1;inset:16px 16px auto;display:flex;justify-content:space-between;gap:16px;pointer-events:none}
.project-viewer-comparison__labels>span{max-width:45%;padding:6px 10px;border-radius:999px;background:var(--color-background);color:var(--color-foreground);box-shadow:0 2px 12px #00000012;font:500 12px/18px var(--font-body);overflow-wrap:anywhere}
.project-viewer-comparison[data-before-hidden] .project-viewer-comparison__labels>span:first-child,.project-viewer-comparison[data-after-hidden] .project-viewer-comparison__labels>span:last-child{visibility:hidden}
.project-viewer-comparison__divider{position:absolute;z-index:2;top:0;bottom:0;left:var(--comparison-position,50%);width:2px;transform:translateX(-50%);background:var(--color-background);box-shadow:0 0 4px #00000020;pointer-events:none}
.project-viewer-comparison__handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;gap:2px;width:44px;height:44px;border-radius:50%;background:var(--color-background);box-shadow:0 2px 12px #00000020}
.project-viewer-comparison__handle img{display:block}
.project-viewer-comparison .project-viewer-comparison__range{position:absolute;z-index:3;top:50%;left:-22px;width:calc(100% + 44px);height:44px;margin:0;padding:0;transform:translateY(-50%);border:0;outline:0;background:transparent;appearance:none;-webkit-appearance:none;pointer-events:none;touch-action:none}
.project-viewer-comparison__range::-webkit-slider-runnable-track{height:44px;background:transparent}
.project-viewer-comparison__range::-moz-range-track{height:44px;background:transparent}
.project-viewer-comparison__range::-webkit-slider-thumb{width:44px;height:44px;border:0;border-radius:50%;background:transparent;appearance:none;-webkit-appearance:none;pointer-events:auto;cursor:ew-resize}
.project-viewer-comparison__range::-moz-range-thumb{width:44px;height:44px;border:0;border-radius:50%;background:transparent;pointer-events:auto;cursor:ew-resize}
.project-viewer-comparison__range:focus-visible+.project-viewer-comparison__divider .project-viewer-comparison__handle{outline:2px solid var(--color-foreground);outline-offset:3px}
.project-viewer-comparison:not([data-comparison-ready]) :is(.project-viewer-comparison__layer--after,.project-viewer-comparison__range,.project-viewer-comparison__divider,.project-viewer-comparison__labels){display:none}
@media(max-width:989px){.project-viewer-comparison__labels{inset:10px 10px auto;gap:8px}.project-viewer-comparison__labels>span{padding:4px 8px;font-size:11px;line-height:16px}}