:root{--fs-h1:2.5rem;--fs-h2:2rem;--fs-h3:1.5rem;--fs-h4:1.25rem;--fs-p:1rem}@media screen and (width<=480px){:root{--fs-h1:2rem;--fs-h2:1.75rem;--fs-h3:1.25rem;--fs-h4:1.1rem;--fs-p:.9rem}}h1{font-size:var(--fs-h1)}h2{font-size:var(--fs-h2)}h3{font-size:var(--fs-h3)}h4{font-size:var(--fs-h4)}p,button{font-size:var(--fs-p)}#root{width:100vw}#root .game-container{flex-direction:column-reverse;align-items:center;display:flex}.flex{align-items:center;display:flex}.header{justify-content:space-around;align-items:center;width:50%;margin:auto;display:flex}main{background-color:#a9a9a9;flex-direction:column;justify-content:center;align-items:center;display:flex}main h1{margin-bottom:0}@media screen and (width<=680px){main{height:100vh;top:0}}button{font-size:var(--fs-p,1rem);color:#000;cursor:pointer;background-color:#d3d3d3;border:1px solid #000;border-radius:8px;margin:10px;padding:10px 16px}button.active{border:4px solid #e2bd15}button:hover{background-color:#a9a9a9}.cb-button{float:right}.instructions{grid-gap:.8rem;grid-template-columns:1fr 2fr 1fr;width:100vmin;margin:auto auto 40px;display:grid}.instructions #counter{text-align:right}.controls{flex-direction:column;align-items:center;display:flex}.controls button{margin:.4rem}.controls button:before{content:url("data:image/svg+xml,%3csvg%20fill='%23000000'%20height='20px'%20width='20px'%20version='1.1'%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20viewBox='0%200%20492.004%20492.004'%20xml:space='preserve'%3e%3cg%3e%3cg%3e%3cpath%20d='M490.544,242.989L229.188,35.717c-1.16-0.916-2.708-1.088-4.04-0.448c-1.332,0.644-2.152,1.984-2.152,3.46v76.552H3.72%20c-2.124,0-3.72,2.064-3.72,4.184v253.592c0,2.128,1.592,3.664,3.72,3.664h219.276v76.552c0,1.476,0.82,2.824,2.152,3.464%20c0.528,0.252,1.092,0.38,1.664,0.38c0.848,0,1.692-0.284,2.384-0.832l261.36-207.268c0.916-0.728,1.448-1.836,1.448-3.016%20C492,244.833,491.468,243.717,490.544,242.989z'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e");justify-content:center;align-items:center;display:flex;position:relative}.controls button svg{max-width:1rem;position:absolute}.controls #up:before{transform:rotate(270deg)}.controls #down:before{transform:rotate(90deg)}.controls #left:before{transform:rotate(180deg)}.controls .control-up{justify-content:center;display:flex}div{display:block}#game-board{background-color:#000;flex-wrap:wrap;width:80vmin;height:80vmin;display:flex}.player{content:"P";background-color:#d3d3d3;justify-content:center;align-items:center;display:flex}.player:before{content:"o_o";background-color:#20b2aa;border-radius:50%;padding:20%}@media screen and (width<=480px){.player:before{padding:5%;font-size:.9rem}}@media screen and (width<=600px){.player:before{font-size:.6rem}}.wall,.corner{background-color:gray}.finish{background-color:#fff}.finish:before,.finish:after{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.finish:before{content:"";background-color:#d3d3d3}.finish:after{content:"EXIT";color:#000;font-weight:700;position:relative;top:-100%}@media screen and (width<=480px){.finish:after{font-size:.6rem}}.level-editor-container .finish{background-color:#d3d3d3}.level-editor-container .finish:before,.level-editor-container .finish:after{top:unset}.finish.vertical:after{transform:rotate(90deg)}.red,.red:before,.red:after{background-color:red}.blue,.blue:before,.blue:after{background-color:#00f}.green,.green:before,.green:after{background-color:green}.magenta,.magenta:before,.magenta:after{background-color:#f0f}.yellow,.yellow:before,.yellow:after{background-color:#ff0}.cyan,.cyan:before,.cyan:after{background-color:#0ff}.orange,.orange:before,.orange:after{background-color:orange}.door{justify-content:center;align-items:center;display:flex;position:relative}.door:before{content:"";-o-transition:all .5s ease-in-out;background-color:#d3d3d3;transition:all .5s ease-in-out}.door.horizontal:before{background-color:#d3d3d3;width:80%;height:100%;position:absolute}.door.vertical:before{width:100%;height:80%}.closed.horizontal:before{width:0%;height:100%}.closed.vertical:before,.closed.vertical:after{width:100%;height:0%}.path{background-color:#d3d3d3}.path.vertical{width:10px}.path.horizontal{height:10px}.open:before{box-shadow:inset 1px 1px 2px 2px #a9a9a9}.void{background-color:#000}.void:before,.void:after{content:none}.level-editor-container .tile-list{margin-left:.5rem}.level-editor-container .tile-list button{display:block}@media screen and (width<=680px){.level-editor-container .tile-list.mobile-collapsible{z-index:100;background-color:#808080f2;border:1px solid #000;border-radius:8px;max-height:80vh;padding:1rem;position:absolute;top:0;right:0;overflow-y:scroll}.level-editor-container .tile-list.mobile-collapsible.closed{display:none}}.level-editor-container .mobile-tile-toggle{display:none}@media screen and (width<=680px){.level-editor-container .mobile-tile-toggle{z-index:101;margin:0;display:block;position:absolute;bottom:-50px}}.level-editor-container .tile{outline:1px dotted #a9a9a9;justify-content:center;align-items:center;display:flex}.switch{color:orange}.mr-2{margin-right:2rem}.container-header p{margin-bottom:0}.container-header h4{margin-top:0}@media screen and (width<=480px){.container-toggle{display:none}}.colourblind-true .red{background-color:#d55e00}.colourblind-true .orange{background-color:#e69f00}.colourblind-true .yellow{background-color:#f0e442}.colourblind-true .green{background-color:#009e73}.colourblind-true .blue{background-color:#0072b2}.colourblind-true .cyan{background-color:#56b4e9}.colourblind-true .magenta{background-color:#cc79a7}@media screen and (width>=480px){.top{grid-template-columns:1fr 1fr 1fr;display:grid}.lower-buttons,.bottom-text{justify-content:space-between;width:80%;position:relative;top:0%}.bottom-text{justify-content:center}.lower-buttons h3{margin:0}.lower-buttons .random-btn{left:60%}}.dark-mode-true{color:#fff;background-color:#000}.solution:not(.door),.solution.door:before,.solution.finish:before{background-color:#eee8aa}.deadEnd:after{content:"!";color:#000;position:relative}.top-nav{box-sizing:border-box;justify-content:space-between;align-items:center;width:100%;padding:30px 50px 20px;display:flex}@media screen and (width<=480px){.top-nav{padding:30px 30px 20px}}.hamburger{cursor:pointer;-webkit-user-select:none;user-select:none;z-index:1000;width:128px;font-size:24px}.burger-menu{z-index:1000;background-color:#333;border-radius:8px;flex-direction:column;padding:10px;display:flex;position:absolute;top:50px;left:10px;box-shadow:0 4px 6px #0000004d}.burger-menu button{color:#fff;text-align:left;font-size:var(--fs-p,16px);cursor:pointer;background:0 0;border:none;border-radius:8px;width:100%;margin:2px 0;padding:10px}.burger-menu button:hover{background-color:#555}.burger-menu hr{border-color:#555;width:100%}.popup-overlay{z-index:1000;background-color:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.popup-menu{z-index:1000;text-align:center;color:#fff;background-color:#333;border-radius:8px;flex-direction:column;padding:20px;display:flex;box-shadow:0 4px 6px #0000004d}.popup-menu button{color:#fff;text-align:center;font-size:var(--fs-p,16px);cursor:pointer;background-color:#555;border:none;border-radius:8px;width:100%;margin:5px 0;padding:10px}.popup-menu button:hover{background-color:#666}.tile.solution{justify-content:center;align-items:center;display:flex}.tile.solution.player span{display:none}.burger-menu .x-button{color:#fff;cursor:pointer;z-index:1001;z-index:99;background:0 0;border:none;width:16px;margin-top:5px;padding:0;font-size:20px;position:absolute;top:0;right:0}.score-display{text-align:right;font-weight:700}.flipped-btn{transform:rotate(180deg)}.random-btn{padding:2px 6px;position:absolute;left:40%}.arrow-btn{padding:8px 12px}.centered{text-align:center}.lower-buttons button{margin:.1rem;padding:4px 2px}@media screen and (width<=680px){.hide-on-mobile{display:none!important}}#refresh,#undo{padding-left:7px;padding-right:7px}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#242424;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}a{color:#646cff;-webkit-text-decoration:inherit;text-decoration:inherit;font-weight:500}a:hover{color:#535bf2}body{min-width:320px;min-height:100vh;margin:0;display:flex}h1{font-size:3.2em;line-height:1.1}button{cursor:pointer;padding:.6em 1.2em;font-family:inherit;font-size:1em;font-weight:700;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme:light){:root{color:#000;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}