.game-area {
  padding: 8px 14px;
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #14161b;
}

#board-svg {
  width: 100%;
  max-width: 340px;
  aspect-ratio: 340 / 360;
  touch-action: none;
}

.board-bg { fill: #1b1e24; stroke: #3a4250; stroke-width: 2; }
.peg { fill: #575c64; stroke: #2a2d33; stroke-width: 1.5; }
.peg.occupied { fill: #d8a94a; }

.sensor { fill: none; stroke: #2f6b41; stroke-width: 2; }
.sensor.active { stroke: #4caf6b; fill: rgba(76,175,107,0.25); filter: drop-shadow(0 0 5px rgba(76,175,107,0.7)); }

.forbidden-zone { fill: rgba(192,57,43,0.15); stroke: #8a2c22; stroke-width: 1.5; stroke-dasharray: 3 3; }
.forbidden-zone.breach { fill: rgba(192,57,43,0.5); stroke: #c0392b; }

.wire-anchor { fill: #9aa0aa; stroke: #40444c; stroke-width: 1.5; }
.wire-line { stroke-width: 3; stroke-linecap: round; fill: none; }
.wire-line.W1 { stroke: #ff5c5c; }
.wire-line.W2 { stroke: #4da3ff; }
.wire-line.W3 { stroke: #4fd17a; }
.wire-line.breach { stroke: #c0392b !important; }
.wire-end-handle { fill: #e8e2d0; stroke: #40444c; stroke-width: 1.5; cursor: grab; touch-action: none; }
.wire-end-handle:active { cursor: grabbing; }

.collision-debug { stroke: #ffb84d; stroke-width: 1; stroke-dasharray: 2 2; opacity: 0.7; fill: none; }
.reward-digit { fill: #4caf6b; font-size: 60px; font-weight: bold; opacity: 0.9; }