@property --scale{syntax:"<number>";inherits:false;initial-value:1}@property --x-offset{syntax:"<length>";inherits:true;initial-value:0}@property --y-offset{syntax:"<length>";inherits:true;initial-value:0}:has(>video.screen-recording){overflow:clip}.screen-recording-holder:has(>video.screen-recording){border:1px solid #ddd;border-radius:10px}video.screen-recording{--scale:1;--x-offset:0px;--y-offset:0px;transform:scale(var(--scale)) translate(var(--x-offset),var(--y-offset));transform-origin:center center;transition:transform .4s ease-in;will-change:transform}.sr-clicks.sr-instant,video.screen-recording.sr-instant{transition:none!important}.sr-clicks{inset:0;overflow:hidden;pointer-events:none;position:absolute;z-index:5;--scale:1;--x-offset:0px;--y-offset:0px;transform:scale(var(--scale)) translate(var(--x-offset),var(--y-offset));transform-origin:center center;transition:transform .4s ease-in}.sr-ring{animation:sr-ring-out var(--sr-dur,.75s) cubic-bezier(.2,.7,.3,1) forwards;border:3px solid var(--sr-color,#fff);border-radius:50%;height:var(--sr-size,76px);margin:calc(var(--sr-size, 76px)/-2) 0 0 calc(var(--sr-size, 76px)/-2);opacity:0;position:absolute;transform:scale(var(--sr-inv,1));width:var(--sr-size,76px)}.sr-ring:after{animation:sr-dot-out var(--sr-dur,.75s) ease-out forwards;background:var(--sr-color,#fff);border-radius:50%;content:"";inset:28%;opacity:.35;position:absolute}@keyframes sr-ring-out{0%{opacity:0;transform:scale(calc(var(--sr-inv, 1)*.18))}12%{opacity:.95}to{opacity:0;transform:scale(calc(var(--sr-inv, 1)*1))}}@keyframes sr-dot-out{0%{opacity:.5}60%{opacity:0}to{opacity:0}}@media (prefers-reduced-motion:reduce){.sr-clicks,video.screen-recording{transition:none}.sr-ring,.sr-ring:after{animation-duration:.01ms}}