@property --reality-reveal{syntax:"<percentage>";inherits:true;initial-value:100%}.photo-transformation{isolation:isolate;--reality-reveal:100%;background:#080808;height:100%;min-height:340px;position:relative;overflow:hidden}.pt-scene,.pt-real{position:absolute;inset:0}.pt-scene{transform-origin:50% 48%}.pt-real{clip-path:inset(0 calc(100% - var(--reality-reveal)) 0 0);will-change:clip-path}.noir .st-process-content .photo-transformation img{object-fit:cover;object-position:50% 50%;width:100%;height:100%;position:absolute;inset:0;transform:none;animation:none!important}.pt-trace{filter:grayscale()brightness(.83)}.photo-transformation:after{content:"";z-index:1;pointer-events:none;background:linear-gradient(#0005,#0000 18% 72%,#000b);position:absolute;inset:0}.pt-top{z-index:3;color:#fff;letter-spacing:.12em;text-transform:uppercase;text-shadow:0 1px 8px #000;justify-content:space-between;gap:20px;font-size:12px;display:flex;position:absolute;top:20px;left:22px;right:22px}.pt-seam{z-index:2;pointer-events:none;width:100%;transform:translateX(var(--reality-reveal));will-change:transform;position:absolute;inset:0}.pt-seam:before{content:"";background:linear-gradient(#0000,#edce8c 20% 80%,#0000);width:1px;position:absolute;inset:0 auto 0 0;box-shadow:0 0 18px #f1ca8570}.pt-seam>span{color:#e8d1a9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#090909ae;border:1px solid #dbc18d;border-radius:50%;place-items:center;width:35px;height:35px;font-size:16px;display:grid;position:absolute;top:47%;left:.5px;transform:translate(-50%,-50%)}.pt-controls{z-index:4;color:#fff;justify-content:space-between;align-items:end;gap:16px;display:flex;position:absolute;bottom:22px;left:22px;right:22px}.pt-controls p{text-shadow:0 1px 8px #000;font:400 12px/1.6 var(--font-body)!important;margin:0!important}.pt-controls strong{color:#efcf96;font-weight:400}.pt-controls button{color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#080808a8;border:1px solid #ffffff60;border-radius:2px;flex-shrink:0;min-height:40px;padding:11px 13px;font:400 12px/1.2 var(--font-body)!important}.pt-controls button:hover{border-color:#e7c78c}.pt-controls button:disabled{display:none}.pt-slider{white-space:nowrap;flex:1;align-items:center;gap:12px;min-width:0;font-size:12px;display:flex}.pt-slider input{accent-color:#d7b572;cursor:ew-resize;width:100%;min-width:20px}.pt-slider input:focus-visible{outline-offset:6px;outline:2px solid #e7c78c}.photo-transformation[data-mode=automatic] .pt-real{animation:12.5s ease-in-out infinite both paused apb-photo-reveal}.photo-transformation[data-mode=automatic] .pt-seam{animation:12.5s ease-in-out infinite both paused apb-photo-seam}.noir .st-process-content .photo-transformation[data-mode=automatic] img{animation:16s ease-in-out infinite alternate both paused apb-photo-camera!important}.photo-transformation[data-mode=automatic][data-running=true] :is(.pt-real,.pt-seam){animation-play-state:running}.noir .st-process-content .photo-transformation[data-mode=automatic][data-running=true] img{animation-play-state:running!important}@keyframes apb-photo-reveal{0%,to{clip-path:inset(0 0% 0 0)}50%{clip-path:inset(0 100% 0 0)}}@keyframes apb-photo-seam{0%,to{transform:translate(100%)}50%{transform:translate(0%)}}@keyframes apb-photo-camera{0%{transform:scale(1.02)translate(-.3%)}to{transform:scale(1.075)translate(.3%)}}@media (max-width:600px){.photo-transformation{min-height:310px}.pt-top{font-size:12px;left:15px;right:15px}.pt-controls{gap:12px;bottom:18px;left:15px;right:15px}.pt-controls p{font-size:12px!important}.pt-slider{gap:8px}}
