.photo-comparison { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.photo-comparison.single { grid-template-columns:1fr; }
.photo-comparison figure { margin:0; min-width:0; }
.photo-comparison figcaption { margin:0 0 8px; color:var(--freeify-muted); }
.photo-stage { overflow:auto; max-height:70vh; background:repeating-conic-gradient(#eee 0% 25%,#ccc 0% 50%) 50% / 20px 20px; border:1px solid var(--freeify-line); }
.photo-stage canvas { display:block; width:100%; height:auto; max-width:none; touch-action:none; }
.region-wrap { position:relative; width:100%; }
.region-outline { position:absolute; border:2px solid #f6c845; outline:1px solid #111; background:#e6bd4014; pointer-events:none; }
.region-wrap .selection-mask { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.photo-controls { display:flex; gap:20px; flex-wrap:wrap; align-items:end; }
.photo-controls label { display:grid; gap:8px; min-width:150px; color:var(--freeify-text); }
.photo-controls input[type=range] { width:180px; min-height:44px; accent-color:var(--freeify-gold); }
@media(max-width:700px){.photo-comparison{grid-template-columns:1fr}.photo-controls label{min-width:0;width:100%}.photo-controls input[type=range]{width:100%}}