.draggable{--sticker-rotate:30deg;--sticker-p:10px;--sticker-peelback-hover:30%;--sticker-peelback-active:40%;--sticker-peel-easing:power3.out;--sticker-peel-hover-easing:power2.out;--sticker-start:calc(-1 * var(--sticker-p));--sticker-end:calc(100% + var(--sticker-p));--sticker-shadow-opacity:.6;--sticker-lighting-constant:.1;--peel-direction:0deg}.sticker-container{transform:rotate(var(--peel-direction));transform-origin:50%;position:relative}.sticker-container *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.sticker-main{--peel-x1:0%;--peel-x2:100%;--peel-y:var(--sticker-peelback-hover);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));transition:clip-path .6s ease-out}.sticker-main>*{transform:rotate(calc(-1 * var(--peel-direction)))}.sticker-image{transform:rotate(var(--sticker-rotate));transition:transform .35s cubic-bezier(.2,.85,.3,1.1)}.flap{width:100%;height:100%;left:0;top:calc(-100% - var(--sticker-p) - var(--sticker-p));filter:drop-shadow(0 6px 6px #00000040);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));transition:all .6s ease-out;position:absolute;transform:scaleY(-1)}.flap>*{transform:rotate(calc(-1 * var(--peel-direction)))}.flap-image{transform:rotate(var(--sticker-rotate))}.draggable{position:absolute;transform:translateZ(0)}@media (hover:none) and (pointer:coarse){.draggable{cursor:default}.sticker-container{touch-action:none}}.sticker-image,.flap-image{width:var(--sticker-width,200px)}.sticker-main,.flap{will-change:clip-path, transform}.draggable.gluing .sticker-container{animation:glueAppear 10ms var(--glue-delay,0s) backwards}.draggable.gluing .sticker-main{animation:glueMain .9s var(--glue-delay,0s) cubic-bezier(.2, .85, .3, 1) backwards}.draggable.gluing .flap{animation:glueFlap .9s var(--glue-delay,0s) cubic-bezier(.2, .85, .3, 1) backwards}@keyframes glueAppear{0%{opacity:0}to{opacity:1}}@keyframes glueMain{0%{clip-path:polygon(var(--sticker-start) 95%, var(--sticker-end) 95%, var(--sticker-end) var(--sticker-end), var(--sticker-start) var(--sticker-end))}to{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))}}@keyframes glueFlap{0%{clip-path:polygon(var(--sticker-start) var(--sticker-start), var(--sticker-end) var(--sticker-start), var(--sticker-end) 95%, var(--sticker-start) 95%);top:calc(90% - 1px)}to{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))}}