:root{--snake-color:#60c260;--snake-head-color:#1e911e}#board{border:1px solid #000;display:flex;flex-direction:column;height:var(--board-size);width:var(--board-size)}#board.board-lost{border:1px solid crimson}.board-row{display:flex}.square{background:#fff;border:1px solid rgba(112,76,182,.3);box-sizing:border-box;height:var(--square-size);width:var(--square-size)}.square.snake{background:#60c260;background:var(--snake-color)}.square.snake-head{background:#1e911e;background:var(--snake-head-color)}.square.rock{background:#2f4f4f}.square.food{background:crimson}.square.snake-dead{background:#60c260;background:var(--snake-color);border:1px solid #d4c9e9;box-shadow:inset 0 0 8px 1.25vh #fff;transition:all 1s}.App.dark{--darkest:#111;--dark:#212121;--gray:#959595;--white:#d3d8db;background-color:var(--darkest)}.App.dark .app-header h2{color:var(--white)}.App.dark .header-text,.App.dark .key-text-info{color:var(--gray)}.App.dark .button-green{-webkit-filter:brightness(88%);filter:brightness(88%)}.App.dark #board{border:1px solid var(--gray)}.App.dark #board.board-lost{border:1px solid crimson}.App.dark #pick-level{border:1px solid var(--gray)}.App.dark .level-thumbnail{border:3px solid #979797;-webkit-filter:invert(.95) hue-rotate(194deg) brightness(.75);filter:invert(.95) hue-rotate(194deg) brightness(.75)}.App.dark .key-info{background:#212121;box-shadow:0 0 2px 1px var(--white);color:var(--white)}.App.dark .square{background:var(--dark)}.App.dark .square.snake{background:var(--snake-color)}.App.dark .square.snake-head{background:var(--snake-head-color)}.App.dark .square.rock{background:var(--gray)}.App.dark .square.food{background:crimson}.App.dark .square.snake-dead{background:var(--snake-color);border:1px solid #392e4e;box-shadow:inset 0 0 8px 1.25vh var(--dark)}.toggle-btn{border-radius:10px;height:25px;margin:0 auto;position:absolute;text-align:left;top:12px;-webkit-transform:translateX(36vh);transform:translateX(36vh);width:49px}input[type=checkbox]{cursor:pointer;height:100%;margin:0;opacity:0;width:100%;z-index:2}#theme-toggle span,input[type=checkbox]{bottom:0;left:0;position:absolute;right:0;top:0}#theme-toggle span{background-color:#fff;border-radius:14px;opacity:1;overflow:hidden;transition:background-color .3s ease,opacity .3s ease}#theme-toggle span:after,#theme-toggle span:before{border-radius:14px;content:"";height:19px;position:absolute;top:2px;transition:transform .6s ease,background-color .3s ease;width:19px}#theme-toggle span:before{background-color:#fff;-webkit-transform:translate(-19px);transform:translate(-19px);z-index:1}#theme-toggle span:after{background-color:#000;-webkit-transform:translate(3px);transform:translate(3px);z-index:0}#theme-toggle input[type=checkbox]:checked+span{background-color:#000}#theme-toggle input[type=checkbox]:active+span{opacity:.5}#theme-toggle input[type=checkbox]:checked+span:before{background-color:#000;-webkit-transform:translate(19px,-7px);transform:translate(19px,-7px)}#theme-toggle input[type=checkbox]:checked+span:after{background-color:var(--white);-webkit-transform:translate(26px);transform:translate(26px)}#theme-toggle input[type=checkbox]+span{border:1px solid #000}#theme-toggle input[type=checkbox]:checked+span{border:1px solid var(--white)}:root{--lesser-text:#474747;--board-size:75vh;--square-size:2.5vh;--theme-transition:0.4s}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Comic Sans MS,Comic Sans,Verdana;margin:0}.App{align-items:center;display:flex;flex-direction:column;gap:10px;height:100vh;justify-content:center;overflow:hidden;text-align:center;transition:background .4s;transition:background var(--theme-transition)}.App:focus-within{outline:none}.app-header{align-items:center;display:flex;flex-direction:column;justify-content:center}.app-header h2{display:flex;font-size:28px;margin:10px 0 2px;transition:all .4s;transition:all var(--theme-transition)}#header-img{display:inline-block;margin-right:1px;width:30px}.header-text{color:#474747;color:var(--lesser-text);display:flex;font-size:20px;gap:5px}#main{height:75vh;height:var(--board-size);position:relative;width:75vh;width:var(--board-size)}#main>*{position:absolute;transition:all .5s cubic-bezier(.54,1.5,.38,1.11)}#body{margin-bottom:20px}#pick-level{grid-gap:40px;border:1px solid #000;box-sizing:border-box;display:grid;grid-template-columns:1fr 1fr 1fr;height:100%;left:0;padding:40px;width:100%}.level-thumbnail{border:3px solid #000;overflow:hidden;transition:all .3s}.level-thumbnail img{cursor:pointer;display:block;transition:all .3s;width:100%}.level-thumbnail:hover img{-webkit-filter:brightness(90%);filter:brightness(90%)}.level-thumbnail:hover{box-shadow:0 0 5px 2px rgba(60,64,67,.15),0 0 6px 2px rgba(60,64,67,.15)}#main.show-board #pick-level{opacity:0;pointer-events:none;-webkit-transform:translate(600px);transform:translate(600px)}#main.hide-board #board{opacity:0;pointer-events:none;-webkit-transform:translate(-600px);transform:translate(-600px)}#controls{align-items:center;display:flex;flex-direction:column;gap:14px;margin-top:14px}.control-buttons{display:flex;gap:10px}#info{display:flex;flex-direction:column;gap:8px;transition:all .4s;transition:all var(--theme-transition);width:240px}.info-row{display:flex;justify-content:space-between}.key-info{background:#f2f2f2;border-radius:3px;box-shadow:0 0 2px 1px rgba(0,0,0,.2);color:#474747;color:var(--lesser-text);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:15px;margin-right:7px;padding:1px 6px}.key-info,.key-text-info{display:inline-block;transition:all .4s;transition:all var(--theme-transition)}.key-text-info{text-align:center;width:50%}.disabled{opacity:.5;pointer-events:none}.button-green{background:transparent;border:none;border-radius:4px;color:#fff;cursor:pointer;display:inline-block;font-family:Comic Sans MS,Comic Sans;font-size:18px;min-width:-webkit-max-content;min-width:max-content;outline:none!important;overflow:hidden;padding:3px 10px 4px;position:relative;width:80px;z-index:1}.button-green:after,.button-green:before{content:"";height:104%;left:-2%;position:absolute;top:-2%;width:104%;z-index:-1}.button-green:hover:after{opacity:0}.button-green:after{background-image:linear-gradient(180deg,#1dcd77,#1c8f93)}.button-green:before{background-image:linear-gradient(180deg,#16b869,#126668)}.button-green:active:after,.button-green:active:before{box-shadow:inset 0 0 6px 3px rgba(0,0,0,.66),0 1px 0 #eee;-webkit-filter:brightness(90%);filter:brightness(90%)}
/*# sourceMappingURL=main.1d06c222.css.map*/