.box-scene{height:320px;position:relative;perspective:850px;touch-action:none;cursor:grab}.box-scene:active{cursor:grabbing}.box-scale{position:absolute;left:50%;top:65%;transform-style:preserve-3d}.gift-box{position:relative;transform-style:preserve-3d;width:0;height:0}.box-face{position:absolute;left:0;top:0;background:#171819;border:1px solid #353739;backface-visibility:visible}.box-front,.box-back{width:300px;height:85px}.box-front{transform:translate3d(-150px,-42.5px,109px);background:linear-gradient(#1c1d1e,#101112)}.box-back{transform:translate3d(-150px,-42.5px,-110px);background:#111}.box-left,.box-right{width:220px;height:85px;background:linear-gradient(110deg,#252627,#0d0e0f)}.box-left{transform:translate3d(-260px,-42.5px,0) rotateY(90deg)}.box-right{transform:translate3d(40px,-42.5px,0) rotateY(90deg)}.box-bottom{width:300px;height:220px;transform:translate3d(-150px,-67.5px,0) rotateX(90deg);background:#101112;box-shadow:inset 0 0 30px #000}.box-lid{position:absolute;width:300px;height:220px;transform-origin:50% 0;transform-style:preserve-3d}.lid-outside,.lid-inside{position:absolute;inset:0;background:linear-gradient(135deg,#2a2b2c,#111214 65%,#202122);border:2px solid #363839;backface-visibility:hidden;border-radius:2px;box-shadow:0 0 0 1px #080808}.lid-inside{transform:rotateX(180deg) translateZ(1px);background:linear-gradient(#18191a,#242526);box-shadow:inset 0 0 18px #080808}.box-lid img{position:absolute;width:150px;height:100px;left:75px;top:60px;object-fit:contain}.lid-flap{position:absolute;left:0;top:220px;width:300px;height:85px;transform-origin:50% 0;transform:rotateX(-90deg);transform-style:preserve-3d;background:linear-gradient(#1c1d1e,#101112);border:1px solid #353739;backface-visibility:visible}.lid-flap img{position:absolute;width:100px;height:50px;left:100px;top:17.5px;object-fit:contain}
.showcase-viewport .box-scene{height:100%;touch-action:pan-y}.showcase-viewport .box-scale{top:61%}.showcase-cycle-layer{position:absolute;inset:0;transition:opacity 1.8s ease;opacity:1}.showcase-cycle-layer.entering{opacity:0}.showcase-cycle-layer.leaving{opacity:0;pointer-events:none}.showcase-viewport{isolation:isolate}@media(prefers-reduced-motion:reduce){.showcase-cycle-layer{transition:none}}

.showcase-model .tee-preview{height:100%;padding:0;margin:0;background:transparent;border:0}.showcase-model .tee-preview>*:not(canvas){display:none}.showcase-model .tee-canvas{display:block;width:100%;height:100%;object-fit:contain;cursor:grab;touch-action:pan-y}

.showcase-cycle-layer{isolation:isolate}.showcase-ground-shadow{position:absolute;z-index:-1;pointer-events:none;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(ellipse,#22362f88 0%,#22362f50 38%,#22362f18 58%,transparent 75%);filter:blur(2.5px)}

.showcase-box-tray{position:absolute;width:284px;height:204px;left:-142px;top:-102px;transform:translateY(2px) rotateX(90deg);backface-visibility:hidden;box-shadow:0 0 5px #000}.showcase-box-tray svg{width:100%;height:100%;display:block}.showcase-packed-ball{position:absolute;transform-style:preserve-3d}.showcase-packed-ball i{position:absolute;border-radius:50%;background-image:radial-gradient(circle at 40% 40%,#fff8 0 15%,#7d858d30 23%,transparent 32%);background-size:6px 6px;backface-visibility:visible}

.showcase-model .crystal-preview{height:100%;padding:0;margin:0;background:transparent;border:0}.showcase-model .crystal-preview>*:not(canvas){display:none}.showcase-model .crystal-preview canvas{display:block;width:100%;height:100%;object-fit:contain;touch-action:pan-y;cursor:grab}