.options-jeu { margin: 18px 0 6px; text-align: left; }
.btn-options { font-size: 0.85rem; }
.panneau-options {
  margin-top: 10px; padding: 12px 14px;
  background: var(--surface-2); border: 1px solid var(--line-forte); border-radius: 8px;
  color: var(--texte); font-size: 0.88rem;
  display: grid; gap: 10px;
}
.panneau-options[hidden] { display: none; }
.option-ligne { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.option-ligne input, .option-dos input { accent-color: var(--color-dark); width: 16px; height: 16px; }
.option-dos { border: 0; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; }
.option-dos legend { font-weight: 600; margin-bottom: 4px; padding: 0; }
.option-dos label { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; }
.pastille-dos { display: inline-block; width: 14px; height: 20px; border-radius: 3px; border: 1px solid rgba(255, 255, 255, 0.3); }
.dos-bleu { background: linear-gradient(145deg, #4338ca, #3730a3); }
.dos-rouge { background: linear-gradient(145deg, #b91c1c, #7f1d1d); }
.dos-vert { background: linear-gradient(145deg, #15803d, #14532d); }
.dos-noir { background: linear-gradient(145deg, #3f3f46, #18181b); }
#btn-plein-ecran { justify-self: start; }
.aide-clavier ul { margin: 6px 0 0; padding-left: 18px; line-height: 1.6; }
.aide-clavier kbd {
  display: inline-block; min-width: 1.4em; padding: 0 4px; text-align: center;
  border: 1px solid var(--line-forte); border-radius: 4px; background: var(--surface-1, rgba(0, 0, 0, 0.2));
  font: inherit; font-size: 0.8rem;
}


html[data-dos="rouge"] .card.face-down { background: linear-gradient(145deg, #b91c1c, #7f1d1d); border-color: rgba(248, 113, 113, 0.5); }
html[data-dos="vert"] .card.face-down { background: linear-gradient(145deg, #15803d, #14532d); border-color: rgba(74, 222, 128, 0.45); }
html[data-dos="noir"] .card.face-down { background: linear-gradient(145deg, #3f3f46, #18181b); border-color: rgba(161, 161, 170, 0.45); }


html.opt-gaucher .top-row { flex-direction: row-reverse; }
html.opt-gaucher .stock-waste { flex-direction: row-reverse; }


.clavier-focus { outline: 3px solid #facc15; outline-offset: 2px; z-index: 900; }
.card.clavier-focus { box-shadow: 0 0 0 3px #facc15, 0 0 14px rgba(250, 204, 21, 0.6); outline: none; }
.clavier-focus:focus { outline-color: #facc15; }


html:fullscreen, html:fullscreen body { overflow-y: auto; }