#gamesPanel{display:none;margin:10px;padding:10px 12px;border:1px solid rgba(255,215,0,.35);border-radius:14px;background:rgba(0,0,0,.35)}
#gamesPanel.open{display:block}
#gamesPanel .gp-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
#gamesPanel .gp-title{font-weight:800}
#gamesPanel .gp-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
#gamesPanel select,#gamesPanel input{padding:8px 10px;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.35);color:#fff}
#gamesPanel button{padding:8px 10px;border-radius:10px;border:1px solid rgba(255,215,0,.35);background:rgba(0,0,0,.35);color:#fff;cursor:pointer}
#gamesPanel button:hover{box-shadow:0 0 12px rgba(255,215,0,.22)}
#gamesPanel .gp-status{font-size:12px;opacity:.85}
#gamesPanel .gp-grid{display:grid;gap:8px;margin-top:10px}
#gamesPanel .gp-cell{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:10px;border:1px solid rgba(255,255,255,.15);font-weight:800;text-transform:uppercase}
#gamesPanel .ok{background:rgba(0,255,0,.20);border-color:rgba(0,255,0,.35)}
#gamesPanel .present{background:rgba(255,215,0,.20);border-color:rgba(255,215,0,.35)}
#gamesPanel .nope{background:rgba(255,0,0,.12);border-color:rgba(255,0,0,.25)}

#gamesPanel .gp-motus-row{display:grid;grid-template-columns:repeat(5,34px);gap:6px}

.gp-toast{
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 99999;
  max-width: min(420px, 92vw);
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(0,0,0,.86);
  border: 1px solid rgba(255,215,0,.55);
  color:#fff;
  opacity:0;
  transform: translateY(10px);
  transition: opacity .2s, transform .2s;
  box-shadow: 0 0 18px rgba(255,215,0,.18);
}
.gp-toast.show{ opacity:1; transform: translateY(0); }

/* --- Style amélioré (moins "écran vert") --- */
#gamesPanel{
  background: rgba(20, 22, 28, 0.85);
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: 0 10px 26px rgba(0,0,0,0.35);
}

#gamesPanel .gp-header{
  background: rgba(255,255,255,0.06);
  border-bottom: 1px solid rgba(255,255,255,0.10);
}

#gamesPanel .gp-title{
  color: #fff;
  text-shadow: 0 2px 8px rgba(0,0,0,0.35);
}

#gamesPanel select, #gamesPanel input{
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.14);
}

#gamesPanel .gp-motus-row{ grid-template-columns: repeat(5, 40px); }
#gamesPanel .gp-cell{ width:40px; height:40px; border-radius:12px; }

#gamesPanel .gp-box, #gamesPanel .gp-line, #gamesPanel .gp-scores{
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.10);
}

#gamesPanel .chip{
  border: 1px solid rgba(255,255,255,0.16);
}

/* --- Thème demandé: fond noir + vert fluo + accents jaune --- */
#gamesPanel{
  background: rgba(0,0,0,0.92) !important;
  border: 1px solid rgba(255,215,0,0.55) !important;
}
#gamesPanel, #gamesPanel *{
  color: #39FF14;
}
#gamesPanel .gp-title{
  color: #FFD700 !important;
}
#gamesPanel select, #gamesPanel input{
  color: #39FF14;
  background: rgba(0,0,0,0.75);
  border: 1px solid rgba(255,215,0,0.35);
}
#gamesPanel button{
  border: 1px solid rgba(255,215,0,0.55);
}
#gamesPanel .gp-cell{
  border: 1px solid rgba(255,215,0,0.25);
}
#gamesPanel .gp-cell.present{ background: rgba(255,215,0,0.75); color:#000; }
#gamesPanel .gp-cell.correct{ background: rgba(46,204,113,0.78); color:#000; }
#gamesPanel .gp-cell.absent{ background: rgba(40,40,40,0.75); }

/* Fix lisibilité chips (Mot caché) */
#gamesPanel .chip.well{ color:#33ff66 !important; border-color: rgba(51,255,102,.55) !important; background: rgba(0,0,0,.25) !important; }
#gamesPanel .chip.present{ color:#FFD700 !important; border-color: rgba(255,215,0,.55) !important; background: rgba(0,0,0,.25) !important; }
#gamesPanel .gp-line .guess{ color:#33ff66; }

/* Modal fin de partie */
#gamesPanel .gp-modal{
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(3px);
}
#gamesPanel .gp-modal-card{
  width: min(420px, 92vw);
  border-radius: 18px;
  padding: 14px 14px 12px;
  border: 1px solid rgba(255,215,0,.40);
  background: rgba(0,0,0,.86);
  box-shadow: 0 16px 40px rgba(0,0,0,.55);
}
#gamesPanel .gp-modal-title{
  font-weight: 900;
  font-size: 18px;
  color: #FFD700;
  margin-bottom: 8px;
}
#gamesPanel .gp-modal-body .m-line{ padding: 6px 0; border-bottom: 1px dashed rgba(255,255,255,.10); }
#gamesPanel .gp-modal-body .m-line:last-child{ border-bottom:none; }
#gamesPanel .gp-modal-btn{
  margin-top: 10px;
  width: 100%;
  border-radius: 14px;
  padding: 10px 12px;
  border: 1px solid rgba(255,215,0,.45);
  background: rgba(255,215,0,.12);
  color: #33ff66;
  font-weight: 900;
  cursor: pointer;
}

/* Timer */
#gamesPanel .gp-timer{
  margin-left: auto;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,215,0,.45);
  background: rgba(0,0,0,.35);
  color: #33ff66;
  font-weight: 900;
}

/* Motus variable length layout */
#gamesPanel #gpGrid{ --cell: 40px; }
#gamesPanel .gp-motus-row{ display:grid; gap:6px; margin:6px 0; width:fit-content; max-width:100%; }
#gamesPanel .gp-cell{ width: var(--cell,40px); height: var(--cell,40px); line-height: var(--cell,40px); }
#gamesPanel #gpLen{ min-width:46px; }

/* Keep 6-8 letters on one line: allow horizontal scroll instead of wrap */
#gamesPanel #gpGrid{
  overflow-x: auto;
  overflow-y: hidden;
}
#gamesPanel .gp-motus-row{
  display: grid !important;
  grid-auto-flow: column;
}