/* Clap — feuille de style de base. Le design général est une tâche à part. */
:root {
  --fond: #faf8f4;
  --texte: #1f1d1a;
  --discret: #6b665e;
  --accent: #8a3b12;
  --carte: #ffffff;
  --bord: #e4dfd6;
  --largeur: 40rem;
}
@media (prefers-color-scheme: dark) {
  :root {
    --fond: #171614;
    --texte: #ece8e1;
    --discret: #a39d93;
    --accent: #e39a6b;
    --carte: #22201d;
    --bord: #3a3732;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--fond);
  color: var(--texte);
  font: 1.0625rem/1.6 Georgia, "Times New Roman", serif;
}
main { max-width: var(--largeur); margin: 0 auto; padding: 1rem 1rem 4rem; }
a { color: var(--accent); }
.entete { border-bottom: 1px solid var(--bord); padding: .75rem 1rem; }
.marque { font-weight: bold; font-size: 1.25rem; text-decoration: none; color: var(--texte); }
.marque span { font-weight: normal; font-style: italic; color: var(--discret); margin-left: .4rem; }
.chapeau, .mention-ia, .a-venir { color: var(--discret); }
.mention-ia { font-size: .9rem; font-style: italic; }
.carte { background: var(--carte); border: 1px solid var(--bord); border-radius: .5rem; padding: 1.25rem; margin: 1.5rem 0; }
.etroite { max-width: 26rem; margin-inline: auto; }
form label { display: block; margin: .75rem 0 .25rem; }
input[type=text], input[type=password] { width: 100%; padding: .5rem; font: inherit; border: 1px solid var(--bord); border-radius: .3rem; background: var(--fond); color: var(--texte); }
fieldset { border: 1px solid var(--bord); border-radius: .4rem; margin: 1rem 0; }
button, .bouton { display: inline-block; font: inherit; background: var(--accent); color: #fff; border: 0; border-radius: .3rem; padding: .55rem 1.1rem; text-decoration: none; cursor: pointer; margin-top: .75rem; }
.erreur { color: #b3261e; }
.recueil { padding-left: 1.5rem; }
.recueil li { margin: .4rem 0; }
.recueil a { display: flex; justify-content: space-between; gap: 1rem; text-decoration: none; }
.recueil .nb { color: var(--discret); font-size: .9rem; white-space: nowrap; }
.langues { display: flex; gap: .75rem; margin-bottom: 1rem; }
.langues a[aria-current] { font-weight: bold; text-decoration: none; color: var(--texte); }
.corps { font-size: 1.15rem; }
.texte-a-lire { background: var(--carte); border-left: 3px solid var(--accent); padding: .5rem 1rem; }
.lectures audio { width: 100%; }
.liste-lectures { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.liste-lectures button { margin: 0; background: transparent; color: var(--accent); border: 1px solid var(--accent); }
.liste-lectures button[aria-pressed=true] { background: var(--accent); color: #fff; }
.tableau { width: 100%; border-collapse: collapse; font-size: .95rem; }
.tableau th, .tableau td { border-bottom: 1px solid var(--bord); padding: .4rem; text-align: left; }
/* Textes : sous-parties, voix, deux colonnes (voir docs/format-textes.md) */
.serie { color: var(--discret); margin: 0; }
.recueil-serie { font-size: 1.1rem; margin: 1.5rem 0 .25rem; color: var(--discret); }
.corps .sous-partie { font-size: 1rem; text-align: center; letter-spacing: .1em; margin: 1.5rem 0 .5rem; }
.corps .colonnes { display: grid; grid-template-columns: 1fr 1fr; column-gap: 1.5rem; margin: 1rem 0; }
.corps .colonne.gauche { grid-column: 1; }
.corps .colonne.droite { grid-column: 2; }
.corps .colonne p { margin: 0 0 .75rem; }
@media (max-width: 40rem) {
  .corps .colonnes { grid-template-columns: 1fr; }
  .corps .colonne.gauche, .corps .colonne.droite { grid-column: 1; padding-left: .75rem; }
  .corps .colonne.gauche { border-left: 3px solid var(--bord); }
  .corps .colonne.droite { border-left: 3px solid var(--accent); }
}
.recueil { list-style: none; padding-left: 0; }