.cm-player{position:relative;display:block;width:100%;height:100%;border:0;padding:0;background:transparent;color:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.cm-player:focus-visible{outline:2px solid #376454;outline-offset:5px}
.cm-surface{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:block;pointer-events:none;isolation:isolate}
.cm-poster,.cm-base{position:absolute;inset:0;width:100%;height:100%;display:block;max-width:none;object-fit:fill;user-select:none}
.cm-poster{position:relative}
.cm-player[data-entry-state=pending]:not([data-ready=true]) .cm-surface{opacity:0}
.cm-moving{position:absolute;inset:0;display:none;pointer-events:none}
.cm-scene,.cm-scene-gesture{position:absolute;inset:0;display:block;pointer-events:none}
.cm-base{mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat}
.cm-part,.cm-cap{position:absolute;display:block}
.cm-hover,.cm-click,.cm-idle,.cm-paper,.cm-crop{position:absolute;inset:0;display:block;width:100%;height:100%}
.cm-crop{overflow:hidden}
.cm-fragment-image{position:absolute;max-width:none!important;display:block;object-fit:fill;user-select:none}
.cm-player[data-ready=true]:not([data-still=true]) .cm-moving{display:block}
/* Cut paper. Each piece casts its own shadow, drawn once on a layer that never moves, so it costs nothing per frame:
   a tight edge for the thickness of the cut, and a soft shadow on the page for the sheet lifted off it. The uncut
   sheet's soft shadow (.cm-ground) stays on the page while the sheet floats and leans above it. */
[data-motion],.cm-player{--cm-edge:drop-shadow(.4px 1px .5px rgba(30,20,10,.34));--cm-lift:drop-shadow(.4px 1px .5px rgba(30,20,10,.32)) drop-shadow(1px 5px 4px rgba(30,20,10,.2));
  --cm-still:drop-shadow(.4px 1px .5px rgba(30,20,10,.34)) drop-shadow(1px 7px 9px rgba(30,20,10,.2));--cm-ground-a:.2}
:root[data-theme=night] :is([data-motion],.cm-player){--cm-edge:drop-shadow(.4px 1px .6px rgba(0,0,0,.66));--cm-lift:drop-shadow(.4px 1px .6px rgba(0,0,0,.62)) drop-shadow(1px 5px 5px rgba(0,0,0,.5));
  --cm-still:drop-shadow(.4px 1px .6px rgba(0,0,0,.66)) drop-shadow(1px 7px 10px rgba(0,0,0,.5));--cm-ground-a:.5}
@media(prefers-color-scheme:dark){:root:not([data-theme=day]) :is([data-motion],.cm-player){--cm-edge:drop-shadow(.4px 1px .6px rgba(0,0,0,.66));--cm-lift:drop-shadow(.4px 1px .6px rgba(0,0,0,.62)) drop-shadow(1px 5px 5px rgba(0,0,0,.5));
  --cm-still:drop-shadow(.4px 1px .6px rgba(0,0,0,.66)) drop-shadow(1px 7px 10px rgba(0,0,0,.5));--cm-ground-a:.5}}
[data-motion]>img,.cm-poster{filter:var(--cm-still)}
.cm-base{filter:var(--cm-edge)}
.cm-paper{filter:var(--cm-lift)}
.cm-ground,.cm-tilt,.cm-air{position:absolute;inset:0;display:block;pointer-events:none}
.cm-ground{display:none;transition:translate 1.2s cubic-bezier(.22,.7,.18,1)}
.cm-player[data-ready=true]:not([data-still=true]) .cm-ground{display:block}
.cm-ground-land,.cm-ground-shade{position:absolute;inset:0;display:block}
.cm-ground-shade{translate:1px 7px;filter:brightness(0) blur(4.5px);opacity:var(--cm-ground-a)}
.cm-ground-image{position:absolute;inset:0;width:100%;height:100%;max-width:none;display:block;object-fit:fill;user-select:none;mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat}
.cm-tilt{transition:transform 1.2s cubic-bezier(.22,.7,.18,1)}
.cm-player[data-leaning] :is(.cm-tilt,.cm-ground){transition-duration:.7s}
.cm-player[data-ready=true]:not([data-still=true]) .cm-poster{visibility:hidden}
@media(prefers-reduced-motion:reduce){.cm-player .cm-surface{opacity:1!important}.cm-player :is(.cm-moving,.cm-ground){display:none!important}.cm-player .cm-poster{visibility:visible!important}}