:root{--text-color: #28120b;--background-color: #ffffff;--primary-color: #e78f8e;--secondary-color: #efcec3;--accent-color: #add8e6;--overlay-color: rgba(0, 0, 0, .4);--canvas-border-width: 2px;--countdown-overlay: rgba(255, 255, 255, .75);--achievement-card-width: clamp(110px, 15vw, 160px);--filter-brightness: .7;font-size:18px}@keyframes achievementCardLeft{to{transform:translate(calc(var(--achievement-card-width) / -2)) rotate(-15deg)}}@keyframes achievementCardRight{to{transform:translate(calc(var(--achievement-card-width) / 2)) rotate(15deg)}}@keyframes achievementCardHover{0%{transform:translateY(0)}to{transform:translateY(10px)}}*{margin:0;padding:0;color:var(--text-color);font-family:Ysabeau SC,sans-serif;box-sizing:border-box}html,body,#root{width:100%;height:100%}body{background-color:var(--background-color)}button{padding:10px 20px;color:#fff;font-size:1rem;font-weight:700;text-transform:uppercase;border-radius:10px;border:6px solid var(--accent-color);background-color:var(--primary-color);cursor:pointer;transition:.25s}button.secondary{transform:scale(.85)}button.secondary:hover:not(:disabled){transform:scale(.9)}button:hover:not(:disabled){font-size:1.1em;transform:translateY(-.25em)}button:active:not(:disabled){font-size:.95em}button:disabled{filter:brightness(var(--filter-brightness));cursor:default}button:focus{outline:none}input[type=range]{-webkit-appearance:none;background:transparent;cursor:pointer}input[type=range]::-moz-range-track{height:6px;border-radius:4px;background:var(--primary-color)}input[type=range]::-moz-range-thumb{height:12px;width:12px;border-radius:50px;border:6px solid var(--accent-color);background:var(--background-color)}input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:4px;background:var(--primary-color)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;margin-top:-9px;height:24px;width:24px;border-radius:50px;border:6px solid var(--accent-color);background:var(--background-color)}input[type=range]:focus::-webkit-slider-runnable-track{background:var(--primary-color)}.inputWrapper{display:flex;flex-direction:column}.inputWrapper label{margin-bottom:4px}.toggleSwitch{position:relative;width:60px;height:34px}.toggleSwitch input{opacity:0;width:0;height:0}.toggleSwitch__slider{position:absolute;top:0;left:0;right:0;bottom:0;background-color:var(--accent-color);border-radius:34px;transition:.4s;cursor:pointer}.toggleSwitch__slider:before{position:absolute;content:"";height:26px;width:26px;left:4px;bottom:4px;background-color:var(--background-color);border-radius:50%;transition:.4s}input:checked+.toggleSwitch__slider{background-color:var(--primary-color)}input:checked+.toggleSwitch__slider:before{transform:translate(26px)}.noSelect,.levelNode p,.levelNode span{pointer-events:none;user-drag:none;-webkit-user-select:none;user-select:none}.panMouse{cursor:move}span.video-icon{display:block;height:1.8em;aspect-ratio:1;background-image:url(../icons/video.svg);background-size:cover}span.exit-icon{display:inline-block;height:1.2em;position:relative;top:.35em;aspect-ratio:1;background-image:url(../icons/exit.svg);background-size:cover}#background{position:absolute;width:100vw;height:100vh;overflow:hidden;z-index:-1}#background svg{min-width:100%;min-height:100%}#background svg path{stroke:var(--accent-color);stroke-width:2px;fill:none}#background #levelTitle{fill:var(--accent-color);font-size:70px;font-weight:700;transform:rotate(-30deg)}canvas.mazeBackground{background-color:var(--background-color);border:var(--canvas-border-width) solid var(--accent-color)}.gameDisplay{position:relative;border-radius:10px}.gameDisplay canvas:not(:first-of-type){position:absolute;top:var(--canvas-border-width);left:var(--canvas-border-width)}.gameDisplay__countdown{position:absolute;top:var(--canvas-border-width);left:var(--canvas-border-width);background-color:var(--countdown-overlay);justify-content:center;align-items:center}.gameDisplay__countdown p{padding:10px;width:calc(2rem + 25px);height:calc(2rem + 25px);color:#fff;font-size:2rem;line-height:1rem;font-weight:700;text-align:center;-webkit-user-select:none;user-select:none;border-radius:50%;border:6px solid var(--accent-color);background-color:var(--primary-color)}section{display:grid;grid-template-columns:1fr 3fr 1fr;height:100%}section .main{display:flex;flex-direction:column;grid-column:2/3;gap:40px;padding:40px 0;justify-content:center;align-items:center}section .main h1{margin-bottom:0;font-size:2.5rem}#gameOverlay{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;background-color:var(--overlay-color);z-index:2}#gameOverlay>div{display:grid;grid-template-rows:48px 28px 28px 70px;align-items:center;gap:15px;padding:20px;text-align:center;border-radius:10px;border:4px solid var(--accent-color);background-color:var(--background-color)}#gameOverlay>div h2{font-size:2rem}#gameOverlay>div #gameOverlayButtons{display:grid;grid-template-columns:repeat(3,145px);gap:20px;margin-top:10px}#gameOverlay>div #gameOverlayButtons button{display:flex;justify-content:center;align-items:center;gap:10px;height:60px}#achievementOverlay{position:absolute;top:0;left:0;display:grid;grid-template-rows:80px 1fr 80px;padding:20px;justify-content:center;align-items:center;width:100%;height:100%;background-color:var(--overlay-color);z-index:2}#achievementOverlay>div{position:relative}#achievementOverlay h1{color:#fff;font-size:3rem}#achievementOverlay .achievementCard:nth-of-type(1),#achievementOverlay .achievementCard:nth-of-type(2){position:absolute}#achievementOverlay.animate .achievementCard:nth-of-type(1){animation:achievementCardLeft .75s forwards}#achievementOverlay.animate .achievementCard:nth-of-type(2){animation:achievementCardRight .75s forwards}#achievementOverlay.animate .achievementCard:nth-of-type(3){animation:achievementCardHover 1.7s infinite ease-in-out alternate}.achievementCard{position:relative;display:grid;grid-template-rows:var(--achievement-card-width) 1fr;width:var(--achievement-card-width);height:clamp(165px,22vw,240px);border-radius:20px;background-color:var(--background-color);box-shadow:0 0 8px 2px #00000040;-webkit-user-select:none;user-select:none}.achievementCard__image{width:calc(var(--achievement-card-width) * .5);justify-self:center;align-self:center}.achievementCard__title{padding:0 10px 10px;color:var(--text-color);text-align:center;font-size:clamp(1rem,2vw,1.2rem);font-weight:700;line-height:90%;text-transform:lowercase}.achievementCard__container{justify-self:center;width:var(--achievement-card-width)}.achievementCard__icons{position:absolute;top:-15px;display:flex;justify-content:center;gap:5px;width:100%;padding:0 10px}.achievementCard__icon{width:100%;max-height:40px}#fastModeTutorialOverlay{position:absolute;top:0;left:0;padding:110px 120px;width:100%;height:100%;background-color:var(--overlay-color);z-index:2}#fastModeTutorialOverlay p{color:#fff;font-size:1.5rem}#fastModeSwitchLabel.tutorialActive span{outline:10px solid white}#menuSection .main{padding-bottom:0}#menuSection img{height:2.6rem}#menuSection .buttons{display:grid;grid-template-columns:repeat(2,155px);grid-template-rows:repeat(2,60px);gap:20px}#achievementsSection{display:grid;grid-template-columns:repeat(auto-fill,var(--achievement-card-width));gap:20px;padding:50px 100px 50px 50px}#achievementsSection .achievementCard{transition:.5s}#achievementsSection .achievementCard:hover:not(.locked){transform:scale(1.075)}#achievementsSection .achievementCard.locked{background-color:#b2b2b2}#gameSection{align-items:start}#gameSection.tutorialActive{grid-template-columns:1fr auto 1fr;margin:0 90px}#gameSection.tutorialActive #stats,#gameSection.tutorialActive #duelStats,#gameSection.tutorialActive #gameOverlay>div #overlayStats,#gameOverlay>div #gameSection.tutorialActive #overlayStats{grid-template-columns:60px 100px 60px}#gameSection.tutorialActive .tutorial{display:block}.tutorial{display:none;padding:100px 40px;grid-column:3/4;height:100%}.tutorial p{font-size:1.2rem;text-transform:lowercase}.tutorial img{padding-top:10px;height:150px}#stats,#duelStats,#gameOverlay>div #overlayStats{display:grid;grid-template-columns:repeat(3,100px);justify-content:center;gap:30px}#stats p,#duelStats p,#gameOverlay>div #overlayStats p{text-align:center}#stats p:first-of-type,#duelStats p:first-of-type,#gameOverlay>div #overlayStats p:first-of-type{text-align:right}#stats p:last-of-type,#duelStats p:last-of-type,#gameOverlay>div #overlayStats p:last-of-type{text-align:left}.endless #stats,.endless #duelStats,.endless #gameOverlay>div #overlayStats,#gameOverlay>div .endless #overlayStats,.overlayEndless #overlayStats{grid-template-columns:100px 130px 100px!important}#customMazeSection>.main{display:grid;grid-template-columns:1fr 205px;grid-template-rows:60px 1fr 60px;grid-template-areas:"t t" "s p" "i g";gap:5px;margin:auto;padding:75px 100px;width:100vw;height:100vh;max-width:1000px;max-height:500px}#mazeSettingsMain{align-self:start;grid-area:s}#mazeSettingsDescription{padding-bottom:10px}#mazeSettings,#settingsSection #settingsContainer{align-self:first baseline;display:grid;grid-template-columns:repeat(auto-fit,150px);gap:20px}#mazeSettings label,#settingsSection #settingsContainer label{text-transform:lowercase}#gamePreviewContainer{grid-area:p;justify-self:center}#generateButton{grid-area:g}#mazeSettingsTitle{grid-area:t;text-align:center;text-transform:lowercase}#mazeSettingsTip{grid-area:i}#duelSection .main{height:100vh}#duelStats p:first-of-type{text-align:left}#duelGameWrapper{display:flex;flex-direction:row;gap:50px}#player2Container canvas.mazeBackground{border:2px solid red}#overlay-duelWinner,.duelPlayer1Resets,.duelPlayer2Resets{font-weight:700;text-transform:lowercase;font-size:22px}.duelPlayer1Resets{color:var(--accent-color)}.duelPlayer2Resets{color:var(--primary-color)}#treeSection .main h1{z-index:2}#treeHeader{position:absolute;top:50px;left:50px;display:flex;align-items:center;gap:30px;z-index:2}#treeStarCount{font-size:30px}#treeContainer{position:absolute;top:0;left:0;width:100vw;height:100vh;overflow:hidden}#treeFadeRight{position:absolute;top:0;right:0;width:0px;height:100vh;z-index:1;box-shadow:-4px 0 60px 60px var(--background-color)}#treeFadeBottom{position:absolute;bottom:0;left:0;width:100vw;height:0px;z-index:1;box-shadow:0 -4px 60px 60px var(--background-color)}#moveInstructions{position:absolute;bottom:0;left:0;padding:10px;color:var(--text-color);font-size:1.5rem;z-index:2}.levelNode{position:absolute;padding:5px;width:72px;aspect-ratio:1;border-radius:4px;background-color:var(--secondary-color);z-index:1;overflow:hidden;transition:transform .2s}.levelNode p{color:var(--background-color);text-align:right;font-size:2.5rem;font-weight:700;line-height:84.8%}.levelNode span{display:block;width:100%;color:var(--background-color);font-size:1.3rem;text-align:center;line-height:84.8%}.levelNode:hover{transform:scale(1.1)}.levelNode.unlocked{cursor:pointer;background-color:var(--primary-color)}.levelNode:not(.unlocked):after{content:" ";position:absolute;left:0;top:0;width:72px;aspect-ratio:1;background-color:#0003;background-image:url(../icons/lock.svg);background-size:cover}.levelConnector{position:absolute;display:block;width:200px;height:4px;background-color:var(--secondary-color)}.levelConnector.vertical{width:4px;height:200px}.levelConnector.active{background-color:var(--primary-color)}.treeEmpty{position:absolute;display:block;width:10px;height:10px}#settingsSection #settingsContainer{align-self:auto;padding:0 50px;gap:80px;width:100vw;max-width:1000px}#deleteDataButton{font-size:1.01rem}.overlaySettings #overlayButtonSecondary{font-size:.95rem}.overlaySettings #overlayButtonHome{font-size:.79rem}#controlButtons{position:absolute;top:0;right:0;display:flex;flex-direction:column;gap:10px;padding:15px}#controlButtons button{width:3.5rem;aspect-ratio:1;border-radius:50%;background-size:cover;z-index:2}#mainMenuButton{background-image:url(../icons/home.svg);z-index:1}#menuOverlayButton{background-image:url(../icons/menu.svg);z-index:1}#achievementsButton{background-image:url(../icons/achievements.svg);z-index:1}#settingsButton{background-image:url(../icons/settings.svg);z-index:1}#muteWrapper{z-index:4}#muteButton{background-image:url(../icons/unmute.svg)}#muteCheckbox:checked+#muteButton{background-image:url(../icons/mute.svg)}@media screen and (max-height: 550px){#gameSection .main{padding:20px 0;gap:20px}.tutorial{padding:60px 0}}@media screen and (min-height: 620px){#customMazeSection>.main{border:4px solid lightblue;border-radius:10px;box-shadow:0 0 0 2000px var(--overlay-color)}#achievementOverlay{padding:40px}#achievementsSection{gap:50px}#achievementsSection .achievementCard:hover:not(.locked){transform:scale(1.1)}}
