/* Carnet de la singularité (/singularite/) et Singularity Notebook (/singularity/) — feuille
   écrite à la main, sans Tailwind, partagée par les deux langues.
   Jour : papier chaud. Nuit : le bleu nuit du site (#0f172a), accent couleur braise
   (les étincelles de l'accueil). Suit le réglage de l'appareil ; le bouton de la barre
   force l'un ou l'autre (data-theme="jour" | "nuit", gardé dans localStorage). */

:root {
  --fond: #f7f4ee;
  --texte: #2a2a2e;
  --titre: #111827;
  --discret: #686870;
  --filet: #ded7c9;
  --accent: #9a4a12;
  --champ: #fffdf8;
  --lune: block;
  --soleil: none;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="jour"]) {
    --fond: #0f172a;
    --texte: #cbd5e1;
    --titre: #f1f5f9;
    --discret: #8b98ad;
    --filet: #26324a;
    --accent: #f0a35e;
    --champ: #131d33;
    --lune: none;
    --soleil: block;
    color-scheme: dark;
  }
}

:root[data-theme="nuit"] {
  --fond: #0f172a;
  --texte: #cbd5e1;
  --titre: #f1f5f9;
  --discret: #8b98ad;
  --filet: #26324a;
  --accent: #f0a35e;
  --champ: #131d33;
  --lune: none;
  --soleil: block;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--fond);
  color: var(--texte);
  font: 400 1.125rem/1.7 Lora, Georgia, serif;
  -webkit-font-smoothing: antialiased;
  transition: background-color .3s, color .3s;
}

@media (min-width: 640px) { body { font-size: 1.1875rem; } }

a {
  color: inherit;
  text-decoration-color: var(--accent);
  text-decoration-thickness: 1px;
  text-underline-offset: .18em;
}
a:hover { color: var(--accent); }
a:focus-visible, button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

sup { line-height: 0; }

/* Barre du haut */
.barre, main, .pied {
  max-width: 40rem;
  margin: 0 auto;
  padding-left: 1rem;
  padding-right: 1rem;
}
@media (min-width: 640px) {
  .barre, main, .pied { padding-left: 1.5rem; padding-right: 1.5rem; }
}

.barre {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
  font: 500 .875rem/1 Inter, system-ui, sans-serif;
}
.barre .site { color: var(--discret); text-decoration: none; letter-spacing: .01em; }
.barre .site:hover { color: var(--titre); }

.reglages { display: flex; align-items: center; gap: 1.25rem; }
.langue { color: var(--discret); text-decoration: none; letter-spacing: .08em; }
.langue:hover { color: var(--titre); }

.theme {
  margin: -.5rem;
  padding: .5rem;
  border: 0;
  border-radius: 50%;
  background: none;
  color: var(--discret);
  cursor: pointer;
}
.theme:hover { color: var(--titre); }
.theme svg { display: block; width: 1.125rem; height: 1.125rem; }
.theme .lune { display: var(--lune); }
.theme .soleil { display: var(--soleil); }

main { padding-bottom: 3rem; }

/* Titre du carnet */
.carnet { margin: 3.5rem 0 4rem; text-align: center; }
.carnet h1 {
  margin: 0;
  color: var(--titre);
  font: 400 clamp(2rem, 8vw, 2.75rem)/1.15 Lora, Georgia, serif;
  letter-spacing: -.01em;
}
.carnet h1 a { text-decoration: none; }
.carnet h1 a:hover { color: inherit; }
.carnet .auteur, .carnet-lien {
  color: var(--discret);
  font: 500 .75rem/1.4 Inter, system-ui, sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.carnet .auteur { margin: 1.1rem 0 0; }
.carnet-lien { margin: 2.5rem 0 1rem; }
.carnet-lien a { text-decoration: none; }

/* Tiroir « À propos » */
.tiroir { max-width: 34rem; margin: 1.6rem auto 0; text-align: left; }
.tiroir summary {
  color: var(--discret);
  font: 500 .8125rem/1.4 Inter, system-ui, sans-serif;
  text-align: center;
  list-style: none;
  cursor: pointer;
}
.tiroir summary::-webkit-details-marker { display: none; }
.tiroir summary::after { content: " +"; }
.tiroir[open] summary::after { content: " −"; }
.tiroir summary:hover { color: var(--titre); }
.tiroir .texte {
  margin-top: 1.1rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--filet);
  font-size: 1rem;
  line-height: 1.65;
}
.tiroir .signature { font-style: italic; text-align: right; }
.tiroir .pratique {
  margin-top: .25rem;
  padding-top: 1rem;
  color: var(--discret);
  font: 400 .8125rem/1.6 Inter, system-ui, sans-serif;
}
.tiroir .pratique p { margin-bottom: .6em; }

/* Entrées : date en petit, titre, texte, lieu au bas */
.entree { margin: 0 0 4rem; }
.entree + .entree { padding-top: 4rem; border-top: 1px solid var(--filet); }

.date {
  margin: 0 0 .6rem;
  color: var(--discret);
  font: 400 .8125rem/1.4 Inter, system-ui, sans-serif;
  letter-spacing: .02em;
}
.date sup, .quand sup { font-size: .7em; }

.titre {
  margin: 0 0 2rem;
  color: var(--titre);
  font: 400 clamp(1.6rem, 5.5vw, 2rem)/1.2 Lora, Georgia, serif;
  letter-spacing: -.005em;
}
.seule .titre { font-size: clamp(1.875rem, 7vw, 2.5rem); margin-bottom: 2.5rem; }
.titre a { text-decoration: none; }

.lieu {
  margin: 2rem 0 0;
  color: var(--discret);
  font-style: italic;
  text-align: right;
}

/* Pas de césure : le texte est en drapeau, et elle couperait les noms (PHA-SEONE10841). */
.texte p { margin: 0 0 1.1em; overflow-wrap: break-word; }

.texte hr {
  height: auto;
  margin: 2.6rem 0;
  overflow: visible;
  border: 0;
  color: var(--discret);
  text-align: center;
}
/* Espaces ordinaires élargies : l'espace cadratin (\2003) n'existe pas dans Lora (carrés vides). */
.texte hr::before { content: "* * *"; font-size: 1rem; word-spacing: .6em; }

.texte blockquote {
  margin: 0 0 1.1em;
  padding-left: 1.25rem;
  border-left: 2px solid var(--filet);
  font-style: italic;
}

.appel a {
  padding: 0 .1em;
  color: var(--accent);
  font: 600 .68em Inter, system-ui, sans-serif;
  text-decoration: none;
}

.notes {
  margin-top: 2.6rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--filet);
  color: var(--discret);
  font-size: .875rem;
  line-height: 1.6;
}
.notes ol { margin: 0; padding-left: 1.25rem; }
.notes li { margin-bottom: .8em; padding-left: .25rem; }
.notes li::marker { color: var(--accent); font: 600 .8em Inter, system-ui, sans-serif; }
.notes li:target { color: var(--texte); }
.notes p { margin: 0; overflow-wrap: anywhere; }
.retour { text-decoration: none; }

/* Précédente / suivante */
.suite {
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  margin: 0 0 1rem;
  font: italic 400 1rem/1.4 Lora, Georgia, serif;
}
.suite a { max-width: 48%; text-decoration: none; }
.suite .apres { text-align: right; }
.suite span {
  display: block;
  margin-bottom: .3rem;
  color: var(--discret);
  font: 500 .75rem/1 Inter, system-ui, sans-serif;
  font-style: normal;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.sommaire { margin: 0 0 3rem; padding-top: 2.25rem; border-top: 1px solid var(--filet); }
.sommaire h2, .abonnement h2 {
  margin: 0 0 .9rem;
  color: var(--titre);
  font: 600 .75rem/1.4 Inter, system-ui, sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.sommaire ul { margin: 0; padding: 0; list-style: none; }
.sommaire li { margin: .45rem 0; }
.sommaire a { text-decoration: none; }
.quand {
  margin-left: .4rem;
  color: var(--discret);
  font: 400 .8125rem/1.4 Inter, system-ui, sans-serif;
  white-space: nowrap;
}

/* Abonnement */
.abonnement { margin-top: 3rem; padding-top: 2.25rem; border-top: 1px solid var(--filet); }
.abonnement > p { margin: 0 0 1rem; }

.champ { display: flex; flex-wrap: wrap; gap: .5rem; }
.champ input {
  flex: 1 1 14rem;
  min-width: 0;
  padding: .72rem .9rem;
  border: 1px solid var(--filet);
  border-radius: .5rem;
  background: var(--champ);
  color: var(--titre);
  font: 400 1rem/1.4 Inter, system-ui, sans-serif;
}
.champ input::placeholder { color: var(--discret); opacity: .8; }
.champ input:focus { border-color: var(--accent); outline: 1px solid var(--accent); }
.champ button {
  flex: 0 0 auto;
  padding: .8rem 1.25rem;
  border: 0;
  border-radius: .5rem;
  background: var(--titre);
  color: var(--fond);
  font: 600 .9375rem/1 Inter, system-ui, sans-serif;
  cursor: pointer;
  transition: background-color .2s;
}
.champ button:hover { background: var(--accent); }
.champ button:disabled { opacity: .6; cursor: default; }

.formulaire.fait .champ { display: none; }
.etat { margin: .75rem 0 0; font: 400 .9375rem/1.5 Inter, system-ui, sans-serif; }
.etat:empty { display: none; }
.formulaire.fait .etat { margin-top: 0; color: var(--titre); }

.discret {
  margin: .9rem 0 0;
  color: var(--discret);
  font: 400 .8125rem/1.5 Inter, system-ui, sans-serif;
}

.robot { position: absolute; left: -9999px; }
.cache {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.soutien { margin: 2.25rem 0 0; font-style: italic; }

/* Pied */
.pied {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .25rem 1.25rem;
  padding-top: 1.5rem;
  padding-bottom: 2.5rem;
  border-top: 1px solid var(--filet);
  color: var(--discret);
  font: 400 .8125rem/1.6 Inter, system-ui, sans-serif;
}
.pied a { text-decoration: none; }
.pied a:hover { color: var(--titre); }

@media (prefers-reduced-motion: reduce) {
  body, .champ button { transition: none; }
}
