body{background-image:url(/15-puzzle/assets/BG6aRoIh.webp);margin:0}:root{--overflow: 4px;--board-size: min(360px, calc(100vw - 2rem) );--board-radius: calc(var(--board-size) / 100);--tile-gap-coefficient: .03;--tile-gap: calc(var(--board-size) * var(--tile-gap-coefficient));--tile-border-radius: calc(var(--board-size) / 70);--tile-border-color: #666;--tile-number-color: #ccc}.game{font-family:Courier New,Courier,monospace;font-size:14px;margin:1rem auto;position:relative}.board{background-image:url(data:image/webp;base64,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);border-radius:var(--board-radius);box-shadow:#333 2px 2px 5px;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);height:var(--board-size);margin:0 auto;padding:var(--tile-gap);position:relative;width:var(--board-size)}.board:not(.board_done){grid-gap:var(--tile-gap)}.board:not(.board_done) .board__tile{border-radius:var(--tile-border-radius);border-style:solid;box-shadow:#000 2px 2px 2px;cursor:pointer}@media(hover:hover)and (pointer:fine){.board:not(.board_done) .board__tile:hover{box-shadow:#000 8px 8px 10px;left:-4px;top:-4px}}.board:not(.board_done) .board__tile_1:after{content:"1"}.board:not(.board_done) .board__tile_2:after{content:"2"}.board:not(.board_done) .board__tile_3:after{content:"3"}.board:not(.board_done) .board__tile_4:after{content:"4"}.board:not(.board_done) .board__tile_5:after{content:"5"}.board:not(.board_done) .board__tile_6:after{content:"6"}.board:not(.board_done) .board__tile_7:after{content:"7"}.board:not(.board_done) .board__tile_8:after{content:"8"}.board:not(.board_done) .board__tile_9:after{content:"9"}.board:not(.board_done) .board__tile_10:after{content:"10"}.board:not(.board_done) .board__tile_11:after{content:"11"}.board:not(.board_done) .board__tile_12:after{content:"12"}.board:not(.board_done) .board__tile_13:after{content:"13"}.board:not(.board_done) .board__tile_14:after{content:"14"}.board:not(.board_done) .board__tile_15:after{content:"15"}.board__tile{border-color:var(--tile-border-color);border-width:1px;overflow:hidden;position:relative}.board__tile:before{content:" ";height:var(--board-size);position:absolute;width:var(--board-size);background-size:100% 100%}.board__tile:after{color:var(--tile-number-color);left:calc(var(--board-size) / 50);position:absolute;text-shadow:black 2px 2px 2px;top:calc(var(--board-size) / 50)}.board__tile_1:before{left:0;top:0}.board__tile_2:before{left:-100%;top:0}.board__tile_3:before{left:-200%;top:0}.board__tile_4:before{left:-300%;top:0}.board__tile_5:before{left:0;top:-100%}.board__tile_6:before{left:-100%;top:-100%}.board__tile_7:before{left:-200%;top:-100%}.board__tile_8:before{left:-300%;top:-100%}.board__tile_9:before{left:0;top:-200%}.board__tile_10:before{left:-100%;top:-200%}.board__tile_11:before{left:-200%;top:-200%}.board__tile_12:before{left:-300%;top:-200%}.board__tile_13:before{left:0;top:-300%}.board__tile_14:before{left:-100%;top:-300%}.board__tile_15:before{left:-200%;top:-300%}.board__tile_16:before{left:-300%;top:-300%}.board__tile_1,.board__tile_5,.board__tile_9,.board__tile_13{border-left-color:var(--tile-border-color);border-left-style:solid}.board__tile_4,.board__tile_8,.board__tile_12,.board__tile_16{border-right-color:var(--tile-border-color);border-right-style:solid}.board__tile_1,.board__tile_2,.board__tile_3,.board__tile_4{border-top-color:var(--tile-border-color);border-top-style:solid}.board__tile_13,.board__tile_14,.board__tile_15,.board__tile_16{border-bottom-color:var(--tile-border-color);border-bottom-style:solid}.board__tile_1{border-top-left-radius:var(--tile-border-radius)}.board__tile_4{border-top-right-radius:var(--tile-border-radius)}.board__tile_13{border-bottom-left-radius:var(--tile-border-radius)}.board__tile_16{border-bottom-right-radius:var(--tile-border-radius)}.board .board__tile:before{background-image:var(--puzzle-image)}.board__info{background-color:#000000e6;border-bottom-left-radius:var(--tile-border-radius);border-bottom-right-radius:var(--tile-border-radius);border-color:var(--tile-border-color);border-style:solid;border-width:1px;bottom:var(--tile-gap);color:var(--tile-number-color);left:var(--tile-gap);padding:var(--tile-gap);position:absolute;right:var(--tile-gap);animation:board__info-slide-up .32s cubic-bezier(.2,.8,.2,1) both}@keyframes board__info-slide-up{0%{transform:translateY(calc(100% + var(--tile-gap)));opacity:0}to{transform:translateY(0);opacity:1}}.control-panel{align-items:center;background-image:url(data:image/webp;base64,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);border-radius:var(--board-radius);box-shadow:#333 2px 2px 5px;display:grid;grid-template-columns:1fr 1fr repeat(4,min-content);margin:.5rem auto;padding:calc(var(--tile-gap) / 2) var(--tile-gap);-webkit-user-select:none;user-select:none;width:var(--board-size);font-weight:700}.control-panel__button{border:0;color:inherit;font:inherit;padding:0;margin:0;background:transparent;line-height:normal;-webkit-font-smoothing:inherit;-moz-osx-font-smoothing:inherit;-webkit-appearance:none;min-width:1.5rem;text-align:center;display:flex}@media(hover:hover)and (pointer:fine){.control-panel__button:hover{text-shadow:black 1px 1px 2px}}.control-panel__button:active{transform:translate(2px,2px)}.about{background-color:#000000e6;border-radius:var(--board-radius);bottom:calc(-1 * var(--overflow));color:#ccc;cursor:pointer;display:flex;left:50%;padding:var(--tile-gap);position:absolute;top:calc(-1 * var(--overflow));transform:translate(-50%);width:calc(var(--board-size) + 2 * var(--overflow))}.about>.container{margin:auto;text-align:center;line-height:1.5}.help{background-color:#000000e6;border-radius:var(--board-radius);bottom:calc(-1 * var(--overflow));color:#ccc;cursor:pointer;display:flex;left:50%;padding:var(--tile-gap);position:absolute;top:calc(-1 * var(--overflow));transform:translate(-50%);width:calc(var(--board-size) + 2 * var(--overflow))}.rules{list-style:none}.rules__rule{position:relative;font-weight:700}.rules__rule:not(:last-child){margin-bottom:8px}.rules__icon{position:absolute;left:-32px;top:-2px}.help>.container{margin:auto;line-height:1.5}
