/* Onglets « Catalogue des objets » / « Corps humain », communs à vision3d.html et corps.html */
.choix-vue { display: flex; gap: 4px; width: fit-content; margin: 10px 12px; padding: 4px; border-radius: 999px;
  background: rgba(255, 255, 255, .045); border: 1px solid rgba(255, 255, 255, .12); }
.choix-vue a { padding: .4em 1.1em; border-radius: 999px; color: #aebdd6; text-decoration: none; font: 600 .88rem "Inter", "Segoe UI", system-ui, sans-serif; white-space: nowrap; }
.choix-vue a:hover { color: #e8eef9; }
.choix-vue a[aria-current="page"] { background: linear-gradient(135deg, #a3e635, #16a34a); color: #04140b; }
.choix-vue a:focus-visible { outline: 2px solid #fbbf24; outline-offset: 2px; }
/* Ligne des onglets avec un élément au centre (bouton « 1 écran / 2 écrans » du catalogue, barre des systèmes
   du corps humain) : onglets à gauche, centre au milieu, « Crédits » à droite ; sur téléphone, le centre passe dessous */
.ligne-vue.a-centre { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; margin: 10px 12px; }
.ligne-vue.a-centre > :first-child { justify-self: start; margin: 0; }
.ligne-vue.a-centre > .btn-credits { justify-self: end; grid-column: 3; }
@media (max-width: 760px) {
  .ligne-vue.a-centre { grid-template-columns: 1fr auto; }
  .ligne-vue.a-centre > .btn-credits { grid-column: 2; grid-row: 1; }
  .ligne-vue.a-centre > :nth-child(2):not(.btn-credits) { grid-column: 1 / -1; grid-row: 2; justify-self: center; max-width: 100%; }
}
/* centre large (barre des systèmes du corps humain) : passe dessous plus tôt */
@media (max-width: 1250px) {
  .ligne-vue.a-centre.large { grid-template-columns: 1fr auto; }
  .ligne-vue.a-centre.large > .btn-credits { grid-column: 2; grid-row: 1; }
  .ligne-vue.a-centre.large > :nth-child(2):not(.btn-credits) { grid-column: 1 / -1; grid-row: 2; justify-self: center; max-width: 100%; }
}