.gsokoban-stage{justify-content:center;display:flex}.g-play.is-side .gsokoban-stage{flex:none}.gsokoban-grid{--cols:8;--cell:34px;--ol:max(1.5px, calc(var(--cell) * .05));grid-template-columns:repeat(var(--cols), var(--cell));-webkit-user-select:none;user-select:none;touch-action:none;-webkit-tap-highlight-color:transparent;background:#5e534c;border:3px solid #2b2420;border-radius:12px;width:max-content;padding:3px;display:grid;box-shadow:0 5px #3e3530,0 9px 16px #2b242033}.gsokoban-cell{width:var(--cell);height:var(--cell);position:relative}.gsokoban-cell.is-wall{box-shadow:inset 0 calc(var(--cell) * .07) 0 #ffffff1f, inset 0 calc(var(--cell) * -.08) 0 #00000038;background-color:#74675e;background-image:linear-gradient(#0000 0 47%,#3d342e 47% 53%,#0000 53% 100%),linear-gradient(90deg,#3d342e 0 5%,#0000 5% 100%),linear-gradient(90deg,#0000 0 47%,#3d342e 47% 53%,#0000 53% 100%);background-position:0 0,0 0,0 100%;background-repeat:no-repeat;background-size:100% 100%,100% 50%,100% 50%}.gsokoban-cell.is-floor{box-shadow:inset 0 0 0 1px #785f461f, inset 0 calc(var(--cell) * .05) 0 #ffffff8c;background:#f4ecde}.gsokoban-cell.is-goal{background:#fbe3d0}.gsokoban-cell.is-goal:after{content:"";box-sizing:border-box;border:var(--ol) solid #2b2420;background:radial-gradient(circle, #fff 0 22%, var(--brand,#e0562b) 24% 100%);width:34%;height:34%;box-shadow:0 calc(var(--cell) * .03) 0 #2b24202e;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.gsokoban-cell.is-box:before{content:"";z-index:1;box-sizing:border-box;border:var(--ol) solid #2b2420;box-shadow:inset 0 0 0 calc(var(--cell) * .07) #c46a2a, inset 0 calc(var(--cell) * -.1) 0 #a9561d, 0 calc(var(--cell) * .04) 0 #2b24204d;background:radial-gradient(14% 7% at 26% 18%,#ffffffe6 0 90%,#0000 100%),linear-gradient(45deg,#0000 0 45%,#7a3c1273 45% 55%,#0000 55% 100%),#e38b45;border-radius:16%;transition:background-color .15s;position:absolute;top:8%;bottom:6%;left:8%;right:8%}.gsokoban-cell.is-box:after{display:none}.gsokoban-cell.is-box-done:before{box-shadow:inset 0 0 0 calc(var(--cell) * .07) #559a3d, inset 0 calc(var(--cell) * -.1) 0 #427f2e, 0 calc(var(--cell) * .04) 0 #2b24204d;background:radial-gradient(14% 7% at 26% 18%,#ffffffe6 0 90%,#0000 100%),radial-gradient(circle at 50% 46%,#fff 0 9%,#0000 10%),#78b85a;animation:.24s ease-out gsokoban-done}@keyframes gsokoban-done{0%{transform:scale(1)}45%{transform:scale(1.12)}to{transform:scale(1)}}.gsokoban-cell.is-player:before{content:"";z-index:3;box-sizing:border-box;border:var(--ol) solid #2b2420;width:40%;height:40%;box-shadow:inset 0 calc(var(--cell) * .09) 0 #3b5fa8;background:radial-gradient(22% 14% at 32% 28%,#ffffffe6 0 90%,#0000 100%),#ffd6a8;border-radius:50%;position:absolute;top:10%;left:50%;transform:translate(-50%)}.gsokoban-cell.is-player:after{content:"";z-index:2;box-sizing:border-box;border:var(--ol) solid #2b2420;width:58%;height:44%;box-shadow:inset 0 calc(var(--cell) * -.07) 0 #2f63a8, 0 calc(var(--cell) * .035) 0 #2b242040;background:#4a86d4;border-radius:48% 48% 30% 30%;display:block;position:absolute;top:44%;left:50%;transform:translate(-50%)}.gsokoban-cell.is-player-goal{background:#f8d6bb}.gsokoban-cell.is-hint{z-index:3;box-shadow:inset 0 0 0 max(2px, calc(var(--cell) * .08)) #e0b200, 0 0 8px #e0b2008c}.gsokoban .g-dpad{margin-top:14px}.gsokoban .g-dpad-btn.is-hint{color:#6a4600;background:#ffe36b;border-color:#b88a00;box-shadow:inset 0 -4px #d6aa12,0 3px #2b2420,0 0 0 4px #e0b20059}.gsokoban .g-stat{min-width:56px}@media (max-width:480px){.gsokoban-grid{padding:1px}}@media (prefers-reduced-motion:reduce){.gsokoban-cell.is-box-done:before{animation:none}}.gsokoban-grid.is-art{background:#3d342e}.gsokoban-grid.is-art .gsokoban-cell.is-floor,.gsokoban-grid.is-art .gsokoban-cell.is-wall{--ts:calc(var(--cell) * 4);background:url(/img/sokoban/floor-1.webp) calc(var(--x,0) * var(--cell) * -1) calc(var(--y,0) * var(--cell) * -1) / var(--ts) var(--ts) repeat;box-shadow:inset 0 0 0 .5px #785f4647,inset 1px 1px #ffffff59}.gsokoban-grid.is-art .gsokoban-cell.is-floor.is-v2{background-image:url(/img/sokoban/floor-2.webp)}.gsokoban-grid.is-art .gsokoban-cell.is-wall{box-shadow:none;background-image:url(/img/sokoban/wall.webp)}.gsokoban-grid.is-art .gsokoban-cell.is-goal:after{width:84%;height:84%;box-shadow:none;background:url(/img/sokoban/atlas.webp) 66.667% 0/400% 100% no-repeat;border:0;border-radius:0;display:block;top:8%;left:8%;transform:none}.gsokoban-grid.is-art .gsokoban-cell.is-box:before{box-shadow:none;filter:drop-shadow(0 calc(var(--cell) * .05) 0 #2b242059);background:url(/img/sokoban/atlas.webp) 0 0/400% 100% no-repeat;border:0;border-radius:0;top:3%;bottom:5%;left:3%;right:3%}.gsokoban-grid.is-art .gsokoban-cell.is-box-done:before{box-shadow:none;background-position:33.333% 0}.gsokoban-grid.is-art .gsokoban-cell.is-box:after{display:none}.gsokoban-grid.is-art .gsokoban-cell.is-player:before{width:90%;height:90%;transform:rotate(var(--face,0deg));box-shadow:none;filter:drop-shadow(0 calc(var(--cell) * .04) 0 #2b24204d);background:url(/img/sokoban/atlas.webp) 100% 0/400% 100% no-repeat;border:0;border-radius:0;top:5%;left:5%}.gsokoban-grid.is-art .gsokoban-cell.is-player:not(.is-goal):after{display:none}.gsokoban-grid.is-art .gsokoban-cell.is-hint{box-shadow:inset 0 0 0 max(2px, calc(var(--cell) * .08)) #e0b200, 0 0 8px #e0b2008c}.is-fs .gsokoban>.g-cloud{display:none}