.sl-board{--n:4;aspect-ratio:1;border:2px solid var(--line-strong);background:var(--panel);-webkit-user-select:none;user-select:none;border-radius:8px;width:min(100%,440px);margin:0 auto;padding:4px;position:relative;container-type:inline-size}.sl-tile{width:calc((100% - 8px) / var(--n));height:calc((100% - 8px) / var(--n));transform:translate(calc(var(--c,0) * 100%), calc(var(--r,0) * 100%));background:0 0;border:0;border-radius:0;padding:3px;transition:transform .12s ease-out;position:absolute;top:4px;left:4px}.sl-tile span{border:1px solid var(--border);background:var(--accent-soft);width:100%;height:100%;color:var(--text);font-weight:700;font-size:calc(100cqw / var(--n) * .36);font-variant-numeric:tabular-nums;border-radius:6px;justify-content:center;align-items:center;display:flex}.sl-board.no-anim .sl-tile{transition:none}.sl-tile:hover span{border-color:var(--accent)}.sl-tile.home span{background:var(--ok-soft);color:var(--ok)}.sl-board.solved{border-color:var(--ok)}.sl-board.solved .sl-tile span{background:var(--ok-soft);color:var(--ok);border-color:var(--ok)}
