*{box-sizing:border-box}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#header{cursor:pointer;-webkit-user-select:none;-ms-user-select:none;user-select:none}#body{align-self:stretch;display:block;height:100%;margin:0 auto;overflow:hidden;position:relative;width:100vw}#body>.content{align-items:center;display:flex;flex-direction:row;height:calc(100% - 80px)}#body .menu{bottom:20px;max-width:70vw;position:absolute;text-align:right;width:100%}#reverse-tile-game{align-items:center;background-color:#9e52d0;background-image:radial-gradient(ellipse at top 0 right 0,#1ca59e,transparent 100vw);color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);height:100vh;justify-content:center;width:100vw}#reverse-tile-game .help-button{border-radius:50%;font-size:1em;height:50px;line-height:1;padding:0;position:fixed;right:6.25vw;text-align:center;top:4.4444444444vh;width:50px}@media screen and (max-width:768px){#reverse-tile-game .help-button{top:8.8888888889vh;-webkit-transform:scale(.8);transform:scale(.8)}}button.full,button.outlined,button.underlined{border-radius:5px;box-shadow:0 1px 0 1px #333;cursor:pointer;display:inline-block;font-weight:700;margin:5px 10px;padding:10px 20px;position:relative;text-align:left;transition:all .3s}button.full:hover,button.outlined:hover,button.underlined:hover{box-shadow:0 3px 3px 1px #333}button.underlined{border:none;border-bottom:2px solid #fff;padding-left:5px;padding-right:5px}button.outlined,button.underlined{background-color:transparent;color:#fff}button.full,button.outlined{border:2px solid #fff}button.full{background-color:#fff;color:#333}button.float{float:left}.tile-content.fadein{-webkit-animation:fadein .7s linear;animation:fadein .7s linear;-webkit-animation-direction:normal;animation-direction:normal;-webkit-animation-iteration-count:1;animation-iteration-count:1;opacity:1}.tile-content.fadeout{-webkit-animation:fadein 2s linear;animation:fadein 2s linear;animation-direction:reverse;-webkit-animation-iteration-count:1;animation-iteration-count:1;opacity:0}#tile-board{display:flex;flex-direction:column;gap:2px;margin:0 auto;min-width:70vw}#tile-board div.row{align-content:stretch;align-items:stretch;display:flex;flex-direction:row;flex-wrap:nowrap;flex-flow:space-evenly;gap:2px;justify-content:center;width:100%}#tile-board div.tile{background-color:#ddd;background-color:var(--tileColor,#ddd);background-image:url(/static/media/baby_feet.a4b6ddb50e77e0056049.jpg);background-position-x:309px;background-position-x:calc((var(--size, 4) - var(--j, 0))/var(--size, 4)*310px - 1px);background-position-y:309px;background-position-y:calc((var(--size, 4) - var(--i, 0))/var(--size, 4)*310px - 1px);background-size:310px;border-color:gray #000 #000 gray;border-style:solid;border-width:2px;cursor:pointer;-webkit-filter:grayscale(0) brightness(1);filter:grayscale(0) brightness(1);-webkit-filter:grayscale(var(--tileGS,0)) brightness(var(--tileBright,1));filter:grayscale(var(--tileGS,0)) brightness(var(--tileBright,1));flex:0 1 76px;flex:0 1 calc((310px - (var(--size, 4) - 1)*2px)/var(--size, 4));height:76px;height:calc((310px - (var(--size, 4) - 1)*2px)/var(--size, 4));position:relative;transition:all .3s}#tile-board div.tile:hover{-webkit-filter:grayscale(0) brightness(1.2);filter:grayscale(0) brightness(1.2);-webkit-filter:grayscale(var(--tileGS,0)) brightness(var(--tileBrightHover,1.2));filter:grayscale(var(--tileGS,0)) brightness(var(--tileBrightHover,1.2))}#tile-board div.tile,#tile-board div.tile:after,#tile-board div.tile:before{border-radius:15px;border-radius:calc(25px*(1 - var(--size, 4)/10))}#tile-board div.tile.on{--tileColor:#333;--tileGS:1;--tileBright:0.20;--tileBrightHover:0.35}#tile-board div.tile.off{--tileColor:#ddd;--tileGS:0;--tileBright:1;--tileBrightHover:1.2}#tile-board div.tile.off:hover{border-color:#bbb #333 #333 #bbb}#tile-board div.tile.highlight{--tileColor:#2febac;-webkit-animation:highlight-animation 2.5s linear;animation:highlight-animation 2.5s linear;-webkit-animation-iteration-count:1;animation-iteration-count:1}#tile-board div.tile.highlight:before{-webkit-animation:image-fade 2.5s linear;animation:image-fade 2.5s linear;-webkit-animation-iteration-count:1;animation-iteration-count:1;background-color:#2febac;background-size:contain;opacity:0}#tile-board div.tile.highlight:before,#tile-board.win .tile:after{bottom:-2px;content:"";left:-2px;position:absolute;right:-2px;top:-2px}#tile-board.win .tile:after{-webkit-animation:rainbow-bg 2.5s linear;animation:rainbow-bg 2.5s linear;-webkit-animation-delay:var(--delay);animation-delay:var(--delay);-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}@-webkit-keyframes fadein{0%{opacity:0}to{opacity:1}}@keyframes fadein{0%{opacity:0}to{opacity:1}}@-webkit-keyframes highlight-animation{0%,to{-webkit-filter:grayscale(0) brightness(1.2);filter:grayscale(0) brightness(1.2);-webkit-filter:grayscale(var(--tileGS,0)) brightness(var(--tileBright,1.2));filter:grayscale(var(--tileGS,0)) brightness(var(--tileBright,1.2))}10%{-webkit-filter:grayscale(0) brightness(1);filter:grayscale(0) brightness(1)}}@keyframes highlight-animation{0%,to{-webkit-filter:grayscale(0) brightness(1.2);filter:grayscale(0) brightness(1.2);-webkit-filter:grayscale(var(--tileGS,0)) brightness(var(--tileBright,1.2));filter:grayscale(var(--tileGS,0)) brightness(var(--tileBright,1.2))}10%{-webkit-filter:grayscale(0) brightness(1);filter:grayscale(0) brightness(1)}}@-webkit-keyframes image-fade{0%,to{opacity:0}10%{opacity:1}}@keyframes image-fade{0%,to{opacity:0}10%{opacity:1}}@-webkit-keyframes rainbow-bg{0%,to{background-color:#ff007f}8%{background-color:#e04b4b}16%{background-color:#e7811b}25%{background-color:#f7f458}33%{background-color:#37db21}41%{background-color:#44e078}50%{background-color:#2febac}58%{background-color:aqua}66%{background-color:#3397e9}75%{background-color:#3939d1}83%{background-color:#7f00ff}91%{background-color:#f0f}}@keyframes rainbow-bg{0%,to{background-color:#ff007f}8%{background-color:#e04b4b}16%{background-color:#e7811b}25%{background-color:#f7f458}33%{background-color:#37db21}41%{background-color:#44e078}50%{background-color:#2febac}58%{background-color:aqua}66%{background-color:#3397e9}75%{background-color:#3939d1}83%{background-color:#7f00ff}91%{background-color:#f0f}}#header-stepper{display:block;margin:20px 0 40px;position:relative;text-align:center;width:100%}#header-stepper .dot{background-color:#fff;border-radius:50%;box-shadow:2px 2px 1px 1px rgba(0,0,0,.8);display:inline-block;font-size:7px;font-weight:700;height:10px;line-height:10px;margin:0 30px;text-align:center;transition:all .3s;width:10px}#header-stepper .dot:not(.active){opacity:.7;-webkit-user-select:none;-ms-user-select:none;user-select:none}#header-stepper .dot.active{box-shadow:1px 1px 1px 0 rgba(0,0,0,.6);color:#000;-webkit-transform:scale(3);transform:scale(3)}#reward{display:block;margin:0 auto;overflow:hidden;width:70%}@media screen and (max-width:768px){#reward{width:90%}}.hidden{visibility:hidden}button.animated{-webkit-animation:rewardNextAnimation .3s linear;animation:rewardNextAnimation .3s linear;-webkit-animation-direction:normal;animation-direction:normal;-webkit-animation-iteration-count:1;animation-iteration-count:1;position:relative}button.animated:before{-webkit-animation:rewardNextAnimationArrow .3s linear;animation:rewardNextAnimationArrow .3s linear;-webkit-animation-delay:.3s;animation-delay:.3s;-webkit-animation-direction:normal;animation-direction:normal;-webkit-animation-iteration-count:1;animation-iteration-count:1;background-color:transparent;border-right:20px solid transparent;border-top:20px solid transparent;border-color:#fff #fff transparent transparent;border-style:solid;border-width:20px;content:"";left:0;opacity:0;position:absolute;top:0;-webkit-transform:translate(-20px) rotate(45deg);transform:translate(-20px) rotate(45deg)}.reward-content{display:block;max-height:100%;overflow-y:auto;padding:0 20px 40px;position:relative}@media screen and (max-width:768px){.reward-content{overflow-y:scroll}}.reward-content h1{text-shadow:#333 3px 0 0;text-transform:uppercase}.reward-content p{font-size:.8em;padding-right:40px}@media screen and (max-width:768px){.reward-content p{padding-right:10px}}.reward-content img{box-shadow:0 3px 3px 1px #333;display:block;margin:0 auto;max-height:50vh;max-width:100%}@-webkit-keyframes rewardNextAnimation{0%{opacity:0;-webkit-transform:scale(1);transform:scale(1)}70%{opacity:1;-webkit-transform:scale(1.25);transform:scale(1.25)}to{-webkit-transform:scale(1);transform:scale(1)}}@keyframes rewardNextAnimation{0%{opacity:0;-webkit-transform:scale(1);transform:scale(1)}70%{opacity:1;-webkit-transform:scale(1.25);transform:scale(1.25)}to{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes rewardNextAnimationArrow{0%{left:0;opacity:1}50%{opacity:1}to{left:120%;opacity:0}}@keyframes rewardNextAnimationArrow{0%{left:0;opacity:1}50%{opacity:1}to{left:120%;opacity:0}}#help-modal.hidden{display:none}#help-modal>*{z-index:100}#help-modal .overlay-background{background-color:hsla(0,0%,100%,.5);bottom:0;cursor:pointer;left:0;position:fixed;right:0;top:0}#help-modal .overlay-content{background-color:hsla(0,0%,6%,.85);border:2px solid #fff;border-radius:5px;left:50%;max-height:85vh;overflow:auto;padding:0 30px 50px;position:fixed;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:70vw}@media screen and (max-width:768px){#help-modal .overlay-content{width:90vw}}#help-modal .overlay-content .tip{border-top:2px solid #fff;margin-bottom:50px;padding:30px}#help-modal .overlay-content .tip b{background-color:#ddd;color:#333;margin-right:10px;padding:0 15px 2px 10px;text-shadow:#fff 0 0 3px,#fff 1px 1px 1px}#help-modal .overlay-content .play-button{text-align:center}#help-modal .overlay-content .play-button button{position:relative;-webkit-transform:scale(1.5);transform:scale(1.5)}#help-modal .overlay-content .play-button button:before{border:2px solid #fff;border-radius:inherit;bottom:-6px;content:"";left:-6px;opacity:0;position:absolute;right:-6px;top:-6px;transition:all .3s;z-index:-1}#help-modal .overlay-content .play-button button:hover:before{opacity:1}#help-modal .overlay-content h1,#help-modal .overlay-content h2,#help-modal .overlay-content p{font-size:.8em;text-shadow:#000 1px 1px 1px,#333 0 0 3px}#help-modal .overlay-content h1{color:#5af1cc;font-size:2em;position:relative;text-align:center}#help-modal .overlay-content h2{margin-top:50px}#help-modal .overlay-content h2~p:not(.img,.play-button,.tip){margin-left:30px}#help-modal .overlay-content p{margin:0}#help-modal .overlay-content p.img{padding:50px;text-align:center}#help-modal .overlay-content p.img img{box-shadow:0 3px 3px 1px #333;max-height:50%;max-width:50%}@media screen and (max-width:768px){#help-modal .overlay-content p.img{margin-left:-50px;margin-right:-50px}#help-modal .overlay-content p.img img{max-width:100%}}
/*# sourceMappingURL=main.d902ed7f.css.map*/