body{margin:0;padding:0;background-color:#ccc;font-family:Open Sans,sans-serif;font-optical-sizing:auto;font-weight:400;font-style:normal;-webkit-user-select:none;user-select:none;overflow:hidden}*,*:before,*:after{box-sizing:border-box}.preview{position:absolute;right:8px;top:8px;width:50px;height:70px;z-index:10;background-color:#eee;border-radius:8px;background-size:cover;box-shadow:0 0 8px #00000080;transition:width .3s,height .3s}.preview.zoomed{width:200px;height:280px}main{display:flex;flex-direction:column;justify-content:center;gap:32px;align-items:center;height:100vh}main a{display:block;padding:8px 24px;font-size:18px;line-height:25px;background-color:#666;color:#fff;text-decoration:none;border-radius:16px}.grid{position:relative;width:280px;height:392px}.grid span{position:absolute;display:block;width:56px;height:56px;z-index:1;transition:box-shadow .3s,left .3s,top .3s}.grid span.wrong{box-shadow:inset 0 0 12px #ff0000bf}.grid span.dragging{z-index:2;box-shadow:0 0 8px #00000080;transition:box-shadow .3s}