.booster-container{transform-style:preserve-3d;--mx:50%;--my:50%;filter:drop-shadow(0 0 18px #00c8ff40);cursor:pointer;isolation:isolate;flex-direction:column;align-items:center;margin-top:230px;transition:transform .15s ease-out;display:flex;position:relative;overflow:visible}.booster-top,.booster-bottom{line-height:0}.booster-top{z-index:2;transform-origin:100% 100%;will-change:transform,opacity;transition:none;position:relative}.booster-bottom{z-index:1;position:relative}.booster-container:before{content:"";pointer-events:none;z-index:3;background:radial-gradient(circle at var(--mx)var(--my),#fff3,#fff0 40%);mix-blend-mode:overlay;opacity:1;transition:opacity .15s ease-out;position:absolute;inset:10px}.booster-container.shake:before,.booster-container.open:before{opacity:0}.pack-light{opacity:0;filter:blur(10px);pointer-events:none;background:radial-gradient(circle at 50% 30%,#00c8ffe6,#00c8ff33,#0000);border-radius:999px;width:220px;height:140px;transition:opacity .25s,transform .35s;position:absolute;top:40px;left:50%;transform:translate(-50%)scaleY(.2)}.booster-container.open .pack-light{opacity:1;transform:translate(-50%)scaleY(1)}.booster-container.shake{animation:.14s ease-in-out pack-jitter}@keyframes pack-jitter{0%{transform:translate(0)rotate(0)}25%{transform:translate(-2px)rotate(-.6deg)}50%{transform:translate(2px)rotate(.6deg)}75%{transform:translate(-1px)rotate(-.3deg)}to{transform:translate(0)rotate(0)}}@media (max-height:700px){.booster-container{margin-top:120px}}@media (max-width:576px){.booster-container{margin-top:184px;transform:scale(.8)}}
.overlay{z-index:999;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-sizing:border-box;background:radial-gradient(#0028508c 0%,#000000d9 70%);flex-direction:column;justify-content:center;align-items:center;gap:clamp(1.25rem,4vh,4rem);padding:clamp(1rem,4vh,3rem) clamp(.75rem,3vw,2rem);display:flex;position:fixed;inset:0;overflow:hidden auto}.overlay-title{letter-spacing:6px;text-transform:uppercase;color:#cef;text-align:center;text-shadow:0 0 10px #64c8ffe6,0 0 25px #3296ff99;margin:0;font-size:clamp(1.55rem,3.6vw,2.4rem);line-height:1.15}.card-scroll-wrapper{overscroll-behavior-x:contain;touch-action:pan-x;scrollbar-width:thin;scrollbar-color:#4da3ff #0000004d;width:min(100%,1500px);max-width:100%;overflow:auto hidden}.card-scroll-wrapper.is-draggable{cursor:grab}.card-scroll-wrapper.is-dragging{cursor:grabbing;scroll-snap-type:none}.card-section{box-sizing:border-box;perspective:1200px;flex-wrap:nowrap;justify-content:center;gap:clamp(1rem,3vw,2rem);min-width:100%;padding:1rem .5rem;display:flex}.step-2{justify-content:flex-start}.overlay-button{color:#eaf6ff;cursor:pointer;background:linear-gradient(135deg,#1fa2ff,#07f);border:none;border-radius:999px;flex:none;padding:14px 36px;font-size:1rem;font-weight:600;box-shadow:0 0 15px #0096ffcc,0 0 35px #0078ff99}.overlay-button:hover{transform:translateY(-1px);box-shadow:0 0 16px #00b4ff,0 0 36px #0078ffe6}.card-wrapper{transform-style:preserve-3d;z-index:1;--my:50%;flex:none;position:relative}.card-frame{width:min(var(--card-width),86vw);height:min(var(--card-height),66vh);aspect-ratio:var(--card-width)/var(--card-height);background:linear-gradient(135deg,#ffffff2e,#fff0 42%),radial-gradient(circle at 50% 35%,#4da3ff47,#000a19d1 68%);border-radius:10px;transition:transform .24s,box-shadow .24s;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #78beff40,0 0 28px #008cff2e}.card-frame:before{content:"";background:linear-gradient(100deg,#0000 0%,#ffffff2e 45%,#0000 72%);transition:opacity .2s;animation:1.4s ease-in-out infinite card-shimmer;position:absolute;inset:0;transform:translate(-100%)}.card-frame.is-loaded:before{opacity:0;animation:none}.card-frame.is-loaded{box-shadow:none;background:0 0}.card-frame img{object-fit:contain;opacity:0;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:100%;height:100%;transition:opacity .28s;display:block}.card-frame.is-loaded img{opacity:1}.card-frame:not(.is-loaded) img{will-change:opacity}.card-frame-2{will-change:transform}.card-wrapper:hover .card-frame-2{transform:perspective(900px)rotateX(3deg)rotateY(-4deg)scale(1.025);box-shadow:inset 0 0 0 1px #78beff59,0 0 28px #008cff3d,0 12px 24px #00000040}@keyframes card-shimmer{to{transform:translate(100%)}}.flip-in{animation:.85s cubic-bezier(.22,.61,.36,1) both flipIn}@keyframes flipIn{0%{opacity:0;transform:rotateY(90deg)scale(.9)}55%{opacity:1;transform:rotateY(-10deg)scale(1.03)}75%{transform:rotateY(5deg)scale(1)}to{opacity:1;transform:rotateY(0)scale(1)}}.tooltip{color:#fff;pointer-events:none;white-space:pre-line;background:#0a2a4f;border-radius:6px;min-width:200px;padding:6px 10px;font-size:12px;animation:.15s fadeIn;position:absolute;top:50%;left:calc(100% + 12px);transform:translateY(-50%);box-shadow:0 10px 26px #00000047}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.card-wrapper:hover .tooltip{right:auto}.card-wrapper:hover:has(.tooltip){z-index:10}.step-1 .card-wrapper:nth-child(2n) .tooltip{left:auto;right:calc(100% + 12px)}.tooltip-title{margin-bottom:4px;font-size:14px;font-weight:700}.tooltip-subtitle{opacity:.8;margin-bottom:8px;font-size:12px}.tooltip-body{margin:0;font-size:12px;line-height:1.4}@media (max-height:720px){.overlay{gap:clamp(.75rem,2vh,1.25rem);padding-block:1rem}.card-frame-0{width:min(350px,58vw);height:min(530px,68vh)}.card-frame-1{width:min(270px,42vw);height:min(400px,60vh)}.card-frame-2{width:min(200px,28vw);height:min(300px,48vh)}.overlay-button{padding:12px 32px}}@media (max-width:640px){.overlay{justify-content:flex-start;padding-top:clamp(1.25rem,5vh,2rem)}.overlay-title{letter-spacing:3px}.card-section{justify-content:flex-start}.step-0,.step-1{justify-content:center}.card-frame-0,.card-frame-1{width:min(86vw,350px);height:auto;max-height:none}.card-frame-2{width:min(42vw,180px);height:auto}.tooltip,.step-1 .card-wrapper:nth-child(2n) .tooltip{max-width:min(260px,84vw);inset:auto auto 12px 50%;transform:translate(-50%)}}
.cursor-container{pointer-events:none;flex-direction:column;align-items:center;gap:.5rem;display:flex;position:absolute;top:60%;left:65%;transform:translate(25%,-50%)}.cursor-icon{filter:invert()drop-shadow(0 0 8px #00bfff)drop-shadow(0 0 16px #00bfff);opacity:.9}.cursor-label{color:#fff;text-shadow:0 0 6px #00bfff;font-size:1.25rem}@media (max-width:700px){.cursor-container{right:62px;transform:scale(.8)}}@media (max-width:576px){.cursor-container{top:50%;right:-40px;transform:scale(.5)}}