#stage.pm-stage {
  width: min(100%, 520px, calc((100svh - 11rem) * 116 / 124));
  aspect-ratio: 116 / 124;
  padding: 0.55rem;
  box-sizing: border-box;
}

#board-svg {
  width: 100%;
  height: 100%;
  display: block;
}

.hud select {
  background: var(--panel);
  color: var(--paper);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0.2rem 0.35rem;
  font: inherit;
  margin-left: 0.35rem;
}

.pm-edge {
  stroke: rgba(242, 240, 234, 0.22);
  stroke-width: 0.8;
  stroke-linecap: butt;
  pointer-events: none;
}
:root[data-theme="light"] .pm-edge,
:root[data-theme="light"] .pm-node {
  stroke: rgba(28, 30, 24, 0.35);
}

.pm-node {
  fill: var(--board);
  stroke: rgba(242, 240, 234, 0.35);
  stroke-width: 0.6;
  pointer-events: none;
}

.pm-hit {
  fill: transparent;
  stroke: none;
  cursor: pointer;
}

.pm-piece {
  pointer-events: none;
  font-size: 8px;
  text-anchor: middle;
  dominant-baseline: central;
}

.pm-selected,
.pm-node.your-turn,
.pm-node.hint {
  stroke: var(--acid);
  stroke-width: 1.3;
}

.pm-live {
  filter: drop-shadow(0 0 0.6px #c8f542);
}
