.scc-compare{position:relative;display:block;width:100%;height:520px;min-height:200px;overflow:hidden;isolation:isolate;background:#e5e7eb;border-radius:0;user-select:none;-webkit-user-select:none;touch-action:pan-y}.scc-compare,.scc-compare *{box-sizing:border-box}.scc-media{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;min-width:0;min-height:0}.scc-after{z-index:1}.scc-before{z-index:2;clip-path:inset(0 calc(100% - var(--scc-position, 50%)) 0 0);-webkit-clip-path:inset(0 calc(100% - var(--scc-position, 50%)) 0 0)}.scc-visual{display:block;width:100%;height:100%}.scc-image{background-size:cover!important;background-position:center center!important;background-repeat:no-repeat!important;background-color:#e5e7eb}.scc-video{object-fit:cover;object-position:center center;background:#111827}.scc-empty{display:flex;align-items:center;justify-content:center;width:100%;height:100%;padding:24px;color:#374151;background:linear-gradient(135deg,#f3f4f6,#d1d5db);font:600 15px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;text-align:center}.scc-divider{position:absolute;z-index:6;top:0;bottom:0;left:var(--scc-position,50%);width:2px;background:#fff;transform:translateX(-50%);pointer-events:none;box-shadow:0 0 8px rgba(0,0,0,.25)}.scc-handle{position:absolute;z-index:8;top:50%;left:var(--scc-position,50%);display:flex;align-items:center;justify-content:center;width:48px;height:48px;color:#fff;background:#111827;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 12px rgba(0,0,0,.28);transform:translate(-50%,-50%);pointer-events:none}.scc-handle svg{display:block;width:22px;height:22px}.scc-labels{position:absolute;z-index:5;top:16px;right:16px;left:16px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;pointer-events:none;transition:opacity 160ms ease,visibility 160ms ease}.scc-compare.scc-at-start .scc-label-before,.scc-compare.scc-at-end .scc-label-after{visibility:hidden;opacity:0}.scc-label{display:inline-block;max-width:48%;padding:8px 13px;overflow-wrap:anywhere;color:#fff;background:#111827;border-radius:4px;font-size:13px;font-weight:700;line-height:1.3;letter-spacing:.02em;box-shadow:0 2px 8px rgba(0,0,0,.16)}.scc-label-before{text-align:left}.scc-label-after{margin-left:auto;text-align:right}.scc-range{position:absolute;z-index:10;inset:0;display:block;width:100%;height:100%;margin:0;padding:0;opacity:0;border:0;border-radius:0;background:transparent;cursor:ew-resize;-webkit-appearance:none;appearance:none;touch-action:pan-y}.scc-range::-webkit-slider-runnable-track{width:100%;height:100%;background:transparent;border:0}.scc-range::-webkit-slider-thumb{width:48px;height:100%;background:transparent;border:0;cursor:ew-resize;-webkit-appearance:none;appearance:none}.scc-range::-moz-range-track{width:100%;height:100%;background:transparent;border:0}.scc-range::-moz-range-thumb{width:48px;height:100%;background:transparent;border:0;border-radius:0;cursor:ew-resize}.scc-compare:focus-within .scc-handle{outline:3px solid rgba(17,24,39,.7);outline-offset:4px}@media (max-width:767px){.scc-compare{height:360px}.scc-labels{top:10px;right:10px;left:10px;gap:8px}.scc-label{padding:7px 10px;font-size:12px}.scc-handle{width:42px;height:42px}}@media (prefers-reduced-motion:reduce){.scc-compare *,.scc-compare *::before,.scc-compare *::after{scroll-behavior:auto!important;animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important}}