.before-after-card{display:grid;gap:12px;padding:15px;border:1px solid #e7dfd1;border-radius:18px;background:#fffdfa;box-shadow:0 8px 20px #2418070a}.before-after-card header{display:grid;gap:3px}.before-after-card header strong{font-size:1rem}.before-after-card header small,.before-after-card .private-note{color:#706b62;font-size:.84rem;line-height:1.6}.before-after-comparator{position:relative;overflow:hidden;aspect-ratio:4/3;border-radius:14px;background:#e9e3d9;touch-action:none;isolation:isolate}.before-after-comparator>img,.before-after-before>img{display:block;width:100%;height:100%;object-fit:cover}.before-after-comparator>img{position:absolute;inset:0}.before-after-before{position:absolute;inset:0 auto 0 0;width:var(--before-split);overflow:hidden;border-left:2px solid #d7aa4c}.before-after-before>img{width:calc(100vw - 34px);max-width:none}.before-after-divider{position:absolute;inset:0 auto 0 var(--before-split);width:2px;background:#d7aa4c;transform:translateX(-1px);pointer-events:none}.before-after-comparator input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize}.before-after-card dl{display:grid;gap:8px;margin:0}.before-after-card dl>div{display:grid;grid-template-columns:minmax(92px,.65fr) 1fr;gap:10px}.before-after-card dt{font-weight:750}.before-after-card dd{margin:0;line-height:1.65}.before-after-tags{display:flex;flex-wrap:wrap;gap:6px}.before-after-drawer .panel{box-sizing:border-box;min-height:0;max-width:680px;height:100dvh;max-height:100dvh;overflow-y:auto;overscroll-behavior:contain;padding-bottom:max(2rem,env(safe-area-inset-bottom))}.before-after-drawer .field textarea{min-height:78px}.before-after-redaction{position:relative;overflow:hidden;min-height:150px;border-radius:13px;background:#eee6d9;touch-action:none}.before-after-redaction>img{display:block;width:100%;max-height:310px;object-fit:contain}.before-after-redaction .redaction-help{position:absolute;inset:auto 8px 8px;background:#16130ed9;color:#fff;padding:4px 7px;border-radius:7px;font-size:.76rem}.redaction-mark{position:absolute;background:#16130eed;border:1px dashed #fff;pointer-events:none}.before-after-preview{display:grid;gap:10px;padding-top:12px}.before-after-unavailable{border-color:#e5dbcd}@media (min-width:720px){.before-after-card{padding:18px}.before-after-before>img{width:620px}}@media (max-width:420px){.before-after-card{border-radius:14px;padding:12px}.before-after-card dl>div{grid-template-columns:1fr}.before-after-comparator{border-radius:11px}}
