/* =========================================================
   La puissance motrice du feu — feuille de style commune
   Ambiance « matin dans la campagne anglaise » : ciel clair,
   prairies, laiton patiné, encre sépia
   ========================================================= */

:root {
  --encre:       #2c2416;
  --encre-douce: #5a4a33;
  --laiton:      #b8862f;
  --laiton-clair:#e2c27a;
  --laiton-sombre:#7a5420;
  --brique:      #9a5a40;
  --bois:        #a77b4f;
  --bois-sombre: #6e4c2c;
  --papier:      #f6efdc;
  --prairie:     #4f7a32;
  --ciel-haut:   #5d9ad8;
  --ciel-milieu: #a6cbec;
  --ciel-bas:    #eef0dc;
  --serif:       "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --capitales:   "Cormorant SC", Georgia, "Times New Roman", serif;
  --titre:       "IM Fell English", "Cormorant Garamond", Georgia, serif;
  --titre-sc:    "IM Fell English SC", "Cormorant SC", Georgia, serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  min-height: 100vh;
  background: var(--papier);
  color: var(--encre);
  font-family: var(--serif);
  font-size: 19px;
  line-height: 1.45;
}
a { color: inherit; text-decoration: none; }
a:focus-visible { outline: 2px solid var(--laiton); outline-offset: 3px; }

/* siècles en petites capitales : <span class="sc">xix</span><sup>e</sup> */
.sc { font-variant: small-caps; letter-spacing: .02em; }
sup { font-size: .62em; line-height: 0; }

/* ---------- bandeau du site ---------- */
.barre {
  position: relative; z-index: 5;
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 8px;
  padding: 9px 28px;
  background: linear-gradient(#3b2c1c, #2c2015);
  border-bottom: 2px solid var(--laiton);
  color: var(--papier);
  font-size: 17px;
}
.barre a { padding: 4px 0; }
.barre a:hover { color: var(--laiton-clair); }
.barre .accueil-lien { color: var(--laiton-clair); }
.barre .chapitre-titre { font-family: var(--titre); color: var(--papier); }

/* ---------- cadre d'un module encore en Flash (module.html) ---------- */
main.scene {
  position: relative;
  width: min(100% - 32px, 1000px, (100vh - 110px) * 1.25);
  aspect-ratio: 1000 / 800;
  margin: 24px auto;
  background: #fff;
  border: 1px solid var(--laiton);
  box-shadow: 0 14px 40px rgba(40, 28, 10, .35);
}
main.scene ruffle-player, main.scene ruffle-object { width: 100%; height: 100%; display: block; }
.absent { text-align: center; padding: 3rem 1rem; color: var(--encre-douce); }
.absent a { color: var(--laiton-sombre); text-decoration: underline; }
body.module { background: radial-gradient(ellipse at 50% 0%, #fbf6e8, #e9dfc4); }

@media (max-width: 760px) {
  .barre { padding: 8px 16px; font-size: 16px; }
}

/* ---------- variables du gabarit « livre » (chapitre.css, repris de l'astronomie) ---------- */
:root {
  --nuit:       #2a1f14;     /* brun très foncé : fenêtres d'animation, texte sur laiton */
  --trait:      #5a4630;
  --trait-2:    #8a6c45;
  --or:         #c9a14a;     /* laiton */
  --or-clair:   #e6c47e;
  --texte:      #f6efdc;
  --texte-doux: #d9c9a6;
}

/* ---------- chapitres : le livre posé sur le ciel de l'accueil ---------- */
body.chapitre {
  background:
    radial-gradient(ellipse 140% 30% at 30% 104%, #7fa85a 0 60%, transparent 61%),
    radial-gradient(ellipse 120% 26% at 85% 106%, #6f9d4a 0 60%, transparent 61%),
    linear-gradient(var(--ciel-haut), var(--ciel-milieu) 70%, var(--ciel-bas) 92%);
  background-attachment: fixed;
}
body.chapitre .navigation {
  background: rgba(44, 32, 21, .82);
  border-color: rgba(201, 161, 74, .55);
}
/* section en cours : médaillon de laiton, comme les numéros de l'accueil */
body.chapitre .navigation button[aria-current="true"] {
  color: #fff8e6;
  background: radial-gradient(circle at 35% 30%, #f1d38a, #b8862f 60%, #7a5420);
  border-color: #7a5420;
  text-shadow: 0 1px 1px rgba(60, 35, 5, .6);
}
/* navigation près du bandeau, petit espace avant le livre (sa reliure dépasse de 16 unités) */
body.chapitre .scene-livre { padding-top: 8px; gap: calc(10px + 16 * min(100vw, (100dvh - 170px) * 1200 / 760) / 1200); }
body.chapitre .livre { width: min(100% - 40px, 1400px, calc((100dvh - 175px) * 1200 / 760)); }
/* 15 sections : boutons un peu plus petits que dans l'astronomie */
body.chapitre .navigation { gap: 5px 6px; padding: 6px 14px; }
body.chapitre .navigation button { width: 36px; height: 36px; font-size: 16px; }
body.chapitre .navigation button.fleche { font-size: 22px; }
body.chapitre .navigation .repere { min-width: 13em; }
body.chapitre .partie { font-family: var(--titre); font-weight: 400; font-style: normal; }
