.boxart{position:relative;width:100%;--boxart-accent-resolved: var(--boxart-accent, var(--pp-accent, #d9c08a))}.boxart__outer{position:relative;width:100%;display:flex;align-items:stretch}.boxart__scene{flex:1 1 100%;position:relative;width:100%;padding:100% 0 0;perspective:200vw;perspective-origin:50% 90%;transform:scale(.9) translateY(2%);touch-action:pan-y}.boxart__box{display:block;position:absolute;top:0;left:calc((100% - var(--box-width, 100%)) / 2);width:100%;height:100%;transform-style:preserve-3d;transform:rotateY(30deg);transform-origin:calc(var(--box-width, 100%) / 2) 50%;will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden}.boxart__outer{cursor:grab}.boxart.is-dragging .boxart__outer,.boxart.is-dragging .boxart__outer *{cursor:grabbing}.boxart--static .boxart__box{transform:rotateY(0)}.boxart--static .boxart__outer{cursor:default}.boxart__scene,.boxart__box{user-select:none;-webkit-user-select:none}.boxart__face img{-webkit-user-drag:none;user-drag:none;pointer-events:none}.boxart__face{position:absolute;bottom:0;left:0;width:100%;height:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden}.boxart__face img{position:absolute;top:0;left:0;width:100%;height:100%;max-height:none;filter:none;object-fit:cover;backface-visibility:hidden;-webkit-backface-visibility:hidden}.boxart__face--front{width:var(--box-width);transform:rotateY(-90deg) translate(var(--box-center)) rotateY(90deg)}.boxart__face--back{width:var(--box-width);transform:rotateY(90deg) translate(var(--box-center)) rotateY(90deg);transform-origin:bottom center}.boxart__face--left{transform:rotateY(-90deg);transform-origin:bottom center;left:calc(var(--box-depth) / -2);width:var(--box-depth)}.boxart__face--right{transform:translate(-50%) rotateY(90deg);transform-origin:bottom center;width:var(--box-depth);left:var(--box-width)}.boxart__shadow{position:absolute;z-index:-1;left:50%;top:2%;height:98%;width:var(--box-width, 100%);border-radius:4%;background:#05030a;opacity:.5;pointer-events:none;transform:translate(-50%);filter:blur(18px);will-change:transform,filter,opacity}.boxart.is-focused{z-index:2147483000;isolation:isolate}@media(max-width:768px){.boxart__scene{perspective:300vw}}.boxart__hint{display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.5rem 0 0;color:var(--boxart-accent-resolved);font-size:.75rem;letter-spacing:.05em;text-transform:uppercase;opacity:.65;transition:opacity .3s}.boxart__hint.is-done,.boxart__outer:hover~.boxart__hint{opacity:0}.boxart__hint.is-done{pointer-events:none}.boxart__hint-icon{width:15px;height:15px;fill:currentColor;animation:boxart-swipe 2.4s ease-in-out infinite}@keyframes boxart-swipe{0%,to{transform:translate(-5px) rotate(-8deg)}50%{transform:translate(5px) rotate(8deg)}}.boxart__ghost{position:absolute;left:50%;top:50%;width:0;height:0;pointer-events:none;z-index:5;transition:opacity .45s ease}.boxart__ghost.is-done{opacity:0}.boxart__ghost-hand,.boxart__ghost-trail,.boxart__ghost-open,.boxart__ghost-grab{animation-iteration-count:2;animation-fill-mode:forwards}.boxart__ghost-hand{position:absolute;left:-15px;top:-15px;width:30px;height:30px;fill:#fff;filter:drop-shadow(0 0 2px rgba(0,0,0,.95)) drop-shadow(0 0 6px rgba(0,0,0,.8)) drop-shadow(0 3px 10px rgba(0,0,0,.7));animation-name:boxart-ghost-hand;animation-duration:3.6s;animation-timing-function:cubic-bezier(.45,0,.55,1)}.boxart__ghost-trail{position:absolute;left:-26px;top:-26px;width:52px;height:52px;border-radius:50%;border:2px solid var(--boxart-accent-resolved);background:#0a070c6b;box-shadow:0 0 14px #0000008c;opacity:0;animation-name:boxart-ghost-trail;animation-duration:3.6s;animation-timing-function:cubic-bezier(.45,0,.55,1)}@keyframes boxart-ghost-hand{0%{transform:translate(-46px) scale(.92);opacity:0}10%{transform:translate(-46px) scale(1);opacity:.95}24%{transform:translate(-46px) scale(1);opacity:.95}30%{transform:translate(-46px) scale(.94);opacity:.95}70%{transform:translate(46px) scale(.94);opacity:.95}84%{transform:translate(46px) scale(.92);opacity:0}to{transform:translate(46px) scale(.92);opacity:0}}.boxart__ghost-open,.boxart__ghost-grab{animation-duration:3.6s;animation-timing-function:linear}.boxart__ghost-open{animation-name:boxart-ghost-open}.boxart__ghost-grab{animation-name:boxart-ghost-grab}@keyframes boxart-ghost-open{0%,24%{opacity:1}30%,to{opacity:0}}@keyframes boxart-ghost-grab{0%,24%{opacity:0}30%,to{opacity:1}}@keyframes boxart-ghost-trail{0%,24%{transform:translate(-46px) scale(.5);opacity:0}32%{transform:translate(-46px) scale(1);opacity:.55}70%{transform:translate(46px) scale(1);opacity:.2}84%{transform:translate(46px) scale(1.4);opacity:0}to{transform:translate(46px) scale(1.4);opacity:0}}@media(prefers-reduced-motion:reduce){.boxart__ghost{display:none}.boxart__hint-icon{animation:none}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/boxart.css.map */