:root { --fond:#14122b; --carte:#221f45; --accent:#ffb703; --ok:#2ecc71; --ko:#e74c3c; --texte:#fff; }
* { box-sizing:border-box; }
body { margin:0; font-family:system-ui,sans-serif; background:var(--fond); color:var(--texte);
  min-height:100vh; padding:env(safe-area-inset-top) 12px env(safe-area-inset-bottom); text-align:center; }
h1 { margin:20px 0 10px; }
button, select, input[type=text] { font:inherit; border-radius:12px; border:0; padding:12px 16px; margin:4px; }
button { background:var(--accent); color:#222; font-weight:700; cursor:pointer; }
button:active { transform:scale(.97); }
button.mini { padding:6px 12px; }
.modes { border:0; display:flex; justify-content:center; gap:10px; }
.modes label { background:var(--carte); padding:12px 18px; border-radius:12px; cursor:pointer; }
.grille { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:10px; max-width:700px; margin:20px auto; }
.grille button { background:var(--carte); color:var(--texte); padding:20px 10px; font-size:1.1rem; }
.grille small { display:block; font-weight:400; opacity:.7; margin-top:4px; }
.discret { opacity:.6; font-size:.9rem; }

header { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:8px 0; }
#consigne { font-size:1.1rem; opacity:.85; margin:6px 0; }
#media { min-height:200px; display:flex; align-items:center; justify-content:center; margin:8px 0; }
#media img { max-width:100%; max-height:55vh; border-radius:12px; background:#fff; }
#media audio { width:100%; max-width:500px; }
#media .texte { font-size:1.6rem; background:var(--carte); padding:24px; border-radius:16px; max-width:700px; }
#reponse { font-size:1.6rem; font-weight:800; color:var(--accent); margin:10px 0; }
.retour { min-height:1.6em; font-weight:700; }
.retour.ok { color:var(--ok); } .retour.ko { color:var(--ko); }
#form-solo { display:flex; gap:6px; max-width:500px; margin:0 auto; }
#form-solo input { flex:1; min-width:0; }
.ko-anim { animation:secoue .3s; }
@keyframes secoue { 25%{transform:translateX(-8px)} 75%{transform:translateX(8px)} }

#ctrl-pleniere { display:none; }
body.pleniere #ctrl-solo, body.pleniere #score-solo { display:none; }
body.pleniere #ctrl-pleniere { display:block; }
.ligne { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:6px; }
#chrono { font-size:2.4rem; font-weight:800; min-width:3ch; }
#chrono.fini { color:var(--ko); animation:secoue .4s 3; }
.grille-equipes { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:14px; }
.equipe { background:var(--carte); border-radius:14px; padding:10px 14px; min-width:120px; }
.equipe input { background:transparent; color:var(--texte); border:0; text-align:center; width:100%; font-weight:700; }
.equipe .pts { font-size:2rem; font-weight:800; }

/* Plénière : tout en grand pour le vidéoprojecteur */
@media (min-width:900px) {
  body.pleniere #consigne { font-size:1.8rem; }
  body.pleniere #media img { max-height:60vh; }
  body.pleniere #reponse { font-size:2.8rem; }
  body.pleniere #media .texte { font-size:2.6rem; }
}
