.no-beta #page-quest {
    display: none;
}

.step-quest .score-div, .step-quest #avatar-icon, .step-quest .hello {
    display: none;
}

.step-quest #page-quest {
    display: block;
    z-index: 9998;
    position: absolute;
    width: 1920px;
    height: 1080px;
    top: 0;
    left: 0;
}

.step-quest .orb {
    transition-delay: unset;
    transition-duration: unset;
    opacity: 0;
}

#page-quest > div, #tutorial-quest > div {
    position: absolute;
    width: 1920px;
    height: 1080px;
    top: 0;
    left: 0;
}

.page-quest-bg {
    position: absolute;
    top: 0;
    left: 0;
    background-size: contain;
    width: 1920px;
    height: 1080px;
    background-image: url("quest/level/EXPLORIA_Level_BACKGROUND.webp");
}

.page-quest-bg2 {
    position: absolute;
    top: 0;
    left: 0;
    background-size: contain;
    width: 1920px;
    height: 1080px;
    background-image: url("quest/level/EXPLORIA_Level_BOKEH01.webp");
}

.page-quest-bg3 {
    position: absolute;
    top: 0;
    left: 0;
    background-size: contain;
    width: 1920px;
    height: 1080px;
    background-image: url("quest/level/EXPLORIA_Level_BOKEH02.webp");
}

.step-quest .page-quest-bg2 {
    animation: spin 720s linear infinite;
}

.step-quest .page-quest-bg3 {
    animation: spin 180s linear infinite;
}

@keyframes spin {
    0%   { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.step-quest #page-quest .page-quest-level-selector {
    position: absolute;
    top: 0;
    width: 1920px;
    height: 1080px;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.game-iframe {
    display: none;
}

.page-quest-level {
    display: none;
}

.page-quest-level-selector > div {
    position: absolute;
    left: 372px;
    width: 600px;
    height: 735px;
    transform: translate(-50%, -50%);
    transition: top 1s cubic-bezier(0, 0, 0.2, 1);
}

.quest-level.init-level .page-quest-level-selector > div {
    top: 563px;
}


.page-quest-level-selector > div:nth-child(1) {
    top: 1080px;
}

.page-quest-level-selector > div:nth-child(2) {
    left: 764px;
    top: 1280px;
}

.page-quest-level-selector > div:nth-child(3) {
    left: 1157px;
    top: 1480px;
}

.page-quest-level-selector > div:nth-child(4) {
    left: 1548px;
    top: 1680px;
}

#quest-level-unlock-2 {
    position: absolute;
    left: 444px;
    top: 0px;
    width: 650px;
    height: 1080px;
    display: none;
    transform: unset;
    pointer-events: none;
}

#quest-level-unlock-3 {
    position: absolute;
    left: 838px;
    top: 0px;
    width: 650px;
    height: 1080px;
    display: none;
    transform: unset;
    pointer-events: none;
}

#quest-level-unlock-4 {
    position: absolute;
    left: 1228px;
    top: 0px;
    width: 650px;
    height: 1080px;
    display: none;
    transform: unset;
    pointer-events: none;
}

#quest-level-unlock-2 img, #quest-level-unlock-3 img, #quest-level-unlock-4 img {
    width: 650px;
    height: 1080px;
}

.game-icon, .key-icon {
    position: absolute;
    width: 350px;
    height: 350px;
    transform: translate(-50%, -50%);
}

.game-icon img, .key-icon img {
    width: 100%;
}

.game-on {
    display: none;
}

.game-1 {
    left: 618px;
    top: 358px;
}

.game-2 {
    left: 955px;
    top: 358px;
}

.game-3 {
    left: 1294px;
    top: 358px;
}

.game-4 {
    left: 462.5px;
    top: 682px;
}

.game-5 {
    left: 801px;
    top: 682px;
}

.game-6 {
    left: 1140px;
    top: 682px;
}

.key-icon {
    left: 1475px;
    top: 682px;
}

.game-iframe {
    display: none;
}

.game-iframe iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 1920px;
    height: 1080px;
    border: 0;
    overflow: hidden;
    z-index: 2;
}

#quest-landing {
    display: block;
    position: absolute;
    width: 1920px;
    height: 1080px;
}

#quest-level, #quest-games {
    display: none;
    position: absolute;
    width: 1920px;
    height: 1080px;
}

#quest-landing-in {
    position: absolute;
    top: 0;
    left: 0;
    width: 1920px;
    height: 1080px;
    z-index: 79;
}

#quest-landing-still {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 1920px;
    height: 1080px;
    z-index: 89;
}

#quest-landing-click {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 1920px;
    height: 1080px;
    z-index: 99;
}

.quest-level-animation {
    position: absolute;
    top: 50px;
    left: 50px;
    width: 500px;
    height: 635px;
}

.quest-level-click {
    top: 0;
    left: 0;
    width: 600px;
    height: 735px;
    z-index: 10;
}

.quest-level-unlock {
    width: 650px;
    height: 1080px;
    z-index: 10;
}

.page-quest-level-selector img {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.page-quest-level-selector img.active {
    display: block;
    z-index: 2;
}

.quest-level-animation {
    display: none;
}

.page-quest-level > div {
    position: absolute;
    width: 350px;
    width: 350px;
    transform: translate(-50%, -50%);
    top: 1080px;
}

.page-quest-level > div:nth-child(1) {
    left: 618px;
    transition: top 0.4s ease-out;
}

.page-quest-level > div:nth-child(2) {
    left: 955px;
    transition: top 0.6s ease-out;
}

.page-quest-level > div:nth-child(3) {
    left: 1294px;
    transition: top 0.8s ease-out;
}

.page-quest-level > div:nth-child(4) {
    left: 462px;
    transition: top 1s ease-out;
}

.page-quest-level > div:nth-child(5) {
    left: 800px;
    transition: top 1.1s ease-out;
}

.page-quest-level > div:nth-child(6) {
    left: 1140px;
    transition: top 1.2s ease-out;
}

.page-quest-level > div:nth-child(7) {
    left: 1474px;
    transition: top 1.3s ease-out;
}

.page-quest-level.active > div:nth-child(1) {
    top: 358px;
}

.page-quest-level.active > div:nth-child(2) {
    top: 358px;
}

.page-quest-level.active > div:nth-child(3) {
    top: 358px;
}

.page-quest-level.active > div:nth-child(4) {
    top: 682px;
    left: 462px;
}

.page-quest-level.active > div:nth-child(5) {
    top: 682px;
}

.page-quest-level.active > div:nth-child(6) {
    top: 682px;
}

.page-quest-level.active > div:nth-child(7) {
    top: 682px;
}

.quest-games-back {
    position: absolute;
    top: 100px;
    right: 100px;
    width: 68px;
    height: 68px;
}

.quest-games-back img {
    position: absolute;
    left: 35px;
    top: 35px;
    transform: translate(-50%, -50%) scale(-1);
}

.key-icon > div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
}

.key-icon > div > img {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    z-index: 1;
}

.key-icon > div > img.active {
    display: block;
    z-index: 2;
}

.glow-bounce::after {
    content: "";
    position: absolute;
    inset: 0; /* cover full div */
    background: white;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
    border-radius: 50%;
    width: 66%;
    height: 66%;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    z-index: 99;
}

.glow-bounce {
    transform-origin: center center; /* scale from center */
    animation: scaleBounce 0.7s ease-in-out;
}

.glow-bounce::after {
    animation: whiteFlash 0.7s ease-in-out;
}

@keyframes scaleBounce {
    0%   { transform: translate(-50%, -50%) scale(1); }
    40%  { transform: translate(-50%, -50%) scale(1.15); }
    60%  { transform: translate(-50%, -50%) scale(0.95); }
    100% { transform: translate(-50%, -50%) scale(1); }
}

@keyframes whiteFlash {
    0%   { opacity: 0; }
    40%  { opacity: 0.8; }  /* strong white overlay */
    60%  { opacity: 0.4; }
    100% { opacity: 0; }
}

.key-6 img {
    top: 50% !important;
    transform: translate(0, -50%);
}

#game-loader {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 50%;
    width: 300px;
    height: 300px;
    transform: translate(0, -50%);
    z-index: 1;
}

#game-loader img {
    display: none;
    z-index: 1;
    position: absolute;
    left: 0;
    top: 0;
    width: 300px;
    height: 300px;
}


#game-loader img.active {
    display: block;
    z-index: 1;
}

.quest-landing img {
    position: absolute;
    width: 1920px;
    height: 1080px;
    top: 0;
    left: 0;
    z-index: 1;
    display: none;
}

.quest-landing img.active {
    z-index: 2;
    display: block;
}

.close-loader {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: 200px;
    width: 70px;
    height: 70px;
    border-radius: 90px;
    backdrop-filter: blur(10px);
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(255, 255, 255, 0.05);
    z-index: 9999;
}

.game-loader.game-loader-helper {
    width: 1920px;
    height: 1080px;
    text-align: center;
}

.game-loader.game-loader-helper p {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: 300px;
    font-family: 'Barlow', serif;
    font-size: 40px;
    color: #fff;
    text-align: center;
}

.level-hit-map {
    position: absolute;
    display: block !important;
    width: 340px;
    height: 535px;
    transform: translate(-50%, -50%);
    left: 50%;
    top: 50%;
    padding: 0;
    z-index: 99;
}