.lesson-comparison{margin:1.5rem 0}.lesson-comparison-stage{aspect-ratio:4/3;border:1px solid var(--app-border);isolation:isolate;border-radius:18px;width:100%;position:relative;overflow:hidden}.lesson-comparison-layer{text-align:center;place-items:center;display:grid;position:absolute;inset:0}.lesson-comparison-before{background:#e8e0d6}.lesson-comparison-after{background:#f5f0e9}.lesson-comparison-layer>span{color:#493e38;font-size:1rem}.lesson-comparison-layer small{margin-top:6px;font-size:.8rem;display:inline-block}.lesson-comparison-layer img{object-fit:contain;width:100%;height:100%;max-height:none;box-shadow:none;border:0;border-radius:0;margin:0}.lesson-comparison-badge{z-index:2;color:#fff;letter-spacing:.05em;text-transform:uppercase;pointer-events:none;border-radius:20px;padding:5px 12px;font-size:.7rem;font-weight:600;position:absolute;top:14px}.lesson-comparison-badge.is-before{background:#493e38;left:14px}.lesson-comparison-badge.is-after{color:#331e1b;background:#e9e0d6;border:1px solid #cbbeb0;right:14px}.lesson-comparison-divider{pointer-events:none;z-index:2;background:#fff;width:2px;position:absolute;top:0;bottom:0;transform:translate(-50%)}.lesson-comparison-divider>span{color:#332723;background:#fff;border-radius:50%;place-items:center;width:44px;height:44px;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 2px 12px #0002}.lesson-comparison input{z-index:3;opacity:0;cursor:ew-resize;touch-action:pan-y;width:100%;height:100%;margin:0;position:absolute;inset:0}.lesson-comparison-stage:focus-within{outline-offset:4px;outline:2px solid #331e1b}.lesson-comparison figcaption{color:var(--app-text-muted);margin-top:.6rem;font-size:.8rem;line-height:1.5}.lesson-comparison-layer>span{position:absolute;top:50%;transform:translate(-50%,-50%)}.lesson-comparison-before>span{left:25%}.lesson-comparison-after>span{left:75%}.lesson-comparison-portrait{max-width:440px;margin-inline:auto}@media(max-width:600px){.lesson-comparison{max-width:300px;margin-inline:auto}.lesson-comparison-badge{padding:4px 10px;top:10px}.lesson-comparison-badge.is-before{left:10px}.lesson-comparison-badge.is-after{right:10px}}.lesson-comparison.lesson-comparison-pair{max-width:none}.lesson-comparison-pair-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.lesson-comparison-pair-item{min-width:0}.lesson-comparison-pair-item>strong{margin-bottom:8px;font-size:.9rem;display:block}.lesson-comparison-pair-image{border:1px solid var(--app-border);background:#f5f0e9;border-radius:14px;place-items:center;display:grid;overflow:hidden}.lesson-comparison-pair-image>span{text-align:center;color:var(--app-text-muted);padding:12px;font-size:.8rem}.lesson-comparison-pair-image>img{object-fit:contain;width:100%;height:100%;min-height:0;max-height:none;box-shadow:none;border:0;border-radius:0;margin:0;display:block}