.cla-smell-test{
  position:relative; border-radius:8px; overflow:hidden; border:1px solid var(--cla-border);
  aspect-ratio:4/3; background:linear-gradient(135deg, #2a1414, #1a0d0d); cursor:ew-resize; user-select:none;
}
.cla-smell-test img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.cla-smell-test .cla-after-layer{ position:absolute; inset:0; clip-path:inset(0 50% 0 0); z-index:2; }
.cla-smell-test .cla-after-layer .cla-fallback{ position:absolute; inset:0; background:linear-gradient(135deg, #0d1f2e, #0a151f); }
.cla-smell-test .cla-before-fallback{ position:absolute; inset:0; background:linear-gradient(135deg, #2a1414, #1a0d0d); z-index:0; }
.cla-smell-test .cla-divider{ position:absolute; top:0; bottom:0; left:50%; width:2px; background:var(--cla-accent); z-index:3; }
.cla-smell-test .cla-handle{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:44px; height:44px; border-radius:50%;
  background:var(--cla-accent); display:flex; align-items:center; justify-content:center;
  font-family:'Sora',sans-serif; font-weight:700; color:#fff; font-size:16px; z-index:4;
}
.cla-smell-test .cla-tag{
  position:absolute; top:20px; font-family:'Sora',sans-serif; font-weight:700; font-size:13px;
  letter-spacing:0.05em; text-transform:uppercase; padding:6px 14px; border-radius:2px;
}
.cla-smell-test .cla-tag.cla-before{ left:20px; background:rgba(220,80,80,0.15); color:#ff8a8a; z-index:1; }
.cla-smell-test .cla-tag.cla-after{ right:20px; background:rgba(45,125,255,0.15); color:#7db2ff; z-index:2; }
.cla-smell-test-caption{ text-align:center; font-size:13px; color:var(--cla-text-muted); margin-top:16px; }