@import"https://fonts.googleapis.com/css2?family=Rubik+Mono+One&display=swap";@import"https://fonts.googleapis.com/css2?family=Chakra+Petch:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap";:root{--black: #000;--white: #fff;--black-08: rgba(0, 0, 0, .5)}@font-face{font-family:PaintPeel;src:url(./PaintPeel-CwbPixYC.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}*{padding:0;margin:0;border:0}*,*:before,*:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}:focus,:active{outline:none}a:focus,a:active{outline:none}nav,footer,header,aside{display:block}input,button,textarea{background:transparent;font-family:inherit}input::-ms-clear{display:none}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none}input[type=number],input[type=number]:hover,input[type=number]:focus{-webkit-appearance:none;appearance:none;-moz-appearance:textfield}button{cursor:pointer;transition:all .2s;line-height:1}button::-moz-focus-inner{padding:0;border:0}a,a:visited{transition:all .2s;text-decoration:none}a:hover{text-decoration:none}ul li{list-style:none}img{display:block}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}html,body{font-family:Chakra Petch,sans-serif;background:var(--black);color:var(--white);height:100%;width:100%;font-size:100%;position:relative;line-height:1;font-size:14px;font-weight:var(--400);-ms-text-size-adjust:100%;-moz-text-size-adjust:100%;-webkit-text-size-adjust:100%}.menu-game__bottom-list,.game__btn-list,.start,.scenes,.game,.wrapper,.ui,.menu-game__list,.menu-game__container,.start__body,.scenes__item-btn,.scenes__list,.btn{display:flex}.menu-game__list,.menu-game__container,.start__body,.scenes__item-btn,.scenes__list,.btn{justify-content:center}.menu-game__list,.menu-game__container,.start__body,.scenes__item-btn,.scenes__list,.btn{align-items:center}.menu-game__list,.menu-game__container,.start__body,.start,.scenes,.game,.wrapper,.ui{flex-direction:column}.menu-game__list,.start__body,.scenes__list,.start,.scenes,.game{flex:1 1 auto}.menu-game__play-btn.btn,.menu,.modal__close,.modal__container,.menu-game,.start,.scenes,.game,.modal,#game-root,#root,.preload,.menu__option-btn.btn,.scenes__item-btn-text{position:absolute}.menu-game__container{position:relative}.preload,.menu__option-btn.btn,.scenes__item-btn-text{top:50%;left:50%;transform:translate(-50%,-50%)}.menu-game,.start,.scenes,.game,.modal,#game-root,#root{top:0;left:0;width:100%;height:100%}.wrapper,.ui{position:relative}.wrapper{height:100dvh;-webkit-user-select:none;user-select:none;overflow:hidden}#game-root,#root{overflow:hidden;z-index:1}#game-root canvas,#root canvas{margin:0!important}#root{z-index:2;pointer-events:none}.btn{width:80px;height:80px;position:relative}.btn span{position:relative;z-index:2}.btn:after,.btn:before{content:"";display:block;position:absolute}.btn:after{top:0;left:0;width:100%;height:100%;transition:all .3s;border-radius:20px}.btn:before{border-radius:25px;top:50%;left:50%;width:115%;height:115%;transform:translate(-50%,-50%) rotate(0)}.btn:hover:after{transform:scale(1.1)}.btn img{width:40px;height:40px;position:relative;z-index:1}.btn_option{width:60px;height:60px}.btn_option img{width:30px;height:30px}.btn_purple:before{background:#7a04da4d}.btn_purple:after{background:#7a04da}.btn_green:before{background:#04da324d}.btn_green:after{background:#04da0f}.btn_dark-purple:before{background:#9041be4d}.btn_dark-purple:after{background:#39068b}.btn_xl{width:200px;height:200px}.btn_xl:before{width:105%;height:105%;border-radius:50px;animation:rotate 2s linear infinite}.btn_xl:after{border-radius:40px}.btn_xl img{width:80px;height:80px}.btn_md{width:60px;height:60px}.btn_md img{width:30px;height:30px}.btn_sound img:first-child{display:block}.btn_sound img:last-child{display:none}.btn_sound.active img:first-child{display:none}.btn_sound.active img:last-child{display:block}@media (max-width: 1023px){.btn{width:70px;height:70px}.btn_md{width:60px;height:60px}.btn_md img{width:30px;height:30px}.btn_xl{width:150px;height:150px}.btn_xl:before{width:105%;height:105%;border-radius:50px;animation:rotate 2s linear infinite}.btn_xl:after{border-radius:40px}.btn_xl img{width:80px;height:80px}}@media (max-width: 575px){.btn{width:60px;height:60px}.btn:before{border-radius:15px;width:110%;height:110%}.btn:after{border-radius:12px}.btn_md{width:50px;height:50px}.btn_md img{width:25px;height:25px}.btn_md:before{display:none}.btn_md:after{border-radius:10px}.btn_xl{width:120px;height:120px}.btn_xl img{width:40px;height:40px}.btn_xl:before{width:110%;height:110%;border-radius:40px}.btn_xl:after{border-radius:20px}}@keyframes rotate{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(180deg)}}@keyframes pulse{0%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.05)}to{transform:translate(-50%,-50%) scale(1)}}.modal{background:transparent;z-index:10;opacity:0;visibility:hidden;pointer-events:none;transition:all .3s;font-family:Chakra Petch,sans-serif}.modal.active{opacity:1;visibility:visible;pointer-events:all}.modal.active .modal__container{transform:scale(1) translate(-50%,-50%)}.modal__container{top:50%;left:50%;background:#421e42;width:calc(100% - 20px);max-width:500px;min-height:300px;border-radius:15px;transform:scale(0) translate(-100%);transition:all .3s}.modal__close{top:0;right:0;display:block;width:40px;height:40px;border-radius:50%;transition:all .2s;cursor:pointer;background:url('data:image/svg+xml; utf-8, <svg width="64px" height="64px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <g id="Menu / Close_SM"> <path id="Vector" d="M16 16L12 12M12 12L8 8M12 12L16 8M12 12L8 16" stroke="%23fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path> </g> </g></svg>') center/24px 24px no-repeat}@media (hover: hover){.modal__close:hover{transform:rotate(90deg)}}.modal__body{padding:30px 20px 20px}.modal__title{max-width:calc(100% - 30px);text-align:center;font-size:28px;margin:0 0 25px;font-weight:600}.modal__text{font-size:20px;max-height:70vh;line-height:1.3;overflow:auto}.start,.scenes,.game{padding:15px;opacity:0;pointer-events:none;transition:all .2s;transform:scale(0) translate(0)}.start.active,.scenes.active,.game.active{opacity:1;pointer-events:all;z-index:1;transform:scale(1)}.start{transform:scale(0) translate(100%,100%)}.game{transform:scale(0) translate(-100%,-100%)}.lives{display:flex;align-items:center;position:absolute;top:20px;right:20px;gap:8px;background:#0000004d;padding:8px 12px;border-radius:20px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.lives__icon{width:84px;height:84px;object-fit:contain}.lives__counter{color:#fff;font-size:25px;font-weight:700;text-shadow:1px 1px 2px rgba(0,0,0,.8);min-width:20px;text-align:center}@media (max-width: 768px){.lives{top:10px;right:10px;padding:5px 8px;border-radius:10px}.lives__icon{width:60px;height:60px}.lives__counter{font-size:20px}}.game-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000;opacity:0;visibility:hidden;transition:all .3s ease}.game-modal.active{opacity:1;visibility:visible}.game-modal__container{background:linear-gradient(135deg,#667eea,#764ba2);padding:40px;border-radius:20px;text-align:center;max-width:400px;width:90%;box-shadow:0 20px 40px #0000004d;transform:scale(.8);transition:transform .3s ease}.game-modal.active .game-modal__container{transform:scale(1)}.game-modal__title{color:#fff;font-size:28px;margin-bottom:16px;text-shadow:2px 2px 4px rgba(0,0,0,.5)}.game-modal__text{color:#ffffffe6;font-size:16px;margin-bottom:30px;line-height:1.5}.game-modal__buttons{display:flex;gap:15px;justify-content:center;flex-wrap:wrap}.game-modal__btn{background:#fff3;border:2px solid rgba(255,255,255,.3);color:#fff;padding:12px 24px;border-radius:25px;font-size:16px;font-weight:700;cursor:pointer;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.game-modal__btn:hover{background:#ffffff4d;border-color:#ffffff80;transform:translateY(-2px)}.game-modal__btn:active{transform:translateY(0)}.scenes__list{width:100%;max-width:700px;margin:0 auto}.scenes__item-btn-number,.scenes__item-btn-text,.scenes__item-btn{transition:all .2s}.scenes__item-btn{width:150px;height:60vh;color:#fff;font-weight:700;width:33%;will-change:auto;position:relative;overflow:hidden;font-size:40px}.scenes__item-btn:before{content:"";position:absolute;top:20px;right:-1px;width:3px;height:calc(100% - 40px);background:linear-gradient(#0000 10%,#fff 40%,#0000) 80%}@media (hover: hover){.scenes__item-btn:hover{width:100%}.scenes__item-btn:hover .scenes__item-btn-number{opacity:0}.scenes__item-btn:hover .scenes__item-btn-text{opacity:1}}.scenes__item-btn span{-webkit-text-stroke:2px black;text-stroke:2px black;background-color:transparent}.scenes__item-btn:nth-child(1){background:url(../images/scene_1.jpg) center/cover no-repeat}.scenes__item-btn:nth-child(2){background:url(../images/scene_2.jpg) center/cover no-repeat}.scenes__item-btn:nth-child(3){background:url(../images/scene_3.jpg) center/cover no-repeat}.scenes__item-btn:nth-child(3):before{display:none}.scenes__item-btn-text{opacity:0}.start__title{font-family:PaintPeel;font-size:90px;text-align:center;margin:0 0 120px;font-weight:400}.menu{bottom:15px;right:15px}.menu__btn{z-index:1;bottom:0}.menu__btn img{transition:all .3s}.menu__option-btn.btn{margin:0 0 15px;opacity:1}.menu__option-btn.btn:nth-child(1){transition:all .3s ease-in-out}.menu__option-btn.btn:nth-child(2){transition:all .2s ease-in-out}.menu__option-btn.btn:nth-child(3){transition:all .1s ease-in-out}.menu.active{border-radius:0}.menu.active .menu__btn img{transform:rotate(180deg)}.menu.active .menu__option-btn{opacity:1}.menu.active .menu__option-btn:nth-child(1){transform:translate(-25px,-120px)}.menu.active .menu__option-btn:nth-child(2){transform:translate(-100px,-100px)}.menu.active .menu__option-btn:nth-child(3){transform:translate(-120px,-25px)}@media (max-width: 1023px){.start__title{font-size:70px;margin:0 0 80px}}@media (max-width: 575px){.menu.active .menu__option-btn{opacity:1}.menu.active .menu__option-btn:nth-child(1){transform:translate(-25px,-100px)}.menu.active .menu__option-btn:nth-child(2){transform:translate(-90px,-90px)}.menu.active .menu__option-btn:nth-child(3){transform:translate(-100px,-25px)}}.preload.hide{display:none}.preload__image{width:300px;display:block;margin:0 0 50px}.preload__text{text-align:center;font-size:30px}.game.active{pointer-events:none}.game.with_modal{pointer-events:all}.game__body{pointer-events:none}.game__btn-list{gap:15px;pointer-events:all}.menu-game{z-index:1;transition:all .2s;transform:translate(-100%);pointer-events:all}.menu-game__container{background:#1c032b;padding:15px;height:100%;max-width:300px}.menu-game__list{gap:30px;padding:60px 0 0}.menu-game__bottom-list{gap:30px}.menu-game__play-btn.btn{top:50%;right:0;transform:translate(50%,-50%);padding:0 0 0 5px;opacity:0;transition:all .2s}.menu-game__play-btn.btn:before{display:none}.menu-game.active{transform:translate(0)}.menu-game.active .menu-game__play-btn{opacity:1}.game-orientation{position:fixed;top:0;left:0;z-index:200;width:100%;height:100%;display:none;flex-direction:column;justify-content:center;align-items:center;gap:20px;background:var(--black)}.game-orientation.active{display:flex}.game-orientation__image{width:200px;height:200px}.game-orientation__text{font-size:30px;color:#fff;text-align:center}#root.hide{display:none}.demo-panel{display:flex;align-items:center;z-index:999;position:fixed;top:20px;right:50px}.demo-panel input{margin-right:20px;transform:scale(2)}
