/* One comparison control shared by both brands; only its handle accepts input. */
.sc3-compare-frame{--split:100%;height:clamp(400px,44vw,610px);position:relative;container-type:inline-size;border-radius:32px;overflow:visible;isolation:isolate;background:radial-gradient(ellipse at 50% 55%,#fff,#e8edf3);border:1px solid #ffffffbd;box-shadow:0 12px 40px #24395809;user-select:none;-webkit-user-select:none;cursor:default}
:root[data-theme=dark] .sc3-compare-frame{background:radial-gradient(ellipse at 50% 55%,#303943,#1b2028);border-color:#ffffff25}
.sc3-compare-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:40px 65px;max-width:none;pointer-events:none}
.sc3-compare-layer{position:absolute;inset:0;pointer-events:none;isolation:isolate}
.sc3-compare-before{clip-path:inset(0 calc(100% - var(--split)) 0 0)}
.sc3-compare-after{clip-path:inset(0 0 0 var(--split))}
.sc3-compare-word{position:absolute;left:0;right:0;top:29%;transform:translateY(-50%);text-align:center;white-space:nowrap;font-size:clamp(54px,20cqw,170px);font-weight:800;line-height:1;letter-spacing:-.07em;color:color-mix(in srgb,var(--text) 36%,transparent);pointer-events:none;z-index:-1}
.sc3-compare-before .sc3-compare-word{font-size:clamp(64px,24cqw,195px)}
.sc3-compare-divider{position:absolute;inset:0 auto 0 var(--split);width:2px;background:#fff9;transform:translateX(-50%);pointer-events:none;box-shadow:0 0 10px #13294112}
.sc3-compare-control{position:absolute;top:50%;left:var(--split);width:56px;height:56px;transform:translate(-50%,-50%);border-radius:50%;z-index:4;cursor:grab;touch-action:pan-y;outline:none}
.sc3-compare-control::before{content:"";position:absolute;inset:-12px;border-radius:50%}
.sc3-compare-control.is-dragging{cursor:grabbing}
.sc3-compare-handle{position:absolute;inset:0;width:100%;height:100%;border-radius:50%;display:grid;place-items:center;line-height:0;pointer-events:none;background:color-mix(in srgb,var(--surface,#fff) 80%,transparent);color:var(--text);border:1px solid var(--line);box-shadow:0 5px 25px #1a293b20,inset 0 1px 0 #fff5;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.sc3-compare-handle>svg{display:block;width:32px;height:24px;pointer-events:none}
.sc3-compare-handle .compare-grip{opacity:.25}
.sc3-compare-frame *{user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.sc3-compare-control.is-keyboard-focus .sc3-compare-handle{border-color:var(--text);box-shadow:0 5px 25px #1a293b20,inset 0 0 0 1px var(--text)}
.handy-shoe-comparison{min-width:0;width:100%;margin:0}
.handy-shoe-comparison .sc3-compare-frame,:root[data-theme=dark] .handy-shoe-comparison .sc3-compare-frame{height:auto;aspect-ratio:1.3;background:none;border:0;border-radius:0;box-shadow:none}
.handy-shoe-comparison .sc3-compare-image{padding:16px 0 0}
.handy-shoe-comparison .sc3-compare-control{width:50px;height:50px}
.handy-shoe-comparison .sc3-compare-divider{background:linear-gradient(transparent 5%,var(--line) 24%,var(--line) 76%,transparent 95%);box-shadow:none}
@media(max-width:800px){.sc3-compare-frame{height:400px}.sc3-compare-image{padding:28px 24px}.handy-shoe-comparison{max-width:640px;justify-self:center}}
@media(max-width:600px){.sc3-compare-frame{height:330px;border-radius:24px}.sc3-compare-image{padding:30px 10px}.sc3-compare-control{width:48px;height:48px}.handy-shoe-comparison{max-width:100%}.handy-shoe-comparison .sc3-compare-control{width:48px;height:48px}.handy-shoe-comparison,.sc5-care-compare{padding-inline:12px}}