@import"https://fonts.googleapis.com/css2?family=Manjari:wght@100;400;700&family=Righteous&display=swap";.home-container{display:flex;width:100%;min-height:100vh}.home-container .left-section{width:60%;padding:200px 60px 60px;box-sizing:border-box;justify-content:center;align-items:center;text-align:center}.home-container .left-section h1{font-family:Righteous,sans-serif;font-size:5rem;color:#000;padding:40px}.home-container .left-section p{font-family:Manjari,sans-serif;font-size:2.3rem;color:#333;line-height:1.6;margin-bottom:30px}.home-container .left-section .title{font-size:2.5rem;margin-bottom:20px}.home-container .left-section .description{font-size:1.2rem;line-height:1.5;margin-bottom:30px}.home-container .left-section .start-button{background-color:#f3c760!important;color:#000!important;font-family:Manjari,sans-serif!important;font-size:1.2rem;font-weight:700;padding:12px 24px;width:200px;border-radius:8px;text-transform:none;transition:background-color .3s ease}.home-container .left-section .start-button:hover{background-color:#e3b750!important}.home-container .right-section{width:40%;display:flex;align-items:center;justify-content:center}.home-container .right-section .jar-area{position:relative;width:500px;height:800px;overflow:hidden}.home-container .right-section .jar-area .jar{position:absolute;bottom:0;left:50%;transform:translate(-50%);width:400px}.home-container .right-section .jar-area .cookie{position:absolute;top:-80px;animation:fallCookie 2s linear forwards;border:none!important}.home-container .right-section .jar-area .cookie img{width:100px;height:100px}@keyframes fallCookie{0%{top:-80px}to{top:var(--landingY)}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Righteous,sans-serif;font-size:16px;line-height:1.5;color:#333;background-color:#f9f9f9}h1,h2,h3,h4,h5,h6{font-family:Manjari,sans-serif;line-height:1.2}h1{font-size:32px}p{font-size:16px;line-height:1.5}small{font-size:14px}button{font-size:18px;font-weight:700;font-family:Righteous,sans-serif}.cookie-grid{display:grid;grid-template-columns:repeat(3,1fr);padding:20px;height:100vh;width:100%;box-sizing:border-box;overflow-y:auto;align-items:center;justify-items:center}@media(max-width:768px){.cookie-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.cookie-grid{grid-template-columns:repeat(1,1fr)}}.cookie{text-align:center;width:30vw;max-width:80%;height:30vh;max-height:50%;display:flex;font-family:Manjari,sans-serif;flex-direction:column;justify-content:space-between;align-items:center;border:1px solid #ccc;padding:10px;box-sizing:border-box}.cookie img{width:15vw;height:15vw;max-width:20vh;max-height:20vh;object-fit:contain}.cookie p{font-size:2vw;color:#333;margin:0}@media(max-width:768px){.cookie{width:50vw;height:40vh}.cookie img{width:25vw;height:25vw}.cookie p{font-size:3vw}}@media(max-width:480px){.cookie{width:80vw;height:50vh}.cookie img{width:30vw;height:30vw}.cookie p{font-size:4vw}}.cookie-card{text-align:center;width:30vw;max-width:80%;display:flex;font-family:Manjari,sans-serif;flex-direction:column;align-items:center;padding:10px;box-sizing:border-box;cursor:pointer;transition:transform .2s ease}.cookie-card:hover{transform:scale(1.05)}.cookie-card .cookie-image{width:15vw;height:15vw;max-width:20vh;max-height:20vh;object-fit:contain}.cookie-card h3{font-size:1.2rem;color:#333;margin:10px 0}.cookie-card .buy-button{background:#f3c760;color:#000;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;font-family:Manjari,sans-serif;margin-top:10px;transition:background-color .2s ease}.cookie-card .buy-button:hover{background:#e6b54a}@media(max-width:768px){.cookie-card{width:40vw}.cookie-card .cookie-image{width:20vw;height:20vw}.cookie-card h3{font-size:1rem}}@media(max-width:480px){.cookie-card{width:70vw}.cookie-card .cookie-image{width:30vw;height:30vw}.cookie-card h3{font-size:.9rem}}.buy-confirm-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:1000}.buy-confirm-popup{background:#fff9ec;border:3px solid #F3C760;border-radius:12px;padding:2rem;max-width:400px;width:90%;text-align:center;box-shadow:0 10px 30px #0000004d}.buy-confirm-popup h3{font-family:Manjari,sans-serif;font-size:1.5rem;color:#333;margin-bottom:1rem}.buy-confirm-popup p{font-family:Manjari,sans-serif;font-size:1rem;color:#666;margin-bottom:1.5rem;line-height:1.5}.buy-confirm-popup .confirm-buttons{display:flex;gap:1rem;justify-content:center}.buy-confirm-popup .confirm-buttons button{padding:.75rem 1.5rem;border:none;border-radius:6px;font-family:Manjari,sans-serif;font-size:1rem;cursor:pointer;transition:all .2s ease}.buy-confirm-popup .confirm-buttons button:disabled{opacity:.6;cursor:not-allowed}.buy-confirm-popup .confirm-buttons .confirm-yes{background:#27ae60;color:#fff}.buy-confirm-popup .confirm-buttons .confirm-yes:hover{background:#229954}.buy-confirm-popup .confirm-buttons .confirm-no{background:#e74c3c;color:#fff}.buy-confirm-popup .confirm-buttons .confirm-no:hover{background:#c0392b}.purchased-cookie-card{background:#fff9ec;border:3px solid #F3C760;border-radius:12px;padding:1rem;text-align:center;transition:transform .2s ease}.purchased-cookie-card:hover{transform:translateY(-2px)}.purchased-cookie-card h4{font-family:Manjari,sans-serif;font-size:1.1rem;color:#333;margin-bottom:.5rem}.purchased-cookie-card .cookie-type{font-family:Manjari,sans-serif;font-size:.9rem;color:#666;margin-bottom:.3rem;font-style:italic}.purchased-cookie-card .cookie-price{font-family:Manjari,sans-serif;font-size:1rem;color:#27ae60;font-weight:700;margin-bottom:.3rem}.purchased-cookie-card .purchase-date{font-family:Manjari,sans-serif;font-size:.8rem;color:#999;margin:0}.purchased-cookies-container{margin-top:2rem}.purchased-cookies-container h3{font-family:Manjari,sans-serif;font-size:1.5rem;color:#333;margin-bottom:1rem;text-align:center}.purchased-cookies-container .purchased-cookies-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem;max-height:300px;overflow-y:auto;padding:.5rem}.purchased-cookies-container .purchased-cookies-grid::-webkit-scrollbar{width:8px}.purchased-cookies-container .purchased-cookies-grid::-webkit-scrollbar-track{background:#0000001a;border-radius:10px}.purchased-cookies-container .purchased-cookies-grid::-webkit-scrollbar-thumb{background:#f3c76080;border-radius:10px}.purchased-cookies-container .purchased-cookies-grid::-webkit-scrollbar-thumb:hover{background:#f3c760b3}.purchased-cookies-container .no-cookies{text-align:center;color:#666;font-family:Manjari,sans-serif;font-style:italic;padding:2rem}.cookie-popup{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background-color:brown;border-radius:10px;width:300px;max-height:400px;display:flex;flex-direction:column;box-shadow:0 4px 8px #0003;overflow:hidden}.cookie-popup .popup-content{display:flex;flex-direction:column;height:100%}.cookie-popup .popup-content h2{margin:20px 0;color:#fff;text-align:center}.cookie-popup .popup-description{padding:0 20px;overflow-y:auto;flex-grow:1}.cookie-popup .popup-description p{color:#fff}.cookie-popup .close-btn{background-color:#ff7043;color:#fff;border:none;padding:10px;width:100%;cursor:pointer;text-align:center;font-size:16px;position:relative;bottom:0}.cookie-popup .close-btn:hover{background-color:#ff5722}.cookie-expanded-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .3s ease}.cookie-expanded-view{width:85vmin;height:85vmin;border-radius:50%;box-shadow:0 15px 50px #0006;display:flex;flex-direction:column;overflow:hidden;animation:flipIn .6s ease;transform-style:preserve-3d;position:relative}.cookie-expanded-header{display:flex;justify-content:flex-end;padding:20px;position:relative;z-index:10}.close-button{background:#ffffff4d;border:none;color:#fff;font-size:36px;width:50px;height:50px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;font-weight:300;line-height:1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.close-button:hover{background:#ffffff80;transform:rotate(90deg)}.cookie-expanded-content{display:flex;flex:1;align-items:center;justify-content:center;padding:60px}@media(max-width:768px){.cookie-expanded-content{padding:40px}}.cookie-info-box{background:transparent;border-radius:0;padding:40px;width:100%;height:100%;display:flex;flex-direction:column;max-height:100%}@media(max-width:768px){.cookie-info-box{padding:30px}}.cookie-title{font-family:Manjari,sans-serif;font-size:2.5rem;margin:0 0 10px;color:#1a1a1a;text-align:center;font-weight:700;text-shadow:2px 2px 4px rgba(255,255,255,.5)}@media(max-width:768px){.cookie-title{font-size:2rem}}.cookie-type{font-family:Manjari,sans-serif;font-size:1.2rem;color:#2a2a2a;margin:0 0 20px;text-align:center;font-style:italic;text-transform:capitalize;text-shadow:1px 1px 3px rgba(255,255,255,.4)}.cookie-description-box{flex:1;overflow-y:auto;padding-right:10px}.cookie-description-box::-webkit-scrollbar{width:8px}.cookie-description-box::-webkit-scrollbar-track{background:#0000001a;border-radius:10px}.cookie-description-box::-webkit-scrollbar-thumb{background:#0000004d;border-radius:10px;transition:background .3s ease}.cookie-description-box::-webkit-scrollbar-thumb:hover{background:#00000080}.cookie-description{font-family:Manjari,sans-serif;font-size:1.1rem;line-height:1.8;color:#2a2a2a;margin:0;text-align:justify;text-shadow:1px 1px 2px rgba(255,255,255,.3)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes flipIn{0%{transform:perspective(1000px) rotateY(-90deg);opacity:0}to{transform:perspective(1000px) rotateY(0);opacity:1}}.footer{background-color:#ffc107;position:fixed;bottom:0;left:0;width:100%;display:flex;justify-content:center;align-items:center;padding:1px 0;font-family:Inter,sans-serif;font-weight:600;color:#1e1e1e;z-index:1000;box-shadow:0 -2px 5px #0000000d}.footer-content{text-align:center}.footer-icon{vertical-align:middle;height:1em}.footer-logo{vertical-align:middle;height:1.5em;margin:0 4px}.footer-link{text-decoration:none;color:#1e1e1e;transition:opacity .2s ease-in-out}.footer-link:hover{opacity:.8}.login{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:40px 50px;border-radius:8px;width:400px;box-shadow:0 0 15px #00000026;box-sizing:border-box;position:absolute;top:45%;left:50%;transform:translate(-50%,-50%)}.login h1{margin-top:0;margin-bottom:0;text-align:center}.login input[type=email],.login input[type=password]{width:100%;padding:10px 12px;margin-bottom:20px;border:1px solid #ccc;border-radius:5px;box-sizing:border-box;font-size:15px}.login-button{background-color:#ffc00a!important;color:#000!important;font-family:Manjari,sans-serif!important;font-size:1.1rem!important;font-weight:700;padding:12px 24px;width:200px;border-radius:8px;text-transform:none;transition:background-color .3s ease;position:absolute;left:50%;transform:translate(-50%,9%)}.login-button:hover{background-color:#e3b750!important}.login a{text-decoration:none}.login a:hover{text-decoration:underline}.signup{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:40px 50px;border-radius:8px;width:400px;box-shadow:0 0 15px #00000026;box-sizing:border-box;position:absolute;top:45%;left:50%;transform:translate(-50%,-50%)}.signup h1{margin-top:0;margin-bottom:0;text-align:center}.signup input[type=text],.signup input[type=email],.signup input[type=password]{width:100%;padding:10px 12px;margin-bottom:20px;border:1px solid #ccc;border-radius:5px;box-sizing:border-box;font-size:15px}.signup-button{background-color:#ffc00a!important;color:#000!important;font-family:Manjari,sans-serif!important;font-size:1.1rem!important;font-weight:700;padding:12px 24px;width:200px;border-radius:8px;text-transform:none;transition:background-color .3s ease;position:absolute;left:50%;transform:translate(-50%,15%)}.signup-button:hover{background-color:#e3b750!important}.profile-container{max-width:800px;margin:0 auto;margin-top:3rem;padding:2rem;font-family:Arial,sans-serif;border:10px solid #F3C760;border-radius:50px;background-color:#fff9ec}.profile-container .loading,.profile-container .error{text-align:center;padding:2rem;font-size:1.2rem;color:#666}.profile-container .error{color:#e74c3c}.profile-container .profile-header{text-align:center;margin-bottom:2rem;display:flex;justify-content:space-between;align-items:center}.profile-container .profile-header h1{color:#2c3e50;font-size:2.5rem;margin-bottom:.5rem}.profile-container .profile-header .refresh-button{background:#f3c760;color:#000;border:none;padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-size:.9rem;transition:background-color .2s ease}.profile-container .profile-header .refresh-button:hover{background:#e6b54a}.profile-container .profile-content{padding:2rem}.profile-container .profile-info{display:flex;align-items:center;gap:2rem;margin-bottom:2rem}.profile-container .profile-info .avatar{width:100px;height:100px;border-radius:50%;overflow:hidden;border:3px solid #F3C760}.profile-container .profile-info .avatar img{width:100%;height:100%;object-fit:cover}.profile-container .profile-info .avatar .default-avatar{width:100%;height:100%;background:linear-gradient(135deg,#3498db,#2980b9);display:flex;align-items:center;justify-content:center;font-size:2.5rem;color:#fff;font-weight:700}.profile-container .profile-info .user-details{flex:1}.profile-container .profile-info .user-details h2{color:#2c3e50;font-size:1.8rem;margin-bottom:.5rem}.profile-container .profile-info .user-details .email{color:#7f8c8d;font-size:1rem;margin-bottom:.3rem}.profile-container .profile-info .user-details .stage{color:#27ae60;font-weight:700;font-size:1.1rem}.profile-container .stats-container{display:grid;gap:2rem}.profile-container .stats-container .stat-card{background:#fff9ec;color:#000;padding:2rem;border-radius:12px;text-align:center;border:3px solid #F3C760}.profile-container .stats-container .stat-card h3{font-size:1.2rem;margin-bottom:1rem;opacity:.9}.profile-container .stats-container .stat-card .points-display{font-size:3rem;font-weight:700;font-family:Manjari,sans-serif;text-shadow:2px 2px 4px rgba(0,0,0,.2)}@media(max-width:768px){.profile-container{padding:1rem}.profile-container .profile-header{flex-direction:column;gap:1rem;text-align:center}.profile-container .profile-header h1{font-size:2rem;margin-bottom:0}.profile-container .profile-info{flex-direction:column;text-align:center;gap:1rem}.profile-container .stat-card .points-display{font-size:2.5rem}}.stage1-container{padding:114px 60px;font-family:Manjari,sans-serif;font-weight:700}.stage1-container h1{font-size:64px}.stage1-container p{font-size:40px}.stage1-container .cookie-select-container{margin-top:60px}.stage1-container .cookie-container{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-top:10px}.stage1-container .cookie-container:hover{cursor:pointer}.stage1-container .cookie-container div{transition:transform .5s ease}.stage1-container .cookie-container div:hover{transform:translateY(-8px)}.stage1-container .cookie-container a{color:#000;text-decoration:none}.stage1-container img{width:282px}.stage1-container .cookie-select{display:flex;flex-direction:column;align-self:center;justify-content:center;align-items:center;gap:20px}.stage1-container .cookie-select:hover{cursor:pointer}.stage1-container .next-button{position:fixed;bottom:50px;right:30px;background-color:#ffc107;color:#000;border-radius:50%;width:50px;height:50px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 10px #0006}.stage1-container .next-button:hover{background:#e3b750;color:#000;transform:translate(4px) scale(1.05)}.stage1-container .next-button svg{stroke-width:3}.stage2-container{padding:50px 60px 150px;font-family:Manjari,sans-serif;font-weight:700}.stage2-container h1{font-size:64px}.stage2-container p{font-size:24px}.stage2-container .stage2-graphics-container{width:100%;margin-top:20px;display:grid;grid-template-columns:2fr 2fr}.stage2-container .stage2-graphics-container .ingredients-container{display:grid;grid-template-columns:1fr 1fr 0fr;gap:40px 0px;position:relative}.stage2-container .stage2-graphics-container .ingredients-container .ingredient-card,.stage2-container .stage2-graphics-container .ingredients-container .ingredient-card-hidden{position:relative;width:190px;height:250px;background-color:#f3c760;display:flex;flex-direction:column;text-align:center;justify-content:center;border-radius:16px;transition:transform .5s ease}.stage2-container .stage2-graphics-container .ingredients-container .ingredient-card:hover{cursor:pointer;transform:translateY(-8px)}.stage2-container .stage2-graphics-container .ingredients-container .ingredient-card-hidden{background-color:#f3c76040}.stage2-container .stage2-graphics-container .ingredients-container .ingredient-card img{width:121px;align-self:center}.stage2-container .stage2-graphics-container .ingredients-container .ingredient-card p{position:absolute;bottom:10px;align-self:center}.stage2-container .stage2-graphics-container .ingredients-container .ingredient-card-selected{position:absolute;width:360px;height:480px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;background-color:#f3c760;border-radius:16px;transition:transform .5s ease;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:4px 4px 4px #00000080;padding:58px 40px 35px}.stage2-container .stage2-graphics-container .ingredients-container .ingredient-card-selected p{line-height:1.25}.stage2-container .stage2-graphics-container .ingredients-container .ingredient-card-selected button{width:92%;height:20%;border-radius:12px;background-color:#764d2f;border:0px;color:#fff;font-weight:400;font-family:Manjari,sans-serif;font-weight:700;display:flex;justify-content:center;align-items:center}.stage2-container .stage2-graphics-container .ingredients-container .ingredient-card-selected button p{font-size:38px;align-self:center;padding-top:6%}.stage2-container .stage2-graphics-container .ingredients-container .ingredient-card-selected button:hover{cursor:pointer}.stage2-container .stage2-graphics-container .ingredients-container .ingredient-card-used{opacity:50%}.stage2-container .stage2-graphics-container .ingredients-container .ingredient-card-used:hover{cursor:default;transform:none}.stage2-container .stage2-graphics-container .bowl-container{margin:auto;position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:20px}.stage2-container .stage2-graphics-container .bowl-container .eggs-icon{position:absolute;left:40%;top:0%}.stage2-container .stage2-graphics-container .bowl-container .sugar-icon{position:absolute;left:8%;top:15%;z-index:-5}.stage2-container .next-button{position:fixed;bottom:50px;right:30px;background-color:#ffc107;color:#000;border-radius:50%;width:50px;height:50px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 10px #0006}.stage2-container .next-button:hover{background:#e3b750;color:#000;transform:translate(4px) scale(1.05)}.stage2-container .next-button svg{stroke-width:3}.stage2-container .back-button{position:fixed;bottom:50px;left:30px;background-color:#ffc107;color:#000;border-radius:50%;width:50px;height:50px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 10px #0006}.stage2-container .back-button:hover{background:#e3b750;color:#000;transform:translate(4px) scale(1.05)}.stage2-container .back-button svg{stroke-width:3}.img-radio-button{font-family:Manjari,sans-serif;font-size:1rem;font-weight:700;color:#000;cursor:pointer}.img-radio-button:hover>div:after{transform:scale(1)}.img-radio-button>input{display:none}.img-radio-button>input:checked~div:after{transform:scale(1)}.img-radio-button>div{position:relative;display:block;text-align:center}.img-radio-button>div:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:3px;background-color:#f3c760;opacity:1;transform:scale(0);transform-origin:center;transition:transform .3s}.stage3-container{padding:114px 60px;font-family:Manjari,sans-serif;font-weight:700}.stage3-container h1{font-size:64px}.stage3-container h2{font-size:32px}.stage3-container p{font-size:24px}.stage3-container .back-button{position:fixed;bottom:50px;left:30px;background-color:#ffc107;color:#000;border-radius:50%;width:50px;height:50px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 10px #0006}.stage3-container .back-button:hover{background:#e3b750;color:#000;transform:translate(4px) scale(1.05)}.stage3-container .back-button svg{stroke-width:3}.stage3-container .next-button{position:fixed;bottom:50px;right:30px;background-color:#ffc107;color:#000;border-radius:50%;width:50px;height:50px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 10px #0006}.stage3-container .next-button:hover{background:#e3b750;color:#000;transform:translate(4px) scale(1.05)}.stage3-container .next-button svg{stroke-width:3}.content-container{margin:16px}.timer{width:90px;padding:10px 0 5px;background-color:#293e44;border-radius:10px;font-family:Manjari,sans-serif;font-size:1.4rem;font-weight:700;color:#fff;text-align:center;margin-bottom:20px}.cookie-toppings-container{display:flex;flex-wrap:wrap;justify-content:space-evenly;width:500px}.cookie-topping-display{padding:20px 30px;border:4px solid #F3C760;border-radius:15px;background-color:#fffaed}.done-button-container{display:flex;justify-content:flex-end;padding-top:60px}.done-button{padding:10px 15px 5px;border:0;border-radius:6px;background-color:#f3c760;font-family:Manjari,sans-serif;font-size:1.4rem;font-weight:700;color:#000;cursor:pointer}.stage7-container{padding:50px 60px 150px;font-family:Manjari,sans-serif;font-weight:700}.stage7-container h1{font-size:64px}.stage7-container h2{font-size:44px}.stage7-container p{font-size:24px}.stage7-container button{background-color:#ffc00a!important;color:#000!important;font-family:Manjari,sans-serif!important;font-size:1.1rem!important;font-weight:700;padding:12px 24px;width:200px;border-radius:8px;text-transform:none;transition:background-color .3s ease;border:none}.stage7-container button:hover{background-color:#e3b750!important;cursor:pointer}.stage7-container .back-button{position:fixed;bottom:50px;left:30px;background-color:#ffc107;color:#000;border-radius:50%;width:50px;height:50px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 10px #0006}.stage7-container .back-button:hover{background:#e3b750;color:#000;transform:translate(4px) scale(1.05)}.stage7-container .back-button svg{stroke-width:3}.stage7-container .next-button{position:fixed;bottom:50px;right:30px;background-color:#ffc107;color:#000;border-radius:50%;width:50px;height:50px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 10px #0006}.stage7-container .next-button:hover{background:#e3b750;color:#000;transform:translate(4px) scale(1.05)}.stage7-container .next-button svg{stroke-width:3}.stage7-container{container-type:size;min-height:100vh}.stage7-container .game-container{width:min(75vh,100vw);height:min(75vh,100vw);max-width:600px;max-height:600px}.game-container{position:relative;margin:0 auto;border:2px solid #ffc107;border-radius:8px}.instructions{max-width:600px;margin:0 auto;padding:20px;text-align:center}.instructions p{font-size:16px;line-height:1.5;margin-bottom:20px}.game{width:100%;height:100%;background-image:url(../../assets/stage5Background.svg);background-size:cover;background-position:center;background-repeat:no-repeat;position:relative;overflow:hidden}.zombie{position:absolute;transform:translate(-50%,50%);background-size:contain;background-repeat:no-repeat}.zombie.alive{width:36px;height:36px;cursor:pointer;background-image:url(../../assets/zombieCookie.svg)}.zombie.tombstone{width:48px;height:48px;cursor:not-allowed;background-image:url(../../assets/tombstone.svg)}.player{position:absolute;width:48px;height:48px;border-radius:50%;background-color:brown;transform:translate(-50%,50%)}.healthbar{position:absolute;left:0;bottom:0;padding:6px}.heart{width:36px;height:36px;background-image:url(../../assets/redHeart.svg);background-size:contain;background-repeat:no-repeat;display:inline-block;margin:3px}.score{position:absolute;right:0;bottom:0;padding:6px;font-size:24px;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.8)}.game-stage-4-container{display:flex;flex-direction:column;text-align:center;padding:15px 20px}.game-stage-4-container .title{font-size:36px}.game-stage-4-container .bandit{position:absolute;top:150px;right:150px;z-index:100;width:100px;animation:shake .5s}.game-stage-4-container .instructions-button{position:absolute;top:100px;right:20px;padding:10px 15px;font-size:14px;cursor:pointer;border:none;background-color:#007bff;color:#fff;border-radius:8px}.game-stage-4-container .instructions-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:1000}.game-stage-4-container .instructions-popup{background-color:#fff;padding:30px;border-radius:12px;max-width:400px;text-align:left;box-shadow:0 4px 8px #0000004d}.game-stage-4-container .instructions-popup h2{margin-top:0}.game-stage-4-container .instructions-popup button{margin-top:20px;padding:8px 16px;cursor:pointer;border:none;background-color:#4caf50;color:#fff;border-radius:8px}.game-stage-4-container .instructions-popup button:hover{background-color:#45a049}.game-stage-4-container .game-layout{display:flex;flex-direction:row;justify-content:center;align-items:flex-start;gap:60px;width:100%}.game-stage-4-container .conveyors{display:flex;flex-direction:column;gap:20px}.game-stage-4-container .belt{width:700px;height:80px;border-radius:10px;display:flex;justify-content:center;align-items:center;color:#fff;font-weight:700}.game-stage-4-container .belt.HTTP{background-color:#d9534f}.game-stage-4-container .belt.HTTPS{background-color:#5cb85c}.game-stage-4-container .basket{display:flex;flex-wrap:wrap;width:250px;min-height:200px;gap:10px;border:2px dashed #ccc;border-radius:12px;padding:10px;background:#fffdf5}.game-stage-4-container .basket .cookie{width:60px;height:60px}.game-stage-4-container .basket .cookie img{width:100%;height:100%;object-fit:contain}.instructionScreen{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:700px;height:400px;padding:20px;text-align:center;background:#b5b4b4}.instructionScreen .start-button{position:absolute;bottom:15%;left:50%;transform:translate(-50%,-50%)}.instructionScreen p{margin-bottom:12px;font-size:1.05rem}.game-Container{position:relative;width:100vw;height:90vh;background:gray;display:flex;align-items:center;justify-content:center}.gameArea{position:relative;width:85vw;height:80vh;background:#fff;overflow:hidden;border:12px solid #333;border-radius:20px;box-sizing:border-box}.gameArea .score{position:absolute;top:8px;left:8px}.gameArea .instructions{position:absolute;top:8px;left:120px;font-weight:600}.gameArea .pause-button{position:absolute;top:16px;right:20px;padding:6px 10px;border-radius:8px;border:none;background-color:#f90101;font-weight:700;cursor:pointer;transition:transform .1s ease}.gameArea .pause-button:hover{transform:scale(1.02)}.gameArea .basket{position:absolute;bottom:16px;height:100px;background:#a49b98;border-radius:8px;transition:left .1s ease;display:flex;align-items:center;justify-content:center}.gameArea .basket1{box-shadow:0 0 10px red}.gameArea .basket3{box-shadow:0 0 10px green}.gameArea .basket p{color:#fff;font-size:24px}.gameArea .cookie{position:absolute;width:30px;height:30px;background-image:url(/assets/c8.png);background-size:cover;background-position:center;border-radius:50%;overflow:hidden}.gameArea .game-over-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#000000b3;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px;color:#fff;font-size:2rem;z-index:1000}.gameArea .cookie-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:400px;min-height:200px;height:auto;background:#ffffffd9;color:#000;padding:20px;border-radius:8px;z-index:1000;text-align:left;border:8px solid grey}.game-stage-cards-container{display:flex;flex-wrap:wrap;justify-content:space-evenly;padding:100px;row-gap:2.2rem}.game-stage-card{width:350px;height:350px;padding:50px;border:10px solid #F3C760;border-radius:50px;background-color:#fff9ec;color:#000;transition:background-color .3s ease}.game-stage-card:hover{background-color:#f3c760;color:#fff}.game-stage-card-title{text-align:center;font-family:Manjari,sans-serif;font-size:1.4rem;font-weight:700;margin-bottom:10px}.game-stage-card-desc{text-align:center;font-family:Manjari,sans-serif;font-size:1rem;font-weight:500}.game-stage6-container{padding:50px 60px 75px;font-family:Manjari,sans-serif;font-weight:700;height:100%}.game-stage6-container h1{font-size:64px}.game-stage6-container p{font-size:24px}.game-stage6-container .start-button{width:220px;height:85px;background-color:#f3c760;padding-top:8px;margin-top:40px;transition:transform .5s ease}.game-stage6-container .start-button:hover{cursor:pointer;transform:translateY(-8px)}.game-stage6-container .customer-container{position:absolute;bottom:20px;right:5%;width:fit-content;text-align:right}.game-mode-background{position:fixed;background-color:#d9d9d9;left:0;top:0;width:100%;height:100%;z-index:-10000}.game-mode-container{position:relative;background-color:#fff;border:3px solid black;height:100%;border-radius:16px;padding:36px}.game-mode-container .cookie-container{border:3px solid #ff9ab2;border-radius:16px;padding:20px;width:fit-content;display:grid;grid-template-columns:repeat(3,1fr);column-gap:90px;row-gap:18px}.game-mode-container .cookie-container img{width:120px}.game-mode-container .player-score{font-size:36px;position:absolute;top:28px;right:50px}.game-mode-container .customer-container-game{position:absolute;bottom:10px;right:5%;width:fit-content;text-align:right;height:95%}.game-mode-container .customer-container-game img{position:relative}.game-mode-container .customer-container-game .chat-bubble-container{height:30%}.game-mode-container .customer-container-game .chat-bubble-container img{position:relative;left:-150px}.game-mode-container .customer-container-game .chat-bubble-container .chat-bubble-text{font-size:32px;position:absolute;top:10%;width:60%;text-align:center}.game-mode-container .stage-complete-container{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.game-mode-container .stage-complete-container p{font-size:36px}.game-mode-container .stage-complete-container button{padding:15px 50px 10px;background-color:#f3c760;margin-top:40px;transition:transform .5s ease}.game-mode-container .stage-complete-container button:hover{cursor:pointer;transform:translateY(-8px)}button{font-family:Manjari,sans-serif;font-weight:700;font-size:32px;border:none;border-radius:10px}.cookie-wrapper{position:relative;display:inline-block;cursor:grab;transition:transform .5s ease}.cookie-wrapper:hover{transform:translateY(-8px)}.cookie-image{display:block;width:100%}.cookie-label{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-weight:700;font-size:20px;pointer-events:none;text-shadow:0 2px 6px rgba(0,0,0,.8)}