Strange formatting with small boards

[jacksonthall22]

This is a strange one - I am trying to include a small diagram on my site and the position of both the piece and board sizes seems to be off:

However, when I toggle the orientation by calling cg.set({ orientation: 'black' }) on the instance bound to this on the component, the problem seems to go away (see below - the cg-board still does not fill the full height/width of the cg-wrap element, but not sure if this might be intended behavior). It does not fix itself if I update other config options, ex. cg.set({ fen: '...' }).

This led me to think that as a workaround, I could just wait for the component to be mounted by subscribing to the cg element bound to this on the component (to see when it becomes not undefined), then toggle the orientation twice, but that doesn't work either (this one really confuses me):

<script>
  //...

  let cg: Chessground
  let myConfig: Config = {
    // I set nearly every option explicitly here
  }

  $: if (cg !== undefined) {
    const currentOrientation = cg.getState().orientation;
    cg.set({
      ...previewGame.cgConfig,
      orientation: originalOrientation === 'white' ? 'black': 'white',
    })
  }
</script>

<div>
<Chessground bind:this={cg} config={ />

I tried looking into the code a bit to see what's going on in set(), but I don't quite understand it. Happy to provide more info to help resolve it, thanks!