.simon-board {
  position: relative;
  width: min(300px, 92vw);
  height: min(300px, 92vw);
  border-radius: 50%;
  background: #120e0b;
  box-shadow: var(--shadow-lg), 0 0 0 4px rgba(255,255,255,0.08);
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 8px;
  padding: 8px;
  overflow: hidden;
}

.simon-btn {
  border: none;
  cursor: pointer;
  opacity: 0.75;
  transition: transform .1s, filter .1s, opacity .1s;
}
.simon-btn:nth-child(1) { border-radius: 100% 0 0 0; background: #4caf50; }
.simon-btn:nth-child(2) { border-radius: 0 100% 0 0; background: #f44336; }
.simon-btn:nth-child(3) { border-radius: 0 0 0 100%; background: #ffeb3b; }
.simon-btn:nth-child(4) { border-radius: 0 0 100% 0; background: #2196f3; }
.simon-btn.lit { opacity: 1; filter: brightness(1.5) drop-shadow(0 0 12px currentColor); transform: scale(1.03); }
.simon-btn:disabled { cursor: default; }

.simon-center {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 30%; height: 30%;
  background: radial-gradient(circle at 40% 35%, #3a2a20, #0e0a06);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  z-index: 2;
}

.simon-status {
  font-size: 12px;
  font-weight: 700;
  color: #948781;
  text-align: center;
  line-height: 1.4;
}
