.mys-interactive-playground{position:relative;width:100%;max-width:var(--section-max-width, 4096px);margin-left:auto;margin-right:auto;box-sizing:border-box;background-color:var(--section-bg, #3B137E);background-image:var(--bg-image-desktop, none);background-size:100%;background-position:top;background-repeat:no-repeat;overflow:hidden;padding-top:var(--section-padding-top, 80px);padding-bottom:var(--section-padding-bottom, 80px);padding-left:var(--section-padding-left, 80px);padding-right:var(--section-padding-right, 80px);margin-top:var(--section-margin-top, 0px);margin-bottom:var(--section-margin-bottom, 0px)}@media screen and (max-width:1023px){.mys-interactive-playground{padding-top:var(--section-padding-top-tablet, 60px);padding-bottom:var(--section-padding-bottom-tablet, 60px);padding-left:var(--section-padding-left-tablet, 40px);padding-right:var(--section-padding-right-tablet, 40px);margin-top:var(--section-margin-top-tablet, 0px);margin-bottom:var(--section-margin-bottom-tablet, 0px)}}@media screen and (max-width:749px){.mys-interactive-playground{background-image:var(--bg-image-mobile, var(--bg-image-desktop, none));padding-top:var(--section-padding-top-mobile, 40px);padding-bottom:var(--section-padding-bottom-mobile, 40px);padding-left:var(--section-padding-left-mobile, 20px);padding-right:var(--section-padding-right-mobile, 20px);margin-top:var(--section-margin-top-mobile, 0px);margin-bottom:var(--section-margin-bottom-mobile, 0px)}}.mys-playground-wrapper{display:flex;flex-direction:column;width:100%;max-width:var(--container-max-width, 1200px);margin-left:auto;margin-right:auto;box-sizing:border-box}.mys-interactive-playground .mys-block-sparks-heading{position:relative;width:100%;display:flex;justify-content:center;margin-bottom:48px}.mys-interactive-playground .mys-sparks-wrap{position:relative;display:inline-flex;flex-direction:column;align-items:center;width:100%;max-width:var(--badge-max-width, 560px);margin:0 auto}.mys-interactive-playground .mys-heading-stack{position:relative;display:flex;flex-direction:column;align-items:center;width:100%;z-index:2;text-align:center}.mys-interactive-playground .mys-subtitle{font-family:var(--subtitle-font-family, var(--font-body-family));font-size:var(--subtitle-font-size, 40px);font-weight:var(--subtitle-font-weight, 600);color:var(--subtitle-color, #D0ADFF);letter-spacing:0;line-height:1.2;margin:0 0 var(--subtitle-mb, 8px) 0;text-align:center;max-width:100%}.mys-interactive-playground .mys-subtitle p{margin:0}.mys-interactive-playground .mys-main-badge{position:relative;display:inline-block;font-family:var(--badge-font-family, var(--font-heading-family));font-size:var(--badge-font-size, 40px);font-weight:var(--badge-font-weight, 400);color:var(--badge-color, #EEE1FF);background:var(--badge-bg, linear-gradient(90deg, #B972FF 0%, #700AD7 100%));padding-top:var(--badge-pt-desktop, 12px);padding-bottom:var(--badge-pb-desktop, 12px);padding-left:var(--badge-pl-desktop, 40px);padding-right:var(--badge-pr-desktop, 40px);border-radius:var(--badge-radius, 12px);line-height:1.2;letter-spacing:.02em;text-align:center;z-index:2}.mys-interactive-playground .mys-main-badge p{margin:0}.mys-interactive-playground .mys-footnote{font-family:var(--foot-font-family, var(--font-body-family));font-size:var(--foot-font-size, 40px);font-weight:var(--foot-font-weight, 600);color:var(--foot-color, #D0ADFF);letter-spacing:.02em;line-height:1.1;margin:var(--foot-mb, 0px) 0 0 0;text-align:center}.mys-interactive-playground .mys-footnote p{margin:0}.mys-interactive-playground .mys-bg-shape{position:relative;display:inline-block;max-width:100%;isolation:isolate}.mys-interactive-playground .mys-bg-shape-img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;object-position:center;z-index:-1;pointer-events:none;-webkit-user-select:none;user-select:none}.mys-interactive-playground .mys-bg-shape-img--mobile{display:none!important}@media screen and (max-width:749px){.mys-interactive-playground .mys-block-sparks-heading{margin-bottom:28px}.mys-interactive-playground .mys-bg-shape-img--desktop{display:none!important}.mys-interactive-playground .mys-bg-shape-img--mobile{display:block!important}}.mys-interactive-playground .mys-bg-shape--subtitle{padding-top:var(--subtitle-pt, 0px);padding-bottom:var(--subtitle-pb, 0px);padding-left:var(--subtitle-pl, 0px);padding-right:var(--subtitle-pr, 0px)}.mys-interactive-playground .mys-bg-shape--badge{padding-top:var(--badge-pt-desktop, 12px);padding-bottom:var(--badge-pb-desktop, 12px);padding-left:var(--badge-pl-desktop, 40px);padding-right:var(--badge-pr-desktop, 40px);border-radius:var(--badge-radius, 12px);max-width:var(--badge-max-width, 560px);margin-bottom:var(--badge-mb, 0px)}.mys-interactive-playground .mys-bg-shape--footnote{padding-top:var(--foot-pt, 0px);padding-bottom:var(--foot-pb, 0px);padding-left:var(--foot-pl, 0px);padding-right:var(--foot-pr, 0px)}.mys-interactive-playground .mys-bg-shape--badge:has(.mys-bg-shape-img) .mys-main-badge{background:transparent;border-radius:0;padding:0}.mys-interactive-playground .mys-bg-shape--badge:has(.mys-bg-shape-img){overflow:hidden}.mys-interactive-playground .mys-spark{position:absolute;z-index:1;pointer-events:none;background-color:var(--spark-color, #FAF1FF);-webkit-mask-image:var(--spark-mask-url);mask-image:var(--spark-mask-url);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;aspect-ratio:var(--spark-aspect-ratio, 1);width:100%;height:auto;display:block!important}.mys-interactive-playground .mys-spark--left{max-width:var(--left-spark-max-w-desktop, 80px);top:calc(50% + var(--left-spark-offset-v-desktop, 0px));transform:translateY(-50%);left:calc(-1 * var(--left-spark-offset-h-desktop, 40px));right:auto}.mys-interactive-playground .mys-spark--right{max-width:var(--right-spark-max-w-desktop, 80px);top:calc(50% + var(--right-spark-offset-v-desktop, 0px));transform:translateY(-50%);right:calc(-1 * var(--right-spark-offset-h-desktop, 40px));left:auto}@media screen and (max-width:749px){.mys-interactive-playground .mys-subtitle{font-size:var(--subtitle-font-size-mobile, 24px)}.mys-interactive-playground .mys-main-badge{font-size:var(--badge-font-size-mobile, 24px);padding-top:var(--badge-pt-mobile, 10px);padding-bottom:var(--badge-pb-mobile, 10px);padding-left:var(--badge-pl-mobile, 20px);padding-right:var(--badge-pr-mobile, 20px)}.mys-interactive-playground .mys-bg-shape--badge{padding-top:var(--badge-pt-mobile, 8px);padding-bottom:var(--badge-pb-mobile, 8px);padding-left:var(--badge-pl-mobile, 20px);padding-right:var(--badge-pr-mobile, 20px)}.mys-interactive-playground .mys-footnote{font-size:var(--foot-font-size-mobile, 14px)}.mys-interactive-playground .mys-spark--left{max-width:var(--left-spark-max-w-mobile, 48px)!important;top:calc(50% + var(--left-spark-offset-v-mobile, 0px))!important;left:calc(-1 * var(--left-spark-offset-h-mobile, 16px))!important;right:auto!important}.mys-interactive-playground .mys-spark--right{max-width:var(--right-spark-max-w-mobile, 48px)!important;top:calc(50% + var(--right-spark-offset-v-mobile, 0px))!important;right:calc(-1 * var(--right-spark-offset-h-mobile, 16px))!important;left:auto!important}}.mys-playground-body{display:flex;flex-direction:row;align-items:flex-end;gap:0;width:100%;box-sizing:border-box;justify-content:center}.mys-playground-tabs{display:flex;flex-direction:column;gap:9px;width:239px;flex-shrink:0;margin-bottom:23px;box-sizing:border-box}.mys-playground-tab-btn{display:flex;align-items:center;justify-content:flex-start;width:100%;border:none;background-color:transparent;background-image:var(--tab-bg-inactive-desktop, none);background-size:100% 100%;background-repeat:no-repeat;cursor:pointer;box-sizing:border-box;text-decoration:none;transition:transform .2s ease,filter .2s ease;padding-top:var(--tab-pt, 12px);padding-bottom:var(--tab-pb, 12px);padding-left:var(--tab-pl, 24px);padding-right:var(--tab-pr, 24px);margin-top:var(--tab-mt, 0px);margin-bottom:var(--tab-mb, 0px);color:var(--tab-color-inactive, #FFFFFF);font-family:var(--tab-font-family, var(--font-body-family));font-size:var(--tab-font-size, 16px);font-weight:var(--tab-font-weight, 500)}.mys-playground-tab-btn.active{background-image:var(--tab-bg-active-desktop, none);color:var(--tab-color-active, #FFFFFF)}.mys-playground-tab-btn-icon{width:fit-content;height:auto;max-width:79px;object-fit:contain;margin-right:7px;flex-shrink:0}.mys-playground-stage{position:relative;flex-grow:1;width:100%;background-image:var(--stage-bg-desktop, none);background-size:100% 100%;background-repeat:no-repeat;background-position:center;box-sizing:border-box;padding-top:var(--stage-pt-desktop, 40px);padding-bottom:var(--stage-pb-desktop, 40px);padding-left:var(--stage-pl-desktop, 40px);padding-right:var(--stage-pr-desktop, 40px);min-height:500px;aspect-ratio:1122 / 553;display:flex;flex-direction:column;justify-content:center;max-width:calc(100% - 239px)}.mys-playground-content-title{margin:0;position:absolute;top:var(--title-top-desktop, 5px);left:50%;transform:translate(-50%);z-index:999999;width:100%;color:var(--title-color, #000000)!important;font-size:var(--title-size-desktop, 28px)!important}@media only screen and (max-width:1024px){.mys-playground-content-title{top:var(--title-top-mobile, 5px);font-size:var(--title-size-mobile, 18px)!important}}.mys-playground-content:has([data-animation-state=running]) .mys-playground-content-title,.mys-playground-content:has([data-animation-state=ending]) .mys-playground-content-title,.mys-playground-content:has([data-animation-state=ended]) .mys-playground-content-title{display:none!important}.mys-playground-content{display:none;width:100%;height:100%;box-sizing:border-box}.mys-playground-content.active{display:flex!important;flex-direction:column;flex-grow:1;height:100%;animation:mysboxFadeIn .35s cubic-bezier(.25,.46,.45,.94) both}.mys-preview-game-host{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;flex-grow:1}@keyframes mysboxFadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@media screen and (max-width:749px){.mys-playground-body{flex-direction:column}.mys-playground-stage{order:1;background-image:var(--stage-bg-mobile, var(--stage-bg-desktop, none));padding-top:var(--stage-pt-mobile, 24px);padding-bottom:var(--stage-pb-mobile, 24px);padding-left:var(--stage-pl-mobile, 24px);padding-right:var(--stage-pr-mobile, 24px);min-height:100px;max-width:100%;aspect-ratio:380 / 264}.mys-playground-tabs{order:2;flex-direction:row;justify-content:center;width:100%;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:3px;padding-bottom:0;margin-top:-17px;margin-bottom:0}.mys-playground-tabs::-webkit-scrollbar{display:none}.mys-playground-tab-btn{width:fit-content;white-space:wrap;scroll-snap-align:center;flex-direction:column;background-image:var(--tab-bg-inactive-mobile, none);padding-top:var(--tab-pt-mobile, 10px);padding-bottom:var(--tab-pb-mobile, 10px);padding-left:var(--tab-pl-mobile, 20px);padding-right:var(--tab-pr-mobile, 20px);font-size:8px}.mys-playground-tab-btn span{width:min-content;min-width:39px}.mys-playground-tab-btn.active{background-image:var(--tab-bg-active-mobile, none)}.mys-playground-tab-btn-icon{max-width:35px;margin-right:0}}.mys-playground-content .mys-animation-block__main{height:100%!important;flex-grow:1!important;display:flex!important;flex-direction:column!important}.mys-playground-content .mys-animation__flipping{height:100%!important;flex-grow:1!important}.mys-playground-content .mys-animation__gacha-machine{height:100%!important;width:100%!important;flex-grow:1!important}.mys-playground-content .mys-animation__carousel,.mys-playground-content .mys-animation__drawing{height:100%!important;flex-grow:1!important}.mys-playground-content .mys-animation__flipping__card{--mys-animation-flipping-image-size: clamp(90px, 18vw, 180px)}@media screen and (max-width:749px){.mys-playground-content .mys-animation__flipping__card{--mys-animation-flipping-image-size: clamp(90px, 25vw, 150px)}}.mys-playground-content .mys-animation-confetti{position:absolute!important;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:10;pointer-events:none}.mys-playground-custom-html{position:relative;z-index:0}.mys-playground-content:not(.active){display:none}.mys-preview-game-host{--mys-animation-image-size: var(--winner-image-size-desktop, 180px) !important;--mys-animation-winner-title: var(--winner-title-size-desktop, 20px) !important;--mys-animation-winner-chance: var(--winner-chance-size-desktop, 17px) !important;--mys-animation-winner-heading: var(--winner-heading-size-desktop, 27px) !important}.mys-playground-content .mys-animation__flipping{--mys-animation-flipping-winner-title: var(--winner-title-size-desktop, 20px) !important;--mys-animation-flipping-winner-chance: var(--winner-chance-size-desktop, 17px) !important}.mys-playground-content .mys-animation__flipping__card{--mys-animation-flipping-image-size: var(--winner-image-size-desktop, 180px) !important}.mys-playground-content .mys-animation__winner__heading-text{color:var(--winner-heading-color, #ffffff)!important;font-size:var(--mys-animation-winner-heading)!important}.mys-playground-content .mys-animation__winner__card__title{color:var(--winner-title-color, #ffffff)!important;font-size:var(--mys-animation-winner-title)!important}.mys-playground-content .mys-animation__winner__card__chance{color:var(--winner-chance-color, #ffffff)!important;font-size:var(--mys-animation-winner-chance)!important}.mys-playground-content .mys-animation__flipping__card-title{color:var(--winner-title-color, #ffffff)!important;font-size:var(--mys-animation-flipping-winner-title)!important}.mys-playground-content .mys-animation__flipping__card-chance{color:var(--winner-chance-color, #ffffff)!important;font-size:var(--mys-animation-flipping-winner-chance)!important}@media only screen and (max-width:1024px){.mys-preview-game-host{--mys-animation-image-size: var(--winner-image-size-mobile, 120px) !important;--mys-animation-winner-title: var(--winner-title-size-mobile, 12px) !important;--mys-animation-winner-chance: var(--winner-chance-size-mobile, 12px) !important;--mys-animation-winner-heading: var(--winner-heading-size-mobile, 16px) !important}.mys-playground-content .mys-animation__flipping{--mys-animation-flipping-winner-title: var(--winner-title-size-mobile, 12px) !important;--mys-animation-flipping-winner-chance: var(--winner-chance-size-mobile, 12px) !important}.mys-playground-content .mys-animation__flipping__card{--mys-animation-flipping-image-size: var(--winner-image-size-mobile, 120px) !important}}.mys-playground-content .mys-animation__gacha-machine__machine-main{width:var(--gacha-machine-width-desktop, 200px)!important}@media only screen and (max-width:768px){.mys-playground-content .mys-animation__gacha-machine__machine-main{width:var(--gacha-machine-width-mobile, 120px)!important}}
/*# sourceMappingURL=/cdn/shop/t/7/assets/mys-interactive-playground.css.map */
