.sticker-peel{--sticker-p:10px;--sticker-peelback-hover:30%;--sticker-peelback-active:40%;--sticker-start:calc(-1 * var(--sticker-p));--sticker-end:calc(100% + var(--sticker-p));--peel-direction:50deg;--sticker-rotate:0deg;cursor:grab;touch-action:none;max-width:100%;line-height:0;display:inline-block;position:relative;transform:translateZ(0)}.sticker-peel:active{cursor:grabbing}.sticker-peel[data-draggable=false],.sticker-peel[data-draggable=false]:active{cursor:default}.sticker-peel__svg{width:0;height:0;position:absolute;overflow:hidden}.sticker-peel__container{transform:rotate(var(--peel-direction));transform-origin:50%;position:relative}.sticker-peel__container,.sticker-peel__container *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.sticker-peel__main{clip-path:polygon(var(--sticker-start) var(--sticker-start), var(--sticker-end) var(--sticker-start), var(--sticker-end) var(--sticker-end), var(--sticker-start) var(--sticker-end));filter:var(--sticker-filter-shadow);will-change:clip-path;transition:clip-path .6s ease-out}.sticker-peel__main>*{transform:rotate(calc(-1 * var(--peel-direction)))}.sticker-peel__lighting{filter:var(--sticker-filter-light)}.sticker-peel__container:hover .sticker-peel__main,.sticker-peel__container.touch-active .sticker-peel__main{clip-path:polygon(var(--sticker-start) var(--sticker-peelback-hover), var(--sticker-end) var(--sticker-peelback-hover), var(--sticker-end) var(--sticker-end), var(--sticker-start) var(--sticker-end))}.sticker-peel__container:active .sticker-peel__main{clip-path:polygon(var(--sticker-start) var(--sticker-peelback-active), var(--sticker-end) var(--sticker-peelback-active), var(--sticker-end) var(--sticker-end), var(--sticker-start) var(--sticker-end))}.sticker-peel__image{width:100%;height:auto;transform:rotate(var(--sticker-rotate));pointer-events:none;display:block}.sticker-peel__flap{width:100%;height:100%;left:0;top:calc(-100% - var(--sticker-p) - var(--sticker-p));clip-path:polygon(var(--sticker-start) var(--sticker-start), var(--sticker-end) var(--sticker-start), var(--sticker-end) var(--sticker-start), var(--sticker-start) var(--sticker-start));will-change:clip-path, top;pointer-events:none;transition:clip-path .6s ease-out,top .6s ease-out;position:absolute;transform:scaleY(-1)}.sticker-peel__flap>*{transform:rotate(calc(-1 * var(--peel-direction)))}.sticker-peel__container:hover .sticker-peel__flap,.sticker-peel__container.touch-active .sticker-peel__flap{clip-path:polygon(var(--sticker-start) var(--sticker-start), var(--sticker-end) var(--sticker-start), var(--sticker-end) var(--sticker-peelback-hover), var(--sticker-start) var(--sticker-peelback-hover));top:calc(-100% + 2 * var(--sticker-peelback-hover) - 1px)}.sticker-peel__container:active .sticker-peel__flap{clip-path:polygon(var(--sticker-start) var(--sticker-start), var(--sticker-end) var(--sticker-start), var(--sticker-end) var(--sticker-peelback-active), var(--sticker-start) var(--sticker-peelback-active));top:calc(-100% + 2 * var(--sticker-peelback-active) - 1px)}.sticker-peel__flap-lighting{filter:var(--sticker-filter-light-flipped)}.sticker-peel__flap-image{width:100%;height:auto;transform:rotate(var(--sticker-rotate));filter:var(--sticker-filter-expand);pointer-events:none;display:block}@media (hover:none) and (pointer:coarse){.sticker-peel{cursor:default}.sticker-peel__container{touch-action:none}}@media (prefers-reduced-motion:reduce){.sticker-peel__main,.sticker-peel__flap{transition:none}.sticker-peel__container:hover .sticker-peel__main,.sticker-peel__container.touch-active .sticker-peel__main,.sticker-peel__container:active .sticker-peel__main{clip-path:polygon(var(--sticker-start) var(--sticker-start), var(--sticker-end) var(--sticker-start), var(--sticker-end) var(--sticker-end), var(--sticker-start) var(--sticker-end))}.sticker-peel__container:hover .sticker-peel__flap,.sticker-peel__container.touch-active .sticker-peel__flap,.sticker-peel__container:active .sticker-peel__flap{clip-path:polygon(var(--sticker-start) var(--sticker-start), var(--sticker-end) var(--sticker-start), var(--sticker-end) var(--sticker-start), var(--sticker-start) var(--sticker-start));top:calc(-100% - var(--sticker-p) - var(--sticker-p))}}
