.jg-board {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px;
  width: min(80vw, 300px); aspect-ratio: 1 / 1;
  background: #0f1b2d; border: 3px solid #2b3f5c; border-radius: 10px; padding: 3px;
}
.jg-slot {
  background: #16263c; border-radius: 4px; position: relative;
  display: grid; place-items: center;
}
.jg-slot.over { outline: 2px dashed #ffd93d; }
.jg-piece, .jg-slot .jg-piece {
  width: 100%; height: 100%; border-radius: 4px; cursor: grab;
  touch-action: none; user-select: none; -webkit-user-select: none;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.15);
}
.jg-piece.sel { outline: 3px solid #ffd93d; }
.jg-piece.placed { cursor: default; }
.jg-tray {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px;
  max-width: 320px; margin-left: auto; margin-right: auto; min-height: 54px;
}
.jg-tray .jg-piece { aspect-ratio: 1 / 1; }