/* Styles du Simon */
.tableau-bord { display: flex; justify-content: space-around; font-size: 24px; font-weight: bold; margin-bottom: 12px; }

.simon {
  position: relative;
  width: min(360px, 90vw);
  aspect-ratio: 1;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.pad {
  border: none;
  cursor: pointer;
  opacity: 0.35;                    /* éteint */
  transition: opacity 0.1s, box-shadow 0.1s;
}
.pad.rose  { background: #ff3df2; border-radius: 100% 0 0 0; }
.pad.bleu  { background: #2fd4ff; border-radius: 0 100% 0 0; }
.pad.jaune { background: #ffd23f; border-radius: 0 0 0 100%; }
.pad.vert  { background: #3ddc84; border-radius: 0 0 100% 0; }
.pad.allume { opacity: 1; box-shadow: 0 0 40px currentColor; }
.pad.rose.allume  { color: #ff3df2; }
.pad.bleu.allume  { color: #2fd4ff; }
.pad.jaune.allume { color: #ffd23f; }
.pad.vert.allume  { color: #3ddc84; }

.centre {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 34%;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 4px solid var(--violet);
  background: #0b0820;
  color: var(--texte);
  font-size: clamp(14px, 4vw, 20px);
  font-weight: bold;
  cursor: pointer;
}
.message-simon { text-align: center; font-size: 22px; font-weight: bold; min-height: 32px; }