/* Generated #c3 variant of accepted V4 comparison primitives. Figures intentionally omit V5 .shot to avoid opening its image viewer while dragging. Source CSS and components/compare.js remain shared. */
#c3 .compare{position:relative;margin-top:8px;border-radius:8px;overflow:hidden;border:1px solid var(--line);background:#fff;--p:50%;user-select:none;box-shadow:0 20px 40px -24px rgba(26,26,26,.3)}
#c3 .compare>img{width:100%}
#c3 .compare .after{position:absolute;inset:0;clip-path:inset(0 0 0 var(--p))}
#c3 .compare .after img{width:100%;height:100%;object-fit:cover}
#c3 .compare input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}
#c3 .compare .handle{position:absolute;top:0;bottom:0;left:var(--p);width:2px;background:var(--rust);transform:translateX(-1px);pointer-events:none}
#c3 .compare .handle::after{content:"⟷";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:38px;height:38px;border-radius:50%;background:var(--rust);color:#fff;font:16px/38px var(--sans);text-align:center;box-shadow:0 4px 12px rgba(0,0,0,.25)}
#c3 .compare .lbl{position:absolute;top:12px;font:600 11px/1 var(--mono);letter-spacing:.06em;padding:6px 9px;border-radius:3px;pointer-events:none}
#c3 .compare .lbl.l{left:12px;background:var(--ink);color:#fff}
#c3 .compare .lbl.r{right:12px;background:var(--rust);color:#fff}
#c3 .compare input:focus-visible ~ .handle::after{outline:3px solid var(--gold);outline-offset:2px}
#c3 .compare{border:1px solid #CFC8BD;border-radius:6px;overflow:hidden;background:#fff}
#c3 .compare>img{border:0!important;border-radius:0!important}
#c3 .bar{display:flex;justify-content:space-between;gap:12px;margin:0!important;padding:7px 12px;background:#1F1D1B;color:#BDB4A7;font:500 11px/1.2 var(--mono);letter-spacing:.04em}
#c3 .bar span:first-child{color:#EDE6DA}
#c3 .compare{padding-bottom:26px}
#c3 .compare .after{inset:0 0 26px 0}
#c3 .compare .handle{bottom:26px}
#c3 .compare input{inset:0 0 26px 0;height:auto}
#c3 .cbar{position:absolute;left:0;right:0;bottom:0}
#c3 .bar{font-family:var(--sans);font-size:11px;letter-spacing:.02em;padding:9px 12px}
@media(max-width:720px){#c3 .bar{font-size:10px}#c3 .bar span:last-child{display:none}}
#c3 .compare{box-shadow:none}
#c3 .compare>img{aspect-ratio:1440/968;object-fit:cover;object-position:top}
#c3 .compare .after img{object-position:top}
#c3 .compare .lbl{font-family:var(--sans);letter-spacing:0;font-size:11px}
#c3 .compare .handle::after{box-shadow:none}
#c3 .comparison-controls{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-top:13px}
#c3 .comparison-controls>span{font-size:12px;color:var(--muted)}
#c3 .comparison-controls>div{display:flex;gap:6px;flex-wrap:wrap}
#c3 .comparison-controls button{border:1px solid var(--line);border-radius:3px;background:transparent;padding:7px 10px;color:var(--ink-2);font-size:12px;cursor:pointer}
#c3 .comparison-controls button[aria-pressed="true"]{background:var(--rust-soft);border-color:#c88a72;color:#823c25}
@media(max-width:720px){#c3 .comparison-controls{align-items:start;flex-direction:column;gap:10px}#c3 .comparison-controls button{font-size:11px;padding:8px}#c3 .compare .lbl{font-size:10px;top:9px;padding:6px}#c3 .compare .lbl.l{left:8px}#c3 .compare .lbl.r{right:8px}#c3 .compare .handle::after{width:32px;height:32px;line-height:32px}}
#c3 .comparison-block{margin:28px 0}
#c3 .comparison-controls button{font-family:var(--sans)}
#c3 .comparison-controls button:focus-visible{outline:2px solid var(--rust);outline-offset:3px}
#c3 .compare .bar{font-family:var(--sans)}
#c3 .compare-copy-note{margin-top:14px;max-width:none}
