/* Pages de la plateforme [D-99] : accueil, compte, mes maisons, super-admin.
   Mêmes tokens que le jeu (style.css) ; seulement ce qui leur est propre. */

.accueil .titre { margin-bottom: 0; }
.sous-titre { margin: 0; text-align: center; color: var(--texte-doux); font-style: italic; }

/* Code de partie : grandes lettres espacées, lisibles à voix haute. */
.champ-code {
  width: 100%;
  min-width: 0;
  font-family: var(--police-capitales);
  /* Six lettres qui tiennent toujours dans la case, du petit téléphone à l'ordinateur. */
  font-size: clamp(1.5rem, 7.5vw, 2.2rem);
  letter-spacing: clamp(0.12em, 1.6vw, 0.3em);
  text-align: center;
  text-transform: uppercase;
  padding-inline: 0.4rem;
  text-indent: clamp(0.12em, 1.6vw, 0.3em); /* compense l'espacement de la dernière lettre */
}
.champ-code::placeholder { letter-spacing: 0.3em; opacity: 0.5; }
.code-soiree {
  font-family: var(--police-capitales);
  font-size: 2.6rem;
  letter-spacing: 0.3em;
  color: var(--laiton-clair);
  margin: 0;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.organiser { text-align: center; }
.organiser a, .lien { color: var(--laiton-clair); }

/* Onglets connexion / création de compte. */
.onglets { display: flex; gap: 0.5rem; }
.onglets button { flex: 1; }
.onglets button[aria-selected="true"] { background: linear-gradient(#e2c98f, var(--laiton)); color: var(--nuit); }

/* Mes maisons */
.maison { display: grid; gap: 0.75rem; }
.maison-tete { display: flex; justify-content: space-between; align-items: baseline; gap: 0.75rem; flex-wrap: wrap; }
.maison-nom { margin: 0; font-family: var(--police-titre); font-style: italic; font-size: 1.6rem; color: var(--texte); }
.actions { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.actions > * { flex: 1 1 10rem; text-align: center; text-decoration: none; }
.case { display: flex; align-items: center; gap: 0.6rem; cursor: pointer; color: var(--texte-doux); }
.case input { width: 1.3rem; height: 1.3rem; min-height: 0; flex: none; }
.soiree { display: grid; gap: 0.5rem; padding: 0.9rem; border: 1px dashed var(--laiton-voile); border-radius: 0.4rem; }
.confirmer { display: grid; gap: 0.5rem; padding: 0.75rem; border: 1px solid var(--danger); border-radius: 0.4rem; }
.barre-compte { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; flex-wrap: wrap; }

/* Super-admin : des listes simples. */
.liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; }
.liste li { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; flex-wrap: wrap; padding: 0.5rem 0; border-bottom: 1px solid var(--bordure); }
.liste li:last-child { border-bottom: 0; }
.copie { font-family: ui-monospace, Menlo, monospace; font-size: 0.85rem; word-break: break-all; user-select: all; background: var(--nuit); padding: 0.4rem 0.5rem; border-radius: 0.3rem; border: 1px solid var(--bordure); }

/* Rien ne doit élargir la page au-delà de l'écran du téléphone (le champ de fichier a une largeur
   minimale propre au navigateur). */
.page.ecran > *, .pile > *, .champ > * { min-width: 0; }
input[type="file"] { width: 100%; max-width: 100%; font-size: 0.9rem; }
#email { overflow-wrap: anywhere; }

select { font: inherit; color: var(--texte); background: var(--nuit); border: 1px solid var(--laiton-voile); border-radius: 0.2rem; padding: 0.6rem 0.8rem; min-height: 3rem; width: 100%; }
